HTML Introdução, A.Barão, HTML HTML - Hypertext Markup Language Um programa HTML reside num ficheiro de texto simples (extensão: html ou htm) A linguagem é simples de aprender Um programa HTML inclui uma série de tags colocadas no texto que se reflectem na página Web As tags são instruções que especificam que um determinado bloco de texto é um título, outro bloco deve ser visualizado a itálico, etc...
HTML Introdução, A.Barão, HTML exhtml01.html
HTML Introdução, A.Barão, HTML Fundamentos de Programação para a Web Objectivos Sessão 1 Sessão 2 Sessão 3 exhtml01.html [HTML-C,00]
HTML Introdução, A.Barão, HTML Declara que o texto seguinte define uma página HTML que pode ser visualizada num Web browser. A tag termina a página. Define a área de cabeçalho (header) da página. A tag termina a zona de cabeçalho.
HTML Introdução, A.Barão, HTML Define o título da página que é visualizado na barra de título do browser. A tag termina o título. Nota: usado pela Web em pesquisas e indexações, Em alguns browsers a descrição também serve para identificar a página quando se adiciona o endereço aos favoritos. Delimita/caracteriza o conteúdo que será visualizado na página. A tag termina a zona de conteúdo.
HTML Introdução, A.Barão, HTML Marca o início de um parágrafo. termina o parágrafo. É opcional no entanto deve ser incluído para facilitar a interpretação do código por terceiros. Provoca uma mudança de linha sem adição de caracteres extra no código HTML Horizontal line/horizontal rule. Útil para representar secções na página. Utilizado para comentar o código. O browser ignora as descrições entre esta tag e. Ou
HTML Introdução, A.Barão, HTML Headings Uma página Web pode ter no máximo 6 níveis de headings Os browsers visualizam a informação respeitando o nível de subordinação dos headings. Nível alto Nível baixo
HTML Introdução, A.Barão, HTML exhtml02.html
HTML Introdução, A.Barão, HTML F.P. Web Objectivos Sessão 1 Apresentação da cadeira Compreender a Web exhtml02.html (…) As linhas podem ser formatadas com alinhamento Ex: RIGHT LEFT CENTER
HTML Introdução, A.Barão, HTML Apresentar a informação em forma de lista Lista Ordenada Os elementos ficam numerados Lista Não Ordenada Os elementos ficam marcados Lista “Definition” Os elementos são compostos por dois itens, o 2º fica identado em relação ao 1º Lista “Menu” Lista estruturada não numerada Lista de Directório Semelhante à Lista “Menu” mas orientada para elementos de nome curto Interpretadas actualmente como listas não ordenadas
HTML Introdução, A.Barão, HTML exhtml03.html
HTML Introdução, A.Barão, Lista Ordenada HTML Ordered List Sessão 1 List Item Sessão 2 Sessão 3 exhtml03.html (…)
HTML Introdução, A.Barão, HTML exhtml04.html
HTML Introdução, A.Barão, Lista Não Ordenada HTML Unordered List Sessão 1 List Item Sessão 2 Sessão 3 exhtml04.html (…)
HTML Introdução, A.Barão, HTML exhtml05.html
HTML Introdução, A.Barão, Lista “Definition” HTML Definition List Sessão 1 Definition Term Apresentação da cadeira Definition Description Compreender a Web Sessão 2 Planear e desenhar uma Web Page Compreender o processo de concepção de um sistema hipertexto Respeitar questões e príncipios da concepção cognitiva de hiperdocumentos Conhecer a HTML exhtml05.html (…)
HTML Introdução, A.Barão, HTML exhtml06.html
HTML Introdução, A.Barão, Texto Pré-formatado HTML As posições relativas do Vannevar Bush texto são respeitadas. As We May Think, The Atlantic Monthly, July 1945 exhtml06.html (…)
HTML Introdução, A.Barão, HTML exhtml06.html
HTML Introdução, A.Barão, Texto Não Pré-formatado HTML As posições relativas do Vannevar Bush texto não são respeitadas. As We May Think, The Atlantic Monthly, July 1945 exhtml06.html (…)
HTML Introdução, A.Barão, HTML Formatação de Caracteres Bold Itálico Sublinhado Letra Fixa Ênfase Importante Citação
HTML Introdução, A.Barão, HTML exhtml07.html
HTML Introdução, A.Barão, HTML Formatação de Caracteres HTML exhtml07.html (…) Vannevar Bush As We May Think, The Atlantic Monthly, July 1945
HTML Introdução, A.Barão, HTML Caracteres especiais Exemplo: <>&“áÀçê<>&“áÀçê < > & " á À ç ê Após a utilização de um código deve ser colocado um ponto e vírgula.
HTML Introdução, A.Barão, HTML Caracteres especiais HTML exhtml08.html (…) <Programação para a Web>
HTML Introdução, A.Barão, HTML exhtml08.html
HTML Introdução, A.Barão, HTML Imagens em documentos HTML ou num computador remoto:
HTML Introdução, A.Barão, HTML exhtml09.html
HTML Introdução, A.Barão, HTML Imagens em documentos HTML HTML exhtml09.html (…) O qualificador BORDER coloca uma linha delimitadora à volta da figura, com uma espessura controlada em pixels
HTML Introdução, A.Barão, HTML exhtml10.html
HTML Introdução, A.Barão, HTML Imagens em documentos HTML HTML exhtml10.html (…) Península Ibérica TOP MIDDLE BOTTOM LEFT RIGHT A posição relativa do texto em relação à imagem muda.
HTML Introdução, A.Barão, HTML exhtml11.html
HTML Introdução, A.Barão, HTML Imagens em documentos HTML HTML exhtml11.html (…)
HTML Introdução, A.Barão, HTML Imagens em documentos HTML HTML Sobre as imagens… As imagens estão normalmente em formatos gráficos: *.GIF Graphic Interchange Format *.JPEG Joint Photographic Experts Group Exploração: Animated Interlaced Transparent
HTML Introdução, A.Barão, HTML exhtml12.html
HTML Introdução, A.Barão, HTML Cores em documentos HTML HTML exhtml12.html (…) Tabela RGB recomendada R G B CC CC CC FF FF FF red green blue componentes
HTML Introdução, A.Barão, HTML exhtml13.html
HTML Introdução, A.Barão, HTML Fontes em documentos HTML HTML exhtml13.html (…) Texto Vermelho Texto alvo Valor RGB Nome das fontes por ordem de preferência separadas por vírgulas Ex: “Arial, Times New Roman, Courier” 1 a 7 3=padrão ou +n -n em relação ao tamanho existente
HTML Introdução, A.Barão, HTML exhtml14.html
HTML Introdução, A.Barão, HTML Tabelas HTML exhtml14.html (…) Tabela Coluna 1 Coluna 2 Coluna 3 aaa bbb ccc Todas as linhas começam por para título da tabela por cada célula da tabela
HTML Introdução, A.Barão, HTML exhtml15.html
HTML Introdução, A.Barão, HTML Tabelas (continuação) HTML exhtml15.html (…) Tabela Coluna 1 Coluna 2 Coluna 3 aaa bbb ccc Tabela com moldura
HTML Introdução, A.Barão, HTML exhtml16.html
HTML Introdução, A.Barão, HTML Tabelas (continuação) HTML exhtml16.html (…) Tabela Coluna 1 Coluna 2 Coluna 3 aaa bbb ccc A tabela ocupa neste caso 50% da área cliente no ecrã
HTML Introdução, A.Barão, HTML exhtml17.html
HTML Introdução, A.Barão, HTML Tabelas (continuação) HTML exhtml17.html (…) FPW Sessão Planificação Objectivos Conteúdos 1 Apresentar a Cadeira A Web... Expectativas,Objectivos... Os qualificadores COLSPAN e ROWSPAN são aplicados às marcas e e definem o tamanho das células em colunas e linhas respectivamente
HTML Introdução, A.Barão, HTML Hiperligações (Texto do link) [CPWWW,98]
HTML Introdução, A.Barão, HTML links Exemplos pag.cinco Meteorologia Links internos (Texto do link) Definição da marca da secção link
HTML Introdução, A.Barão, HTML Links para páginas e serviços de outros protocolos Acesso a um servidor Ftp Arquivo Ftp da Eunet Enviar um mail nome da pessoa Alguns exemplos Nome da Pessoa nome da pessoa Endereço do autor, depois de
HTML Introdução, A.Barão, HTML Frames exhtml18.html
HTML Introdução, A.Barão, HTML Frames exhtml18.html
HTML Introdução, A.Barão, HTML Frames exhtml18.html
HTML Introdução, A.Barão, HTML Frames exhtml18.html (…)
HTML Introdução, A.Barão, HTML Frames menu.html (…) Objectivos Conteúdos
HTML Introdução, A.Barão, HTML Frames info.html (…) Seleccione um tópico
HTML Introdução, A.Barão, HTML Frames object.html (…) Apresentar a cadeira Compreender a Web, origens,...
HTML Introdução, A.Barão, HTML Frames conteud.html (…) Web Hipertexto Hipermédia
HTML Introdução, A.Barão, Standards World Wide Web Consortium