CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

21
CRIAÇÃO DE PÁGINAS WEB Professor : Pedro Lopes Ano Lectivo 2010/2011

Transcript of CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

Page 1: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

CRIAÇÃO DE PÁGINAS WEB

Professor:

Pedro Lopes

Ano Lectivo 2010/2011

Page 2: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

2

Sumário da aula n.º 101 e 102

Apresentação e introdução ao módulo Criação de páginas Web.

Técnicas de implantação de páginas na Web.

Planeamento de um Website.

Realização da ficha de trabalho n.º1.

2

Page 3: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

MÓDULO III – CRIAÇÃO DE PÁGINAS WEB

Competências Reconhecer editores e ferramentas para a Web Criar e definir documentos HTML Identificar técnicas de criação de paginação Web Identificar linguagens de programação para a Web Criar páginas na Web, utilizando editores e programas de animação

gráfica Publicar páginas na Web Criar e manter um Web site

3

Page 4: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

MÓDULO III – CRIAÇÃO DE PÁGINAS WEB

Conteúdos Técnicas de Implantação

Programação de páginas Web Editores de páginas Web Editores de imagens e efeitos especiais Editores e programas de animação gráfica Ferramentas e utilitários

Criação de páginas Web Conceitos de ergonomia e amigabilidade de uma página Web Conceitos de HTML e hipertexto

4

Page 5: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

Criação de um blogue Programa de edição de páginas Web

Apresentação do programa Planeamento e criação de um Web site Formatação e melhoramento da apresentação das páginas Web

Adição de estilos Formatação Inserção de imagens Adição de som de fundo Criação de formulários Utilização de frames

Hiperligações Criação e edição de links Animação Publicação Manutenção

5

Page 6: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

OBJECTIVOS DA AULA

Conhecer potencialidades da criação de páginas Web Conhecer diferentes técnicas de implantação de páginas Web Planear um Website

6

Page 7: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

PÁGINAS WEB O acesso à World Wide Web torna-se cada vez mais uma

forma de comunicação www – conjunto de documentos que contém ligações de uns

para outros, incluindo não apenas texto, mas também imagens, sons, vídeos, etc.

A informação apresentada neste sistema reside em documentos escritos numa linguagem específica: HTML – Hypertext Markup Language

Os computadores que contém informação neste sistema e que estão disponíveis para serem acedidos por outros computadores são chamados servidores web 7

Page 8: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

PÁGINAS WEB Para aceder aos servidores da Web e abrirmos páginas Web,

temos de utilizar um programa cliente de web – Web Browser

Um Website é um conjunto de páginas Web relacionadas entre si e alojadas num servidor Web

8

Page 9: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

POTENCIALIDADES Criar uma página Web permite gerar um ambiente com

muitas potencialidades: Promover a pesquisa de informação,

Promover produtos e serviços,

Fornecer informação filtrada, seleccionada e comentada,

Criar contextos propícios ao ensino a distância,

Criar “espaços virtuais” onde se pode conversar…

Criar ferramentas para trabalhar cooperativamente com outras pessoas,

Entre outras.

9

Page 10: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

PROGRAMAÇÃO DE PÁGINAS WEBPara criar uma página Web temos de utilizar uma das seguintes linguagens de programação:

HTML (Hipertext Markup Language) Linguagem mais utilizada Código baseado em marcas ou etiquetas (tags, em inglês)

10

<html>

<title> A minha primeira página </title>

<body>

<b>Olá Mundo!!! </b><br><br>Somos da turma 10ºD.

</body>

</html>

Page 11: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

PROGRAMAÇÃO DE PÁGINAS WEB DHTML (Dynamic Hypertext Markup Language)

Evolução da linguagem HTML Linguagem que torna os elementos da uma página (texto,

imagens, etc.) dinâmicos Linguagens de programação que complementam o DHTML

no sentido de permitirem incluir efeitos dinâmicos e interactivos nas páginas Web Java Script VB Script ASP PHP PERL

Os códigos destas linguagens são embebidos nos códigos dos documentos HTML 11

Page 12: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

PROGRAMAÇÃO DE PÁGINAS WEB VRML (Virtual Reality Modelling Language)

Linguagem que permite a criação de ambientes virtuais por onde se pode passear, visualizar objectos por ângulos diferentes e até interagir com eles.

http://users.isr.ist.utl.pt/~vale/other/casa3D/casa.html

XML (Extensible markup language) Enquanto o HTML permite descrever a aparência dos dados,

o XML permite descrever esses mesmos dados (conteúdo das webpages).

O autor de um documento XML inventa as suas próprias tags (etiquetas).

12

Page 13: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

EDITORES DE PÁGINAS WEB Os editores mais utilizados para a criação de

páginas web são: Microsoft FrontPage Macromedia Dreamweaver Freeware:

PageBreeze, Amaya, Nvu, Kompozer

13

Editor WYSIWYG (What you see is what you get – o que vês é o que obténs)

Permite inserir o conteúdo de forma gráfica, ficando a escrita dos códigos a cargo do editor

Page 14: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

EDITORES DE IMAGENS

Existem vários editores de imagem: Corel Draw

Gera desenhos vectoriais Cria imagens que recorrem à utilização de objectos armazenados

internamente como equações matemáticas (vectores)

Paint Shop Pro Gera imagens estáticas Permite manipular imagens de diversas formas e reconhece várias

extensões de ficheiros gráficos

Photoshop14

Page 15: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

Imagens do tipo mapa de bits

15

Imagens do tipo vectorial

Page 16: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

16

Page 17: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

EDITORES DE ANIMAÇÃO GRÁFICA

Embora não deva ser utilizada em excesso, a verdade é que a animação de imagens permite captar atenções. Para criar animação existem vários programas:

Flash Programa de tratamento de animação vectorial. Permite criar animações

interactivas para a Web.

GIF Animator Programa que visa a produção de imagens animadas. Permite manipular

imagens com formato GIF.

COOL 3D Programa que gera animações a 3D.

17

Page 18: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

PUBLICAR UM WEBSITE NA WEB Depois do website concluído é necessário colocá-lo na

Internet para que possa ser acedido.

Esta operação consiste, essencialmente, na colocação de todos os ficheiros que o constituem num servidor, ao qual corresponderá um determinado endereço URL (Uniform Resource Locator).

O protocolo para transferência de ficheiros (FTP – File Transfer Protocol) é o protocolo especializado no envio de ficheiros pela Internet.

18

Page 19: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

PUBLICAR UM SITE NA WEB Para publicar um site na Web, existem diversas ferramentas, como por exemplo:

WSFTP

CuteFTP

Estes programas permitem transferir informação de um computador para um servidor (computador que armazena um site e que o mantém disponível na web).

Para transferir um site para um servidor, é preciso a identificação de utilizador e palavra-passe.

O explorador do Windows executa FTP directamente, sem necessidade de recorrer a outro software.

19

Page 20: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

FASES DE PLANEAMENTO DE UM WEBSITE

20

Page 21: CRIAÇÃO DE PÁGINAS WEB Professor: Pedro Lopes Ano Lectivo 2010/2011.

REVISÃO DA AULA

21