Propaganda

HTML5 é o mais recente e melhor O que é o HTML5 e como ele muda a maneira como eu navego? [MakeUseOf explica]Nos últimos anos, você pode ter ouvido o termo HTML5 de vez em quando. Se você sabe algo sobre desenvolvimento web ou não, o conceito pode ser um tanto nebuloso e confuso. Obviamente,... consulte Mais informação versão da linguagem de marcação mais usada na web. Há algumas grandes mudanças em relação à última versão do idioma e, se você não as estiver usando, estará perdendo algumas funcionalidades muito legais.

Não temos espaço para cobrir todos os novos elementos da quinta versão do HTML, mas esses nove são alguns dos mais importantes. Para obter mais informações sobre os novos elementos e APIs em HTML5, certifique-se de confira W3Schools.

Uma Introdução aos Elementos Semânticos

Como grande parte da Internet, o HTML5 mudou para se concentrar na semântica. Agora, em vez de as tags serem simplesmente usadas para formatação, elas também são usadas para informar aos navegadores

e mecanismos de pesquisa Os 7 principais mecanismos de pesquisa semântica como alternativa ao Google consulte Mais informação o significado do que eles cercam.

Por exemplo,

simplesmente informa ao navegador que ele contém um parágrafo.

, que discutiremos momentaneamente, informa ao navegador que ele contém o conteúdo principal da página.

A web semântica ainda está em desenvolvimento e apenas começamos a arranhar a superfície do que ela pode fazer. O HTML5 está ajudando a trazer marcação semântica O que é marcação semântica e como isso mudará a Internet para sempre [Tecnologia explicada] consulte Mais informação para uma porção muito maior da Internet, e isso só pode ser bom para o futuro do processamento semântico.

1.

o

A tag define "conteúdo independente e independente". O exemplo mais fácil é, obviamente, um artigo. Para este artigo em particular, abriríamos a tag antes da introdução e fechá-la após a conclusão.

Todo o texto na sua seção independente.

Mas existem outras maneiras de usá-lo também. Por exemplo, muitos blogs de culinária incluem histórias pessoais sobre como surgiu uma receita ou por que é importante para o escritor. Em seguida, é seguido pela própria receita. Você poderia argumentar que cada um desses elementos poderia ficar sozinho.

Em um fórum, cada postagem ou tópico pode ser considerado independente e cada um pode ser marcado com seu próprio

tag. Na maioria das vezes, ele será usado no conteúdo principal de uma página. Mas lembre-se de que você também pode usá-lo de forma mais criativa.

2.

Intimamente relacionado com

é
. Isso define um "agrupamento temático de conteúdo, geralmente com um cabeçalho". então
estará dentro
… direita?

Não necessariamente. O W3 ressalta que depende da estrutura do seu site. Você pode ter conteúdo independente em diferentes seções da sua página (pense na primeira página de um site de notícias, por exemplo). Você pode ter seções nesse artigo.

Por que você precisa de um DAC

Tudo parece melhor.

Como configurar um DAC

Aqui está o que você precisa fazer.. .

Você pode até ter seções dentro das seções se ele se encaixar na sua página. Lembre-se de que uma seção é simplesmente um "agrupamento temático de conteúdo" e você encontrará muitos lugares para usá-la.

3.

Este elemento "deve ser usado como um contêiner para conteúdo introdutório". Em resumo, é a parte da sua página que ajuda as pessoas a entender o que estão prestes a ler.

Mas não se deixe enganar - você pode usar este contêiner mais de uma vez. Por exemplo, você pode usá-lo para identificar o título da página e o parágrafo introdutório da sua postagem no blog. Mas você também pode usá-lo para marcar o conteúdo introdutório de cada seção também.

Tudo o que você precisa saber sobre DACs

Aqui está uma introdução útil aos DACs ...

O restante do seu artigo vai aqui.

As seções do cabeçalho geralmente contêm pelo menos uma tag de cabeçalho - H1, H2 e assim por diante. Eles não precisam, mas, em geral, se você estiver usando uma tag de cabeçalho, há uma boa aposta de incluir o conteúdo do cabeçalho.

4.

O W3 diz que as tags de rodapé geralmente contêm o "autor do documento, informações de direitos autorais, links para termos de uso, informações de contato etc." Você pode pensar nisso como o material de "limpeza".

