Índice:
- Os títulos resumem o conteúdo da página
- Links para a (s) folha (s) de estilo CSS
- Elementos, atributos e valores
- O papel (menos, mas ainda relevante) das meta tags
Vídeo: Curso de HTML5 - 21 - Interfaces em HTML5 2025
No elemento HTML de uma página que você está construindo para o seu site, existem dois elementos principais e definidores. O conteúdo visível da página está incluído na etiqueta e, em seguida, tudo o resto vai no elemento principal.
A seção de cabeçalho do documento HTML é onde o título da página é definido e também onde os links para arquivos nos quais a página HTML depende são definidos. Os elementos HTML dentro do elemento principal comunicam informações importantes, como o nome do site, uma descrição do conteúdo do site e a folha de estilo vinculada. Esta informação é utilizada pelo navegador, motores de busca e visitantes do site.
A seção principal de um HTML geralmente inclui:
-
O título da página
-
Links para o (s) arquivo (s) de folha de estilo CSS que são usados para formatar a página
-
Palavras-chave e outros "Metadados" usados nos motores de busca
Os títulos resumem o conteúdo da página
A título da página é exibido na barra de título de um navegador ou guia do navegador e também na maioria das listas de resultados do mecanismo de pesquisa. Os títulos das páginas são essenciais - eles devem ser sucintos, mas ainda resumem o conteúdo da página.
Aqui está o código de exemplo para um título de página:
Bem-vindo ao Web Collective!
Links para a (s) folha (s) de estilo CSS
Os links para folhas de estilo também pertencem ao elemento principal de uma página HTML. Lembre-se de que a formatação é fornecida a páginas da web modernas através de arquivos externos, distintos, separados e vinculados. Veja como esse código se parece:
A sintaxe de uma folha de estilo vinculada é um pouco confusa, portanto, desça. A etiqueta que liga uma folha de estilo a uma página HTML é um exemplo de um elemento não contêiner (às vezes referido como um elemento vazio). Em outras palavras, há apenas uma tag de abertura e nenhuma tag de fechamento. Em vez disso, essa tag de link é aberta.
Elementos, atributos e valores
Por caminho, ou talvez não seja tão indireto, os elementos HTML possuem atributos e esses atributos são definidos com a sintaxe que segue o modelo de atributo nome = "valor".
Para ficar com o exemplo de uma folha de estilo vinculada, o elemento de link possui rel, href e atributos de tipo. Esses atributos possuem ambos nomes (como rel, href ou tipo) e valores (a informação específica entre aspas que segue o nome do atributo).
O papel (menos, mas ainda relevante) das meta tags
Meta tags são elementos opcionais dentro de um elemento principal que transmite informações adicionais sobre uma página, incluindo o seguinte:
-
Descrições e palavras-chave usadas por motores de busca.
-
Informações adicionais sobre a página, como autor.
Como tudo o resto em HTML, o papel eo valor das meta tags estão evoluindo. Em épocas anteriores, as meta tags para palavras-chave desempenharam um papel mais importante na otimização de mecanismos de busca (SEO, exibição proeminente e precisa nos resultados dos mecanismos de pesquisa).
No entanto, os motores de busca modernos (e novas tags adicionais em HTML5) fornecem canais alternativos e mais complexos e sofisticados para identificar o conteúdo da página e indexar esse conteúdo nos mecanismos de pesquisa. Ainda assim, o uso de meta-tags para autor, descrição e palavras-chave (ainda às vezes útil para motores de busca) ainda pode ser uma parte importante do conteúdo da cabeça HTML.
Dê uma olhada no que uma abertura típica para uma página HTML, incluindo o elemento principal, pode parecer.
Bem-vindo à Web Revolution
Os elementos HTML dentro do elemento head comunicam informações importantes, como o nome do site, uma descrição do conteúdo do site e a folha de estilo vinculada. Esta informação é utilizada pelo navegador, motores de busca e visitantes do site.
A figura revela como os elementos do elemento principal comunicam informações ao mundo. Você pode ver o código-fonte HTML para a versão de Craigslist da cidade de Nova York. com (superior esquerdo), juntamente com o título definido, exibido na barra de título de um navegador (superior direito) e a descrição definida como aparece no resultado de pesquisa do Google (inferior direito).
