O HTML é a linguagem que dá estrutura a todas as páginas web. Descobre o que é o HTML, como funciona e o que significa para o teu site como dono de uma empresa.
Por trás de cada site há uma linguagem que torna tudo possível. Não é uma linguagem de programação que só os programadores percebem, mas uma linguagem simples e legível, que é a espinha dorsal da internet desde o início. Todas as páginas que já carregaste, todos os artigos que já leste online, todas as páginas de produto que já viste: tudo começa com esta linguagem.
Essa linguagem é o HTML. Todas as páginas web que já viste foram criadas com ele. O título no topo, o parágrafo de texto por baixo, a imagem ao lado, o botão no fim: tudo isso é HTML. É o ponto de partida de todos os sites da internet, e perceber o que faz dá-te uma ideia muito mais clara de como funciona o teu site.
Não precisas de escrever HTML para ter um site. Os criadores de websites modernos tratam disso por ti. Mas saber o que é o HTML e que papel desempenha ajuda-te a tomar melhores decisões sobre o teu site e a comunicar com mais clareza quando trabalhas com designers ou programadores.
O que significa HTML?
HTML significa HyperText Markup Language. Cada parte deste nome diz-te algo sobre o que faz.
HyperText refere-se a texto que se liga a outro conteúdo. As ligações entre páginas são o que faz da web uma teia: podes saltar de uma página para outra porque o HTML suporta hiperligações. Markup significa que a linguagem usa etiquetas para marcar, ou rotular, pedaços de conteúdo, para o browser saber o que fazer com eles. Language significa que segue um conjunto consistente de regras e de sintaxe.
Para que serve o HTML?
O HTML serve para definir a estrutura de uma página web. Diz ao browser o que é cada pedaço de conteúdo. Isto é um título? É um parágrafo? É uma lista? É uma imagem? É uma ligação? O HTML responde a todas estas perguntas através de etiquetas.
Uma etiqueta é um rótulo envolvido por parênteses angulares. Um título pode ter este aspeto em HTML: as palavras “Sobre nós” envolvidas por uma etiqueta de título. O browser lê essa etiqueta, percebe que é um título e mostra-o em conformidade. O mesmo se aplica a todos os elementos da página. O HTML não controla o aspeto das coisas, só o que elas são.
O que o HTML não faz
O HTML dá estrutura a uma página web, mas não controla o seu aspeto nem o seu comportamento. É aí que entram duas outras linguagens.
O CSS controla o aspeto visual: cores, tipos de letra, espaçamento, layout e tamanhos. Sem CSS, uma página HTML seria apenas texto simples, sem estilo. O JavaScript controla o comportamento: o que acontece quando clicas num botão, como um formulário valida os dados, como o conteúdo carrega sem atualizar a página. Em conjunto, o HTML, o CSS e o JavaScript formam as três camadas em que todas as páginas web assentam. O HTML é a base. Lê mais sobre o que faz o CSS e o que faz o JavaScript nos próximos capítulos.
Como é que um browser usa o HTML?
Quando visitas um site, o browser descarrega o ficheiro HTML dessa página. Lê o ficheiro de cima para baixo e constrói o chamado DOM, um modelo de todos os elementos da página e de como se relacionam entre si. Depois aplica o CSS para dar estilo a esses elementos e executa o JavaScript para acrescentar interatividade. O que vês no ecrã é o resultado dos três a trabalhar em conjunto.
O HTML é o que o browser lê primeiro. Se o HTML for limpo e bem estruturado, o browser consegue processá-lo mais depressa e mostrar a página com mais eficiência. Isto liga-se diretamente à velocidade do site. HTML inchado ou mal escrito acrescenta peso a cada página e atrasa a rapidez com que os visitantes veem o teu conteúdo.
O que significa isto para o teu site como dono de uma empresa?
Se usas um criador de websites, não estás a escrever HTML tu próprio. A plataforma gera-o por ti quando acrescentas conteúdo e organizas o layout. O que importa é que o HTML que produz seja limpo, semântico e otimizado.
O HTML limpo carrega mais depressa. O HTML semântico, ou seja, HTML que rotula corretamente o que é cada pedaço de conteúdo, ajuda os motores de pesquisa a perceber as tuas páginas. Um título marcado como título tem mais peso nos resultados de pesquisa do que um título que apenas tem estilo para parecer grande. Estes detalhes são tratados automaticamente quando crias numa boa plataforma. O criador de websites da WEMASY produz HTML bem estruturado nos bastidores, para que as tuas páginas sejam criadas a pensar tanto na velocidade como na pesquisa desde o início.
Perguntas frequentes
Preciso de aprender HTML para criar um site?
Não. Os criadores de websites permitem criar e gerir um site através de um editor visual, sem escrever HTML. A plataforma trata do código por ti. Aprender o básico de HTML é útil se quiseres perceber como o teu site funciona, mas não é obrigatório para o criar ou gerir. Com o criador de websites da WEMASY, trabalhas com um editor visual e o HTML é gerado automaticamente.
Qual é a diferença entre HTML e um site?
O HTML é um dos blocos de construção de um site. Um site é feito de vários ficheiros, incluindo HTML para a estrutura, CSS para o estilo, JavaScript para o comportamento, imagens e, muitas vezes, uma base de dados que guarda o conteúdo. O HTML é o que o browser lê para perceber o que está na página, mas a experiência completa de um site envolve todas estas camadas a funcionar em conjunto.
O HTML afeta o SEO?
Sim, diretamente. Os motores de pesquisa leem o teu HTML para perceber do que trata a tua página. Usar as etiquetas certas para títulos, parágrafos, imagens e ligações diz aos motores de pesquisa o que é cada pedaço de conteúdo e a sua importância. Uma página com HTML claro e semântico é mais fácil de indexar corretamente pelos motores de pesquisa do que uma com código desorganizado ou inchado. É uma das razões pelas quais criar numa plataforma que produz HTML limpo importa para o teu posicionamento.
O que é o HTML semântico?
HTML semântico significa usar etiquetas que descrevem com precisão o tipo de conteúdo que contêm. Um título deve usar uma etiqueta de título, e não uma etiqueta de parágrafo com estilo para parecer grande. Uma lista deve usar uma etiqueta de lista, e não uma série de quebras de linha. O HTML semântico torna a tua página mais fácil de perceber para browsers, motores de pesquisa e leitores de ecrã. É uma boa prática que afeta tanto a acessibilidade como o SEO, sem exigir qualquer conteúdo visível extra.
HTML mal escrito pode estragar o meu site?
HTML mal escrito pode causar problemas de visualização, tempos de carregamento lentos e problemas na forma como os motores de pesquisa leem as tuas páginas. Os browsers são bastante tolerantes e tentam mostrar uma página mesmo que o HTML tenha erros, mas o resultado pode não ficar certo. É por isso que a qualidade do código da plataforma em que crias importa. O HTML bem estruturado produzido por um criador de websites fiável elimina este risco por completo.
O HTML é igual em todos os sites?
O HTML segue um conjunto padrão de regras definido pelo World Wide Web Consortium, o que significa que a linguagem base é a mesma em todo o lado. No entanto, a forma como é escrito e estruturado varia muito entre sites. Alguns sites têm HTML limpo e mínimo. Outros têm camadas de código desnecessário. A diferença nota-se na velocidade, no desempenho na pesquisa e no funcionamento da página em diferentes browsers e dispositivos.