A apresentação está carregando. Por favor, espere

A apresentação está carregando. Por favor, espere

1 Técnicas de Implementação de páginas web Técnicas de Implementação de páginas web Criação de Páginas Web Criação de Páginas Web Microsoft FrontPage:

Apresentações semelhantes


Apresentação em tema: "1 Técnicas de Implementação de páginas web Técnicas de Implementação de páginas web Criação de Páginas Web Criação de Páginas Web Microsoft FrontPage:"— Transcrição da apresentação:

1 1 Técnicas de Implementação de páginas web Técnicas de Implementação de páginas web Criação de Páginas Web Criação de Páginas Web Microsoft FrontPage: Planeamento e criação de um Web site Microsoft FrontPage: Planeamento e criação de um Web site Operações com Web Sites: criar, abrir e fechar Operações com Web Sites: criar, abrir e fechar Modos de Visualização de website e de uma página Web Modos de Visualização de website e de uma página Web

2 2 Técnicas de Implementação de páginas web

3 3 Linguagens de Programação de páginas Web Java e Java Script Java e Java Script Visual Basic Script Visual Basic Script DHTML – Dynamic HTML DHTML – Dynamic HTML CSS – Cascading Style Sheets CSS – Cascading Style Sheets ASP - Active Server Pages ASP - Active Server Pages PHP - Hypertext Preprocesor PHP - Hypertext Preprocesor JSP – Java Server Pages JSP – Java Server Pages HTML

4 4 Editores de páginas web O Bloco de Notas é um processador de texto simples que permite inserir e formatar conteúdos utilizando o código HTML. Microsoft FrontPage Os editores de criação e gestão de páginas Web permitem inserir e formatar o conteúdo de forma gráfica. Macromedia Dreamweaver Adobe GoAlive

5 5 O Paint Shop Pro é um programa que permite fazer tratamento de imagens estáticas. É um editor de gráficos bitmap e vectoriais. Editores de imagens e efeitos especiais O PhotoShop é um editor de imagem profissional que permite editar imagens, tratar e digitalizar imagens estáticas. Também é possível manipular as imagens de todas as maneiras possíveis trabalhando com as mais utilizadas extensões de arquivos gráficos. Com a possibilidade de se instalar plug-ins que estão disponíveis para download em toda Internet permite também muita flexibilidade na escolha dos filtros e acessórios em geral.

6 6 O Corel Draw é um programa que permite manipular imagens vectoriais. Cria imagens usando formas de objectos armazenados internamente como equações matemáticas (vector), bem diferente das aplicações que utilizam bitmap, uma imagem composta pôr uma série de pontos. Editores de imagens e efeitos especiais

7 7 Ulead GIF Animator é um software de produção de imagens animadas. É a ferramenta que permite manipular imagens do tipo GIF Animado oferecendo diversos plug-ins e opcionais que fazem a diferença na hora de animar uma imagem. Ulead Cool 3D é um software que gera animações tridimensionais. Com esta ferramenta pode-se criar a forma gráfica que desejar com múltiplas características na criação e edição das imagens. É possível introduzir objectos tridimensionais nos projectos como esferas, cones, cilindros, cubos, etc.... Editores e programas de animação gráfica O Macromedia Flash é um programa que permite criar animações interactivas dimensionáveis e integrativas para a Web. É possível criar logotipos com animação e com controles direccionáveis para navegação em Web Sites. Com a utilização do flash a interactividade com o utilizador torna-se atractivo e a aceitação e a aprovação são quase imediatas. É uma ferramenta ideal para usar a criatividade devido à eficiência e flexibilidade.

8 8 O WS FTP é um programa simples que permite fazer a ligação a um servidor de páginas Web. Portanto, o programa faz a conexão com o servidor FTP e mostra numa das janelas (provavelmente será a da direita) um directório de ficheiros, e na outra janela os directórios do disco rígido, onde os ficheiros poderão ser descarregados. O Cute FTP é um programa de transferência de ficheiros que permite retomar um download interrompido. Basicamente, o programa faz a conexão com o servidor FTP e mostra na janela da direita um directório de ficheiros, e na da esquerda os directórios do disco rígido, onde os ficheiros poderão ser descarregados. Pode-se navegar pelos directórios, tanto do computador como do servidor remoto, da mesma forma como se faz no Windows Explorer. O CRT-Secure é um programa que permite a transferência segura de ficheiros pois fornece as potencialidades de transferência seguras, do início de uma sessão e dos dados do ShellT seguro (SSH) numa aplicação em que pode usar o telnet e conexões de série. CRT-Secure inclui a utilidade VCP para transferências de ficheiros encriptados SSH2. Ferramentas e Utilitários

9 9 Criação de Páginas Web

10 10 Conceitos de ergonomia e amigabilidade de uma página Web Ergonomia - A ergonomia é a disciplina científica relacionada com o entendimento das interacções entre seres humanos e outros elementos de um sistema, e também é a profissão que aplica teoria, princípios, dados e métodos para projectar a fim de optimizar o bem- estar humano e o desempenho geral de um sistema. Usabilidade - é sinonimo de facilidade de uso. Se um produto é fácil de usar, o utilizador tem maior produtividade: aprende mais rápido a usar, memoriza as operações e comete menos erros. Relativamente, a uma página web refere-se à simplicidade e facilidade com que um website pode ser utilizado WEB

11 11 Conceitos de ergonomia e amigabilidade de uma página Web A usabilidade está relacionada com os estudos de Ergonomia e da Interação Homem-computador. ErgonomiaInteração Homem-computadorErgonomiaInteração Homem-computador Assim, o site tem de ser agradável, acessível a todos os utilizadores, mesmo àqueles que possuam apenas os requisitos mínimos do sistema informático.

