website - fátima escola de triatlo - epo.pt · em estudo que neste caso é o desenvolvimento de...
TRANSCRIPT
» PROVA DE APTIDÃO PROFISSIONAL «
Website - Fátima Escola de Triatlo
EPO.007.15
Curso Profissional de Técnico de Gestão de Equipamentos Informáticos
Aluno: Ana Luísa Pereira
N.º 3415
O. Projeto: José Carlos Alves
Ano letivo 2017 /2018
Página 2 de 24
“Não tropeçamos nas grandes montanhas, mas nas pequenas pedras”
Augusto Cury
Página 3 de 24
Índice Nota Prévia .................................................................................................................................... 5
Introdução ..................................................................................................................................... 6
Objetivos ....................................................................................................................................... 7
Escolha da Plataforma ................................................................................................................... 8
Linguagem usada na Plataforma ................................................................................................. 10
Etapas na elaboração do Site ...................................................................................................... 12
Domínio e alojamento ............................................................................................................. 12
Tema ........................................................................................................................................ 13
Plugins ..................................................................................................................................... 14
Contact Form 7 .................................................................................................................... 15
Duplicate Post ..................................................................................................................... 15
Revolution Slider ................................................................................................................. 16
WPBakery Page Builder ....................................................................................................... 16
Estrutura dos menus ............................................................................................................... 17
Menu Home......................................................................................................................... 17
Menu Escalões ..................................................................................................................... 18
Menu Treinos ...................................................................................................................... 18
Menu Atletas ....................................................................................................................... 19
Menu Palmarés ................................................................................................................... 19
Menu Equipa Técnica .......................................................................................................... 20
Menu Órgãos Sociais ........................................................................................................... 20
Menu Provas ....................................................................................................................... 21
Menu Contactos .................................................................................................................. 21
Widgets ................................................................................................................................... 22
Conclusão .................................................................................................................................... 23
Agradecimentos .......................................................................................................................... 24
Página 4 de 24
Índice de Figuras Figura 1 - Logótipo Wordpress ...................................................................................................... 8
Figura 2 - Logótipo da Joomla ....................................................................................................... 8
Figura 3 - Logótipo do Drupal ........................................................................................................ 9
Figura 4 - Logótipo da Magento .................................................................................................... 9
Figura 5 - Exemplo Código PHP ................................................................................................... 11
Figura 6 - Acesso ao Cpanel do Domínio ..................................................................................... 12
Figura 7 - Tema escolhido para o projeto ................................................................................... 13
Figura 8 - Tema já instalado ....................................................................................................... 13
Figura 9 - Personalização do tema .............................................................................................. 14
Figura 10 - Listagem dos plugins instalados ................................................................................ 14
Figura 11 - Plugin Contact Form .................................................................................................. 15
Figura 12 - Plugin Duplicate Post................................................................................................. 15
Figura 13 - Alguns Sliders criados para o site .............................................................................. 16
Figura 14 - Elementos disponíveis no WPBakery ........................................................................ 16
Figura 15 - Estrutura de menus (cabeçalho das páginas) ........................................................... 17
Figura 16 - Menu Home .............................................................................................................. 17
Figura 17 - Menu Escalões ........................................................................................................... 18
Figura 18 - Menu Treinos ............................................................................................................ 18
Figura 19 - Menu Atletas ............................................................................................................. 19
Figura 20 - Menu Palmarés ......................................................................................................... 19
Figura 21 - Menu Equipa Técnica ................................................................................................ 20
Figura 22 - Menu Órgãos Sociais ................................................................................................. 20
Figura 23 - Menu Provas ............................................................................................................. 21
Figura 24 - Menu Contactos ........................................................................................................ 21
Figura 25 - Widgets Rodapé ........................................................................................................ 22
Página 5 de 24
Nota Prévia
Como aluna finalista do 3º ano do curso de Gestão de Equipamentos Informáticos, da
Escola Profissional de Ourém (EPO), para a conclusão do curso, temos de realizar uma Prova de
Aptidão Profissional (PAP).
A minha Prova de Aptidão Profissional consiste na elaboração de um projeto, projeto
esse que se refere à criação de um Website, para a Fátima Escola de Triatlo, este website terá
como objetivo divulgar o que a escola faz, e explicar um pouco da modalidade – Triatlo (Ciclismo,
Corrida e Natação), e outro objetivo é da promoção do que os atletas da escola fazem e as provas
onde participam
Este projeto baseia-se na aplicação de alguns conhecimentos adquiridos ao longo dos
três anos de duração do curso e ainda, aprofundar outros conteúdos importantes para a área
em estudo que neste caso é o desenvolvimento de conteúdos para o web, é uma outra vertente
do curso.
Página 6 de 24
Introdução
Este projeto “prático” baseia se na elaboração de um website para a Fátima Escola de
Triatlo, escola esta que exerce 3 modalidades de desporto (Corrida, Natação e Ciclismo). O
website irá ser uma plataforma online feita de raiz, com base na plataforma Wordpress.
Este projeto consiste na possibilidade de ter oportunidade de fazer uma plataforma que
no futuro torne visível a Fátima Escola de Triatlo e as suas informações, o site vai ter os seguintes
menus:
HOME
ESCALÕES
TREINOS
ATLETAS
PALMARÉS
EQUIPA TÉCNICA
ORGÃOS SOCIAIS
PROVAS
CONTACTOS
Página 7 de 24
Objetivos
Com este projeto pretende-se apresentar um website Da Fátima Escola de Triatlo, como já foi
referido anteriormente é uma escola que exerce 3 modalidade de desporto: Natação, Corrida e
Ciclismo.
Sabendo que a escola não tinha até ao momento presença online, pensou-se que esta seria uma
boa parceria, para criar o website da mesma e assim aproveitar o domínio e alojamento já
adquiridos anteriormente pela direção da escola.
Alguns objetivos para a realização deste projeto são:
Divulgar a Fátima Escola de Triatlo
Cativar novos atletas para se juntarem à “família”
Divulgar o que a escola faz
Criar a plataforma de modo a que novos atletas possam inscrever-se nesta escola
Mostrar os vários escalões dos atletas pertencentes à escola
Manter as pessoas informadas sobre a escola
Difundir a escola através das redes sociais
Página 8 de 24
Escolha da Plataforma A plataforma a utilizar será para a criação do site é Wordpress1, no entanto a escolha foi
feita comparando-a com outras plataformas existentes.
O Wordpress é um sistema de gestão de conteúdo que lhe permite criar e manter, de
maneira simples e robusta, todo o conteúdo de um site. Combina estética, standards da Web e
usabilidade. Apesar de ser grátis, tem um valor inestimável. Mais simplesmente, o Wordpress é
óptimo para progredir com um sistema de blog ou site em vez lutar contra ele. É uma solução
Open Source, sendo assim o seu código gratuito e aberto.
Joomla é um CMS (Content Management System) para gestão de portais web,
desenvolvido a partir do Mambo. É escrito em PHP e roda em Host com servidor web Apache e
base de dados MySQL. O Joomla é um projeto de código aberto tal como o Wordpress (licença
GNU/GPL). Instalar o Joomla é relativamente simples e requer apenas conhecimentos básicos
de informática, sem necessidade conhecer nenhuma linguagem de programação. Com um
servidor de internet e uma base de dados, é possível obter um site completo, sem erros e seguro.
1 A versão usada no website é a WordPress 4.9.5
Figura 1 - Logótipo Wordpress
Figura 2 - Logótipo da Joomla
Página 9 de 24
Drupal é um framework modular e um sistema de gerenciamento de conteúdo (CMS)
escrito em PHP. O Drupal permite criar e organizar conteúdo, manipular a aparência,
automatizar tarefas administrativas e definir permissões e papéis para utilizadores e
colaboradores. Por ser desenvolvido em PHP, o Drupal é independente do sistema operativo.
No entanto, requer um servidor HTTP compatível com PHP, como o Servidor Apache e um
Servidor de base de dados como o MySQL, recomendado para o seu funcionamento. O Drupal é
comumente descrito como um Framework de gestão de conteúdo, pois além de oferecer as
funcionalidades básicas de um CMS ele também implementa uma série de APIs robustas e
apresenta uma estrutura modular que facilita o desenvolvimento de módulos extensivos.
Magento é um sistema de e-commerce desenvolvido pela Magento INC, e que possui
três edições, sendo a edição CE a versão livre. O Magento eCommerce está a tornar-se cada vez
mais popular no mundo, sendo utilizado como base para as lojas virtuais, e por grande como
Fox, Nokia entre outras.
Figura 3 - Logótipo do Drupal
Figura 4 - Logótipo da Magento
Página 10 de 24
Linguagem usada na Plataforma
A linguagem usada no site é html com PHP, a linguagem surgiu em meados de 1994,
como um pacote de programas CGI criados por Rasmus Lerdorf, com o nome Personal Home
Page Tools, para substituir um conjunto de scripts Perl que ele usava no desenvolvimento de
sua página pessoal. Em 1997 foi lançado o novo pacote da linguagem com o nome de PHP/FI,
trazendo a ferramenta Forms Interpreter, um interpretador de comandos SQL. Mais tarde, Zeev
Suraski desenvolveu o analisador do PHP 3 que contava com o primeiro recurso de orientação a
objetos, que dava poder de alcançar alguns pacotes, tinha herança e dava aos desenvolvedores
somente a possibilidade de implementar propriedades e métodos. Pouco depois, Zeev e Andi
Gutmans escreveram o PHP 4, abandonando por completo o PHP 3, dando mais poder à
máquina da linguagem e maior número de recursos de orientação a objetos. O problema sério
que apresentou o PHP 4 foi a criação de cópias de objetos, pois a linguagem ainda não trabalhava
com apontadores ou handlers, como são as linguagens Java, Ruby e outras. O problema fora
resolvido na versão atual do PHP, a versão 5, que já trabalha com handlers. Caso se copie um
objeto, na verdade copiaremos um apontador, pois, caso haja alguma mudança na versão
original do objeto, todas as outras também sofrem a alteração, o que não acontecia na PHP 4.
Trata-se de uma linguagem extremamente modularizada, o que a torna ideal para
instalação e uso em servidores web. Diversos módulos são criados no repositório de extensões
PECL (PHP Extension Community Library) e alguns destes módulos são introduzidos como padrão
em novas versões da linguagem. É muito parecida, em tipos de dados, sintaxe e mesmo funções,
com a linguagem C e com a C++. Pode ser, dependendo da configuração do servidor, embarcada
no código HTML. Existem versões do PHP disponíveis para os seguintes sistemas operativos:
Windows, Linux, FreeBSD, Mac OS, OS/2, AS/400, Novell Netware, RISC OS, AIX, IRIX e Solaris.
Construir uma página dinâmica baseada em bases de dados é simples com PHP, este provê
suporte a um grande número de bases de dados: Oracle, Sybase, PostgreSQL, InterBase, MySQL,
SQLite, MSSQL, Firebird, etc., podendo abstrair a base de dados com a biblioteca ADOdb, entre
outras.
PHP tem suporte aos protocolos: IMAP, SNMP, NNTP, POP3, HTTP, LDAP, XML-RPC, SOAP. É
possível abrir sockets e interagir com outros protocolos. E as bibliotecas de terceiros expandem
ainda mais estas funcionalidades. Existem iniciativas para utilizar o PHP como linguagem de
programação de sistemas fixos. A mais notável é a PHP-GTK. Trata-se de um conjunto do PHP
Página 11 de 24
com a biblioteca GTK, portada do C++, fazendo assim softwares interoperacionais entre
Windows e Linux. Na prática, essa extensão tem sido muito pouco utilizada para projetos reais.
Em junho de 2004 foi lançada a versão 5 do PHP, introduzindo um novo modelo de orientação
a objeto, incluindo a reformulação dos construtores e adição de destrutores (ver exemplo
contextualizado em anexo), visibilidade de acesso, abstração de objeto e interfaces de objetos.
O tratamento de objetos do PHP foi completamente reescrito, permitindo um desempenho
melhor e mais vantagens. Enquanto na versão anterior era preciso muito esforço para atender
à orientação a objetos e aos padrões de projetos (alguns não eram possíveis), o PHP 5 veio para
sanar essa deficiência.
Um exemplo de programação PHP:
Figura 5 - Exemplo Código PHP
Página 12 de 24
Etapas na elaboração do Site
Domínio e alojamento
Muitas vezes confunde-se o conceito de domínio com alojamento web, porém são dois
conceitos totalmente diferentes, o alojamento de um site na internet é efetuado por um
servidor web onde se armazenam os conteúdos desse site (texto, imagens, vídeos etc) e que
disponibiliza para o público esses mesmos conteúdos na internet, normalmente de forma
ininterrupta.
Por outro lado, um domínio é como um nome na internet que aponta para um
determinado servidor onde esta o site alojado. Existem na internet centenas de extensões de
dominios quer sejam .pt, .com, .net, .org ou .pt representando diversos tipos de site ou países.
Assim, de forma a poder disponibilizar os conteúdos na internet necessita tanto de um
domínio tanto de um Alojamento Web quer seja ele Linux ou Windows, dependendo do tipo de
conteúdos que desejar alojar.
O domínio do site da Fátima Escola de Triatlo é: https://triatlodefatima.com
Figura 6 - Acesso ao Cpanel do Domínio
Página 13 de 24
Tema
Após a decisão na escolha da plataforma, o próximo passo foi a escolha do theme,
template para ser usado como base no wordpress, para tal foi feita alguma pesquisa na web,
sobre quais os melhores e mais adequado para a escola, de forma a que possa permitir uma
maior personalização e assim fazer um site mais apelativo e adequado aos dias de hoje.
O tema escolhido foi o Alterna, neste site optou-se por uma versão demo, e que a escola
será informada, que deve comprar a licença da mesma, para que no futuro tenha acesso às
respetivas atualizações:
Figura 8 - Tema já instalado
Figura 7 - Tema escolhido para o projeto
Página 14 de 24
Depois de instalado o tema, temos a hipótese de personalizar algumas opções para o
website, neste caso a colocação do logotipo no site, a escolha do tipo de letra e as cores para o
site, também no rodapé (Footer) colocou-se as informações do copyright.
Após a instalação do tema, segue-se a instalação dos plugins
para que o tema funciona na sua plenitude, plugins. Plugins
WordPress são complementos que agregam ou modificam
funcionalidades em um site WordPress. Estas ferramentas oferecem
funções para que cada utilizador possa personalizar o website
Wordpress atendendo as necessidades do projeto, neste caso o FET
– Fátima Escola de Triatlo.
Plugins
Figura 9 - Personalização do tema
Figura 10 - Listagem dos plugins instalados
Página 15 de 24
Contact Form 7
Contact Form 7 pode gerir múltiplos formulários de contacto, adicionalmente pode personalizar
facilmente o formulário e os conteúdos do correio com markup simples. O formulário suporta
envio com Ajax, CAPTCHA, filtros de spam Akismet e outros. No nosso caso está inserido no
menu Contactos do Website.
Duplicate Post
Este plug-in permite ao utilizador clonar páginas, post’s de qualquer tipo ou copiá-las para novos
rascunhos para uma edição à posterior. Neste caso foi feito para duplicar algumas páginas e
depois personalizá-las de acordo com os conteúdos.
Figura 11 - Plugin Contact Form
Figura 12 - Plugin Duplicate Post
Página 16 de 24
Revolution Slider
Sliders são uma solução de design que se tornaram extremamente populares principalmente
pela possibilidade de se colocar muita informação em pouco espaço. Outra característica que
faz com que os sliders sejam tão utilizados é que eles podem ser visualmente atrativos e
tornarem o website como um todo mais bonito. No site do FET, optou-se por criar vários de
acordo com os conteúdos de cada página.
WPBakery Page Builder
Plugin do WPBakery Page Builder (anteriormente Visual Composer) para WordPress – permite
criar qualquer layout que se possa imaginar com um construtor intuitivo, basta arrastar e soltar
- não é necessário muito conhecimento de programação.
Figura 13 - Alguns Sliders criados para o site
Figura 14 - Elementos disponíveis no WPBakery
Página 17 de 24
Estrutura dos menus
Menu Home
O primeiro menu do website, é o home, onde está a informação inicial da página da
Fátima Escola de Triatlo, informação do que é o triatlo, um separador com alguns eventos a
serem realizados, a origem da escola e uma galeria de imagens sobre algumas provas em que os
atletas da escola participaram.
Figura 15 - Estrutura de menus (cabeçalho das páginas)
Figura 16 - Menu Home
Página 18 de 24
Menu Escalões
O segundo menu são os Escalões, onde está a informação sobre os vários escalões de
todos os atletas que fazem parte da escola (FET).
Menu Treinos
O terceiro menu Treinos, aqui estão a informações onde e quando são realizados os
treinos dos atletas e quais os materiais necessários para a realização dos respetivos treinos.
Figura 17 - Menu Escalões
Figura 18 - Menu Treinos
Página 19 de 24
Menu Atletas
O quarto menu Atletas, este menu está separado pelos escalões dos atletas e de acordo
com a segurança de dados, optou-se por colocar uma imagem alusiva a cada atleta, laranja para
feminino e azul para masculino.
Menu Palmarés
O quinto menu Palmarés, este menu tem alguma informação sobre alguns troféus
ganhos pelos atletas da escola (FET), e do lado esquerdo uma galeria com imagens alusivas a
esses trofeus.
Figura 19 - Menu Atletas
Figura 20 - Menu Palmarés
Página 20 de 24
Menu Equipa Técnica
O sexto menu – Equipa técnica, aqui pode-se saber quais os treinadores pertencentes à
escola (FET).
Menu Órgãos Sociais
O sétimo menu – Órgãos Sociais, neste menu estão descriminados todos os elementos
que pertencem aos órgãos sociais da escola (FET), estão divididos por separadores (Assembleia
Geral, Conselho Fiscal e Direção).
Figura 22 - Menu Órgãos Sociais
Figura 21 - Menu Equipa Técnica
Página 21 de 24
Menu Provas
O oitavo menu – Provas, neste menu estão as provas organizadas pela Federação
Portuguesa de Triatlo, e utilizou-se uma hiperligação ao site oficial da Federação, assim temos
sempre a calendarização das provas atualizada de acordo com a federação.
Menu Contactos
O nono menu – Contactos, neste menu estão disponíveis os contactos da escola (FET), a
localização com o Google maps e um formulário para eventuais dúvidas a serem colocadas à
escola (FET).
Figura 23 - Menu Provas
Figura 24 - Menu Contactos
Página 22 de 24
Widgets
Widgets são ferramentas que cada tema oferece para adicionar conteúdos na barra de
rodapé no caso do site do (FET). É simples de ser editado e podem ser diferenciados de acordo
com o tema, neste caso existem três widgets, um com os contactos, outro com um vídeo da
escola e outro com a ligação ao grupo do facebook da escola.
Figura 25 - Widgets Rodapé
Página 23 de 24
Conclusão
Este projeto foi concluído com sucesso, o objetivo foi o de criar uma base que possa ser
atualizada no futuro, pelos membros da Fátima Escola de Triatlo, pois como sabemos a internet
está sempre em mudança, e os sites para não se tornarem obsoletos, devem ser sempre
atualizados, para cativar sempre a “audiência”.
Ao longo do projeto deparei-me com algumas dificuldades, mas como a comunidade
que utiliza a plataforma Wordpress é relativamente grande, fui sempre pesquisando e
ultrapassando as dificuldades encontradas.
Por último foi importante a realização deste projeto, pois adquiri algumas competências
que poderei colocar em prática no meu futuro profissional.
Página 24 de 24
Agradecimentos
Este projeto foi concluído com sucesso, o objetivo foi o de criar uma base que possa ser
atualizada no futuro, pelos próprios colaboradores da Fátima Escola de Triatlo.
Contudo quero agradecer à Fátima Escola de Triatlo, pela oportunidade que me deram
de fazer este site e estar dentro deste projeto.
Um agradecimento em especial para o professor José Carlos Alves (Orientador de
Curso), por todo o apoio que me deu durante a realização deste projeto.
Gostaria de agradecer também ao professor Carlos Gonçalves (Orientador de Turma) por
também ter estado sempre disponível para qualquer dúvida e também por dar o seu apoio.
Por fim gostaria de agradecer a todos os professores que nestes longos 3 anos de curso
que “decorreram num abrir e fechar de olhos”, por terem também estado disponíveis para tudo
o que precisava e por me ajudarem quando eu mais precisava e por me darem o seu maior apoio
e força para continuar para a frente.