Dominando as Meta Tags: O Segredo da Description para Atrair Cliques
Na aula passada de nosso curso de HTML, ensinamos como criar um título magnético usando a tag <title>, garantindo que o Google e seus leitores saibam exatamente qual é o assunto principal da sua página.
Agora, vamos dar um passo além. Vamos aprender como fornecer detalhes vitais e resumos persuasivos sobre o seu conteúdo através das famosas <meta> tags.
As Meta Tags: Fornecendo informações do seu site
Como já havíamos comentado em nosso artigo sobre a tag <head>, nós usamos o cabeçalho do código HTML para definir as configurações dos bastidores das nossas páginas web.
Uma dessas configurações essenciais é um conjunto especial de tags chamadas de meta tags (tags de metadados). Hoje, vamos focar em duas características específicas que você pode adicionar a elas: a description (descrição) e as keywords (palavras-chave).
A estrutura básica de uma meta tag é bem simples. Ela não precisa de tag de fechamento (é uma self-closing tag) e funciona à base de dois atributos principais: name (o tipo de informação) e content (o conteúdo daquela informação).
A <meta> tag Description (O seu Imã de Cliques)
A meta description é, sem dúvidas, a meta tag mais importante para o seu marketing digital. Ela é um resumo direto e persuasivo do que o usuário vai encontrar na sua página.
Sabe quando você pesquisa algo no Google e, logo abaixo do título azul, aparece um texto em cinza de duas linhas explicando o conteúdo do link? Essa é a sua Meta Description.
O usuário decide se vai clicar no seu site ou no site do concorrente lendo esse exato texto. Portanto, sua descrição deve ser um convite irresistível, resumido e direto ao ponto (o ideal é manter entre 140 e 160 caracteres).
Sintaxe da Meta Description:
<meta name="description" content="Aqui você escreve um resumo persuasivo da sua página para convencer o usuário a clicar nos resultados do Google.">Quer se tornar um Webmaster Certificado?
Não dependa apenas da internet para estudar. Tenha nosso material completo no seu celular ou computador e aprenda HTML, CSS e técnicas avançadas de SEO de forma definitiva.
A <meta> tag Keywords (A Verdade que você precisa saber)
Historicamente, a tag de palavras-chave (keywords) era usada para listar os termos que definiam a página, separados por vírgula.
A sintaxe é essa:
<meta name="keywords" content="html, curso, seo, meta tags, webmaster">No passado, as pessoas começaram a colocar centenas de palavras falsas nessa tag para enganar o buscador. Por causa desse abuso (spam), o Google e o Bing passaram a ignorar essa tag completamente. Você pode colocá-la no seu código se quiser, mas ela não ajudará seu site a subir nas pesquisas. Foco total na Description!
Exemplo Prático: A Estrutura Correta e Otimizada
Vamos ver como ficaria nosso site juntando a tag <title> e nossas <meta> tags dentro do cérebro da nossa página (<head>). Note como organizamos o conteúdo visual corretamente dentro do <body>!
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Nossas Tags de SEO -->
<title>Curso de HTML e SEO: Online, Completo e Gratuito</title>
<meta name="description" content="Aprenda a criar sites profissionais do zero com nosso curso de HTML, CSS e técnicas de SEO para rankear no Google.">
<meta name="keywords" content="HTML, CSS, SEO, Curso Grátis"> <!-- Opcional hoje em dia -->
</head>
<body>
<h1>Bem vindo ao site HTML Progressivo.</h1>
<p>Aqui você encontrará informações sobre HTML, CSS, SEO e Monetização de sites.</p>
</body>
</html>Boas Práticas para o Google (Não seja penalizado)
Agora que você tem mais conhecimento que a maioria dos iniciantes, você também tem responsabilidades. Não tente "burlar" o Google.
- Seja Honesto: Escreva descrições reais. Se sua página fala de "Futebol", não coloque na descrição que vende "Celulares Baratos" só para ganhar cliques falsos. O usuário vai entrar, ver que é mentira e sair rapidamente (o que destrói o rankeamento do seu site).
- Tamanho Importa: Mantenha a description entre 140 e 160 caracteres. Mais do que isso, o Google cortará o texto no meio.
- Descrições Únicas: Cada página do seu site deve ter uma descrição diferente. Não copie e cole a mesma tag para todas as páginas.
🏋️ Hora de Praticar (Exercícios):
Exercício 1: Crie a estrutura HTML de um site sobre o seu time de futebol. Use a tag <title> e a meta tag description para fazer um resumo atrativo que faria outros torcedores clicarem no seu link no Google.
Exercício 2 (Investigação): Você consegue achar no código-fonte desta exata página qual é a descrição dela? (Dica: Clique com o botão direito, vá em "Exibir código-fonte da página" e aperte CTRL + F para procurar pela palavra "description").
Nenhum comentário:
Postar um comentário