Dicas SEO para programadores front end

Você programador Front End deve se atentar ao fazer seus códigos, e então aqui vão algumas dicas de SEO para programadores Front End, porque claro, se você é um programador front end você quer ter um diferencial no mercado, e um deles é ter um site bem otimizado para o Google, e com isso temos aqui Dicas SEO para programadores front end, vamos lá.

O que é esse tal de SEO ?

SEO (Search Engine Optimization), ou seja, Otimização do Motor de Busca, claro que se você tem um site, você quer ficar bem posicionado no Google, que é o buscador mais utilizado na web, e então vamos ver algumas dicas que você programador Front End deve se atentar.

Entenda como o Google funciona.
Quando você faz uma busca no Google você não esta buscando diretamente na internet, e sim nos bancos de dados do Google. Sempre que você coloca  um site novo no ar, os “Robôs” do Google passam lá vendo todo o conteúdo, sobre o que se trata seu site, qual o conteúdo tem lá. E então assim que um usuário faz uma busca, o Google verifica no banco de dados dele qual o site que tem o conteúdo mais relevante para o seu usuário, e como ele vê isso ? Vendo quantas palavras chaves tem no site, se o conteúdo tem mesmo a ver com o termo buscado, qual o Page Ranking (Nota de aceitação pelos usuários) do site e entre outros inúmeros fatores. Você pode ver melhor neste vídeo abaixo.

O Google tem duas formas de exibir seus resultados, a forma paga, que você para aparecer nos primeiros resultados quando alguém digita a palavra chave comprada, sendo eles os três primeiros anúncios que aparecem no resultado da busca, e temos a busca orgânica, que é de graça, mas há um enorme custo para aparecer ai, mas não é impossível, e as dicas para aparecer no Google você encontra agora, aqui no post de Dicas SEO para Programador Front end.

Nunca tente enganar o Google.

O Google esta a cada dia mais ligeiro, técnicas de black-hat ficaram para traz com as novas atualizações do robô do Google. E então tentar engana-lo nem pensar.

Conteúdo

Isso é primordial se você quer aparecer bem posicionado nos buscadores. O conteúdo não pode ser enjoativo para o usuário, tem que ser algo que prenda-o a querer saber mais sobre ele, não algo enjoativo para o leitor, deve conter palavras-chaves, relevantes ao conteúdo, e se possível usar a tag <strong> para dar mais força a palavra, mas não abuse, ou o Google pode pensar que você esta forçando para aparecer na frente dos concorrentes. Uso de imagens, tabelas, arquivos PDF, arquivos de vídeo etc. e lembre-se nunca, jamais de forma alguma duplique conteúdo de seu site

Estrutura HTML

Se possível utilize HTML5, ele vem já com as suas tags semânticas, para informar melhor o que são cada uma das coisas, assim como a tag <header> que indica um topo, a tag <nav> um menu, <section> uma sessão e <article> um artigo, você pode ver mais destas tags no post falando sobre HTML5 para programador Front End. E lembre-se código identado sempre, pois assim você facilita até o Google na hora de passar pelo seu site.

Imagens

As imagens são coisas ótimas para o Google, pois elas podem indicar para ele o que se trata cada um dos textos, mas lembre-se, use imagens da forma correta, dando nome correto e semântico a elas, nada de DSC2119.jpg, use sempre nomes do que se trata a imagem, e separando em pastas, assim como o exemplo, src=”imagens/cursos/dicas-seo-para-programador-front-end”, e também não se esqueça do alt e title, que são os títulos, da imagem, que no exemplo seria title=”Curso de Dicas de SEO para Programador Front End” e seu alt=”SEO para Programador Front End”. É ainda mais interessante usar o <figure> do HTML5 que dá uma estrutura melhor para as imagens, ficando assim.

<figure>
	<img src="pasta/tema/nome.jpg" alt="Descição da Imagem" title="Titulo da Imagem">
	<figcaption>Descição da Imagem</figcaption>
</figure>

Google Webmaster Tools

https://www.google.com/webmasters/tools/

Uma ferramenta do Google que aponta erros de HTML, assim como duplicação de Títulos, e descrições.
*Title deve ser único em uma página, sendo ele o nome que aparecera no buscador do Google, e a tag description também.

PageSpeed Insights

https://developers.google.com/speed/pagespeed/insights/

Outra ferramenta do Google que mostra erros de usabilidade, de carregamento no seu site, e da dicas de como melhorar isso. Assim como compactar arquivos com extensão .js arquivos .css entre outras dicas.
*Arquivos .js é super interessante colocá-los sempre abaixo de todo o conteúdo do site, bem antes do fechamento da tag body por questões de carregamento da página, que influencia muito nos resultados da busca.

Tenha um arquivo sitemap.xml

Mapa do Site, é um arquivo com extensão .xml que lista todas as páginas do seu site, para que o Google possa acha-las, assim guiando o usuário para cada um de seus conteúdos, e páginas.

URL’s

O Google prioriza muito os sites que usam url s amigáveis, mas o que são elas ? São url s semânticas em outras palavras, ou seja, não tente usar url s como seusite.com.br/p=2119 e sim url s como seusite.com.br/cursos/dicas-para-programador-front-end/ que é muito mais fácil de entender o que se trata a página só lendo a url

Tags

O uso de tags, é muito interessante, não tags html mas sim tags de conteúdo, como se fossem palavras chaves, assim o google verá suas palavras e indentificará melhor sobre o que se trata o assunto. Use as na tag em, desta forma <em>tag</em>

Títulos e Subtítulos

Use titulos, h1, e h2, 3, 4, mas lembre-se, o h1, é unico, pois ele é um titulo da página, veja como um livro, o h1, é o Titulo do livro, o h2 é o Subtitulo, e pode ser mais de um por página, e em sequencia temos os h3, que seriam os temas dos capitulos, e caso tenha necessidade, use h4 e ate mais, mas lembre-se, apenas ate o h6.

Bom, estes são alguns métodos que eu uso para que meus sites, e meus projetos fiquem bem posicionados nos índices de busca dos buscadores, qualquer dúvida, deixe um comentário ou mande-me um e-mail que eu terei o prazer de ajuda-lo a ter sucesso com seu projeto.