A documentação também afirma que você pode ter mais de uma seção de rodapé na sua página. Provavelmente, é uma boa ideia manter todas essas informações em um único local.

5.

Essa tag contém os links de navegação para uma determinada página. Observe que apenas a seção de navegação obtém essa tag, nem todos os links da sua página. É para barras de navegação e ferramentas similares.

Essa é uma tag realmente simples - é tudo o que existe. Use-o para definir a seção de navegação e não a use novamente em sua página.

6.

Um dos novos elementos mais interessantes do HTML5 é o lado. O W3 fornece uma definição inútil de "algum conteúdo além do conteúdo em que ele é colocado".

Em resumo, um aparte é qualquer coisa relacionada (mas separada) às informações circundantes. Pode ser uma barra lateral que adiciona detalhes ao seu conteúdo. Quando é usado dentro de um conjunto de

tags, fornece informações adicionais que não são necessárias para a compreensão do conteúdo principal.

Por exemplo, se tivéssemos incluído uma barra lateral neste artigo fornecendo informações sobre o histórico do HTML5, isso seria um aparte.

Mas o

O artigo principal vai aqui. O artigo continua aqui.

Como existem vários usos para essa tag, ela pode ser confusa. Se você lembrar que é "conteúdo secundário" e nem sempre precisa ser uma barra lateral, terá uma idéia melhor de como usá-lo.

7.

Muitos sites têm informações que precisam ser exibidas, mas não com destaque. Talvez sejam as informações de direitos autorais de uma foto. Ou as letras pequenas em um concurso. Esse tipo de informação é exatamente para o que serve a tag de detalhes.

Ao usar a tag de detalhes, você cria um texto oculto que pode ser facilmente exibido. Aqui está um exemplo:

Clique aqui para ver informações.

Aqui estão as informações mais detalhadas que você não precisa imediatamente.

Basta clicar na seta para obter os detalhes. Simples. Criá-lo é tão fácil. Aqui está o código usado para o exemplo acima:

Clique aqui para ver informações. Aqui estão as informações mais detalhadas que você não precisa imediatamente.

o

A tag define a frase que será mostrada enquanto o outro conteúdo estiver oculto. Observe que você pode usar outras tags na seção de detalhes: títulos, seções e assim por diante.

Ha outro coisas legais que você pode fazer com HTML 8 efeitos HTML legais que qualquer pessoa pode adicionar ao siteVocê não precisa conhecer CSS ou PHP para criar um site chique. Use esses truques legais de HTML para gerar efeitos impressionantes. consulte Mais informação também, mesmo se você não souber muito CSS ou JSON.

8-9.
e

Não se preocupe, o a tag que você usa há anos não vai desaparecer.

percorre a tag da imagem e informa ao navegador que é uma imagem independente, diagrama, listagem de código ou outra figura.

Se uma figura for removida da página, ela não afetará o fluxo do conteúdo.

entra na tag da figura e especifica uma legenda para uma imagem. Pode ser algo como isto:

Este é o nosso logotipo!

Isso fornece uma maneira integrada de adicionar uma legenda às suas imagens. Não há mais necessidade de passar pelo seu CMS.

Aproveite o poder do HTML5

Os novos elementos no HTML5 adicionam muito poder, especialmente para fins semânticos. Existem elementos adicionais para formatação, medidas escalares, progresso da tarefa e muito mais. Você pode ver todos os novos elementos na W3Schools.

Mas se você conseguir dominar esses nove, estará no bom caminho para fazer bom uso do HTML5. E se você é novo em HTML, verifique estes exemplos de código 17 exemplos simples de código HTML que você pode aprender em 10 minutosDeseja criar uma página da Web básica? Aprenda estes exemplos HTML e experimente-os em um editor de texto para ver como eles se parecem no seu navegador. consulte Mais informação !

Você começou a usar HTML5? Quais novos elementos você considera mais úteis? Compartilhe seus pensamentos nos comentários abaixo!

Dann é consultor de estratégia e marketing de conteúdo que ajuda as empresas a gerar demanda e leads. Ele também bloga sobre estratégia e marketing de conteúdo em dannalbright.com.