Criar uma estrutura semântica para páginas da Web - dummies

A criação de páginas semanticamente relevantes tem sido uma boa prática na web desde muito antes do aparecimento do iPad, mas HTML5 se desenvolve em tags especiais para facilite a consistência na forma como você usa a semântica ao projetar páginas da web.

A idéia de criar páginas semanticamente relevantes vem do inventor da World Wide Web, Tim Berners-Lee, que imaginava uma "teia de dados" que tinha significado , ou semântica >.

A criação de uma página da web com estrutura semântica tem sido considerada como uma prática recomendada, pois dá mais significado à página web. Em HTML4 e XHTML, os web designers podem criar uma estrutura semântica seguindo regras bem estabelecidas com tags HTML.

Por exemplo, o título mais importante em uma página deve ser formatado com a etiqueta Título 1 ou

. Da mesma forma, a maioria dos web designers agora define estilos de classe ou ID para as seções principais de um site com nomes como cabeçalho e rodapé para identificar seu papel e importância em uma página.

O HTML5 leva esse conceito um passo adiante, adicionando uma série de novos elementos semânticos. Em vez de criar uma classe ou estilo ID e aplicá-la a uma tag, em HTML5 você pode simplesmente usar tags com nomes como e.

Assim, ao invés de usar estilos de ID, como, você pode simplesmente usar. Como tags, no entanto, nenhuma das novas marcas faz es qualquer coisa, a menos que você defina um conjunto de regras de estilo que correspondam ao nome.

Construir esses elementos semânticos em HTML5 oferece aos designers uma maneira mais consistente de estruturar páginas HTML e é recomendado porque torna as páginas da web mais acessíveis para quem usa um leitor de tela para ler páginas da Web em voz alta, também quanto aos bots de pesquisa e outros programas que precisam interpretar o conteúdo de uma página da Web, independentemente do seu design.

Pense nisso desta forma: quando você vê uma página da Web, geralmente pode dizer pelo design qual parte da página é o cabeçalho (tem a área de navegação com links) e qual é o rodapé (com os direitos autorais e Outros detalhes). Mas nenhum dos robôs, leitores e outros programas que precisam interpretar páginas da web podem "ver" o design, e isso faz parte da razão pela qual o uso da semântica é importante.

A estrutura semântica de uma página pode ser independente do estilo e posicionamento do conteúdo, para que você possa criar uma página com significado porque seções reconhecidas formam uma estrutura lógica. Para os visitantes que podem ver a página, você pode formatar seções, como cabeçalho ou rodapé, para exibir de qualquer maneira que você quiser em um navegador.