Tutorial HTML e SEO ( Parte 01).


HTML para Profissionais de Midias Digitais
(Textos, Hipertextos, HTML, Ferramentas de Visualização de códigos-fonte)


        
               Nessa postagem, e nas próximas, trataremos sobre um assunto muito curioso para quem trata com mídias digitais, HTML "estrutura básica" e SEO.  
         Com essa série de estudos, o profissional em mídias digitais poderá : Reconhecer a estrutura básica de um site a nível de códigos; Encontrar, entre o emaranhado de códigos "tags",  aqueles relativos as  palavras-chaves de sua campanha;  dizer o porquê de determinada palavra-chave se encontrar naquele código; saber de que forma essas palavras foram submetidas no sistema de busca como também poderá  indicar ao seu webdesing  onde exatamente você deseja colocar essas palavras chaves.
Nesse primeiro post, será diferenciado os termos  textos, hipertextos, HTML e depois veremos as ferramentas que serão usadas para visualizarmos de códigos fonte.  Bons estudo!




Textos, hipertextos e HTML:

Para quem não sabe, um site é um conjunto de páginas web, elas estão estruturadas em forma de hipertextos.   Textos e hipertextos podem ser  exemplificados da seguinte forma:  esse artigo que você esta lendo é um texto; no hipertexto podemos encontramos, além do próprio texto, outros conjuntos de informação na forma de blocos de textos,  imagens, sons, vídeos, animações, cujo acesso se dá através de referências  ou links.
Para escrever hipertextos que nos proporcione essa gama de novas informações (som, imagem, blocos)  é necessário o conhecimento de uma linguagem adequada. O nome dessa linguagem é HTML (Linguagem de Marcação de Hipertextos) e é com ela que produzimos páginas de Internet. Na parte 2 veremos essa linguagem com mais detalhes.

Resumindo:
                 Texto = parte escrita.
                 Hipertexto = parte escrita + (imagem, som, tabelas, jogos, animações)
                 HTML =  Linguagem que proporciona escrever Hipertexto

Ferramentas de Visualização dos códigos HTML: 

 Para visualizarmos os códigos HTML, é importante termos  fermentas que nos ajude nessa tarefa. Para isso, podemos utilizar editores de textos puros ou então a visualização online.
 Um editor de texto puro serve  para “escrever” no caso do webdesing, e no caso do profissional de mídias digitais “ler”  a linguagem.  Para ler ou escreve, termos a disposição algumas ferramentas importantes:

a) Editores de Textos Puros:

Notepad: Notepad ou “o bloco de notas” do seu computador (para encontrar acesse INICIAR>EXECUTAR>escreva em abrir: “notepad”>OK);

Notepad++: Existe também uma versão melhorada, é o  notepad++ que pode ser baixado gratuitamente.

Programas Especializados :Também temos programa mais especializado como FrontPage ou Dreamweave (Pagos);

b) Visualização Online:

OBS: antes de entra nessa parte, estarei utilizando nos postes o simbolo ( > )siginifica: ir para ou vá para!

 
Profissional de mídia digitais também pode visualizar os códigos das página online. Existe várias maneiras para isso. Depende apenas do navegador (IE, Mozilla, Cromo) que irá disponibiliza o exame do código-fonte (Linguagem HTML).


Se você usa IE (Internet Explorer)

a)Abra IE> Abra um site> Clica o botão direito do mouse > Vai abrir um menu,
clicar na opção "Exibir código de fontes".

b)Caso não consiga, vá em “Exibir”  na barra de menu> Código Fonte.

 c)Botão F12 (é a Ferramenta de desenvolvedor da IE)

Se você usa Firefox Mozilla.

a)Abra Mozzila> Abra um site> Clica o botão direito do mouse > Vai abrir um menu,
clicar na opção “Exibir código de fontes”

b)Ctrl+U.


       Se você usa o Cromo.

a)Abra o Cromo> Abra um site> Clica o botão direito do mouse > Vai abrir um menu,
clicar na –opção “Exibir código de fonte da página”

   b) Ctrl+U.
  
Se  você e visualizou muitos códigos não se assuste! a partir do capítulo 2  veremos como  analisar os códigos HTML. 
      Também é interessante dizer que se for necessário, podemos salvar a página para futuras analises no seu computador, em no seu navegador vá em Arquivo> Salvar Como> escolha o local e nome do arquivo> selecione a opção  Pagina da Web, Completa> Salvar. 
          O Word e o Wordpad não são editores de textos puros, pois inserem varias formatações indesejáveis. 

Para fecharmos essa parte, quero dizer que  se desejamos alcançar nosso público-alvo, precisaremos estruturar as ações de nossa campanha, em se tratando de uma campanha de busca na internet, é bom entender  que as fases dessa campanha podem ser:
1 - Pesquisas de palavras chaves  apropriadas ao seu site com ferramentas de buscas como o Google AdWord e Google Insights. (Como não é o nosso objetivo aqui, em outra oportunidade falarei sobre essas ferramentas.)
2 –  Identificar  as palavras-chaves e comandos "Linguagem HTML" nas páginas de nossos site; Qual a função dessas palavras chaves nesses comandos;  definir se as palavras-chaves estão bem localizadas em algum comando de forma a posicionar bem o site nos buscadores facilitando a encontrabilidade* da palavras pelo publico alvo; realizar mudança, exclusão, troca de posição ou qualquer outra atividade com as palavras chaves em nosso site.(Já estamos tratando dessas questões nesse estudo)
3 – Análise e interpretação dos resultados tanto na pagina dos sites de busca mas principalmente utilizando o como por exemplo: Google Analitics, a fim de  monitorar o desempenho de suas palavras. (Como não é o nosso objetivo por enquanto, em outra oportunidade falarei sobre essas ferramentas.)

* Encontrabilidade é a qualidade de interação entre um usuário e uma interface (assim como a usabilidade), que refere-se à algo poder ser encontrado pelo usuário. Um exemplo seria a capacidade que um site tem de ser encontrado na Internet através de mecanismos de busca. http://pt.wikipedia.org/wiki/Encontrabilidade

Por enquanto, é isso!