12 12 Conceitos de HTML e Hipertexto O que é o HTML? Para se publicar informação de distribuição global, é necessário utilizar-se uma linguagem de compreensão universal, uma espécie de Língua de publicação Mãe, a qual possa ser potencialmente usada e compreendida por todos os computadores. O HTML é a linguagem de publicação usada pela World Wide Web (do Inglês: Hyper Text Markup Language). O conceito de Hipertexto é muito simples: certos itens de um documento contém uma ligação a outra zona do mesmo documento, ou a outros documentos.

13 13 Conceitos de HTML e Hipertexto O HTML dá a possibilidade de: –Publicar documentos Online contendo cabeçalhos, texto, quadros e tabelas, listas, fotos, etc. –Recuperar ou retirar informações Online, por intermédio de ligações de hipertexto, clicando num botão. –Concepção de formulários para a realização de transacções com serviços remotos, para o uso na busca de informação, realização de reservas, encomenda de produtos, etc. –Inclusão directa nos documentos de folhas de difusão, de vídeo- clips, de spots ou clips sonoros e de outras aplicações. Página Web – documento multimédia que contém hiperligações Sitio Web – conjunto de páginas Web Web – conjunto de sitios Web Conceitos necessários:

14 14 Microsoft FrontPage: O ambiente de trabalho

15 15 PROGRAMA DE EDIÇÃO WEB: FRONTPAGE Janela da aplicação Barras de ferramentas e painel Barra de menus

16 16 Barra de título Janela de edição de páginas Web Painel de tarefas Barra de menus Selectores do modo de visualização Barra de ferramentas Padrão Barra de ferramentas Formatação Janela da Aplicação

17 17 Barra de menus Barra de ferramentas Padrão Barra de ferramentas Formatação Barra de ferramentas Efeitos DHTML Barra de ferramentas Imagens Barra de ferramentas Desenho Barra de ferramentas WordArt Painel de tarefas Barra de estado BARRAS DE FERRAMENTAS E O PAINEL

18 18 BARRA DE MENUS

19 19 Microsoft FrontPage: Planeamento e criação de um Web site

20 20 Planeamento de um sitio Web É a primeira tarefa a realizar antes de utilizar o FrontPage Tipos de perguntas que se deve responder sobre o sitio Web a implementar: –Qual é o objectivo da página? –A quem se dirige (público-alvo)? –Que informações deve conter? –Que recursos gráficos deve conter? –Que estilo gráfico de página é mais adequado?

21 21 Planeamento de um sitio Web Necessário definir os objectivos da página definição da estrutura, conteúdos e manutenção. Cada página deve conter informações-base para ser autónoma e consistente com as outras páginas. –Quem é o autor, de contacto –Que assunto se trata –Quando foi feita e/ou data da última actualização Apresentação gráfica do sítio –Ícones claros e consistentes –Identificação esquemática dos menus –Botões de navegação –Titulos, subtitulos, cabeçalhos, rodapés e links bem vísiveis

22 22 Planeamento de um sitio Web A informação deve estar disponível no mais curto período de tempo percorrendo o menor número de etapas. –Informação hierarquizada –Menus com poucos links –Ecrã não sobrecarregado (texto/imagens) abertura das páginas –Navegação do sítio Padrão consistente em todas as páginas

23 23 Planeamento de um sitio Web Hierarquizar a informação –Divisão da informação a incluir em cada página –Estabelecer a hierarquia entre as páginas –Determinar as ligações entre as páginas Estrutura do sitio

24 24 Planeamento de um sitio Web Informação –Na página principal, títulos e menus visíveis e acessíveis na parte superior da página –Evitar páginas extensas –Dividir a informação por várias páginas –Introduzir hiperligações –Página especifica com links Estrutura do sitio

25 25 Planeamento de um sitio Web É a identidade visual própria para manter em todas as páginas definição do aspecto visual da página Aspectos a ter em conta: –Cabeçalhos e rodapés –Títulos e subtítulos –Legibilidade do texto –Cores (3 ou menos) –Objectos Multimédia Imagens (GIF,JPG,PNG) Sons (Wave, Mpeg, MIDI) Vídeos (Mpeg, AVI, MOV) Consistência do sitio

26 26 Criação e Gestão do sitio Web Gestão do sitio Web – pessoa única para gerir –Deve: Responder aos s dos utilizadores Assegurar o funcionamento de grupos de discussão (se existir) Assegurar o funcionamento de chats (se existir) Interagir com os utilizadores – sempre visível no rodapé da página –Actualizar frequentemente o sitio Web

27 27 Criação e Gestão do sitio Web Criação, abertura e guarda de páginas –Menu Ficheiro, opção Novo, no painel Página em Branco –Na barra de ferramentas – Botão Nova Página

28 28 Criação e Gestão do sitio Web Criação, abertura e guarda de páginas –Na barra de ferramentas – seta do Botão Nova Página

29 29 Criação e Gestão do sitio Web Criação, abertura e guarda de páginas –Menu Ficheiro, opção Abrir, no painel Página em Branco –Na barra de ferramentas – Botão Abrir

30 30 Criação e Gestão do sitio Web Criação, abertura e guarda de páginas –Menu Ficheiro, opção Guardar, no painel Página em Branco –Na barra de ferramentas – Botão Guardar

31 31 Realizar Actividade 1


Carregar ppt "1 Técnicas de Implementação de páginas web Técnicas de Implementação de páginas web Criação de Páginas Web Criação de Páginas Web Microsoft FrontPage:"

Apresentações semelhantes


Anúncios Google