Estrutura básica de uma página: HTML, CSS e JS

Foto: Freepik.com

No post de hoje eu vou falar um pouco (bem pouco) sobre a estrutura básica de um site: a página. É através do conjunto de várias páginas, ou em alguns casos apenas uma, que é composto um site. Mas, antes disso, esses elementos precisam ser moldados para então serem exibidos aos usuários. Confira nos próximos parágrafos como isso é feito.

HTML

Toda página de site é construída usando o HTML, uma linguagem de formatação de conteúdo. Na maioria das vezes, essa página pode ser gerada dinamicamente dentro do próprio servidor e exibida ao usuário pelo navegador (páginas dinâmicas). Em outras, essas páginas são criadas manualmente pelos designers (páginas estáticas). Mas, em todo caso, a estrutura HTML se faz presente.

Enquanto uma forma consome mais recursos do servidor, a outra exige menos processamento. Optar por um dos dois métodos vai da demanda do cliente e das funções que ele necessita.

CSS

Bom… apesar do HTML ser super importante, ele sozinho não garante uma experiência agradável ao usuário. Seus elementos, mesmos incluídos de forma semanticamente correta numa página, não se diagramam sozinhos na extensão de uma tela. Aplicadas de forma direta, as tags não têm cores, formas e alinhamentos Essa parte de estilização de conteúdo fica por conta do CSS, ou folha de estilos.

Existem 3 formas de usar o CSS para estilização de páginas:

Externamente – A vantagem da primeira opção é que o CSS pode estilizar diversas páginas de uma só vez;
Internamente – Na segunda opção, ele pode estilizar os elementos apenas da página em que se encontra;
CSS Inline – Ele só pode ser aplicado através do atributo “style” dentro de um elemento html.

JS (Javascript)

Javascript é uma linguagem de programação que manipula elementos HTML e CSS e que é executada no lado do cliente, ou seja, diretamente no navegador. O que significa isso? Bom… apesar de hoje o CSS executar muitos comportamentos que antes só eram possíveis de serem criados com javascript, é esta linguagem que pode incluir e excluir elementos HTML novos e ainda alterar atributos de tags dentro da página.

A utilização do Javascript numa página garante mais dinamicidade interativa e melhora a experiência do usuário, apesar de ser necessário o uso com moderação, pois pode tornar o carregamento de uma página mais demorado.

Estrutura Básica do HTML

<!DOCTYPE html>
<html>
    <head>
      <title>Título da Página</title>
   <link href="(endereço para folha de estilo)" rel="stylesheet"/>
   <script src="(endereço para o script javascript)"></script>
    </head>
    <body>
      Conteúdo da Página
    </body>
</html>

Klayton Georgio

Olá! Meu nome é Klayton Georgio, tenho 31 anos, sou formado em Comunicação Social, com habilitação para Jornalismo. Tenho conhecimento e prática em WebDesign, além de ser especialista em Design Digital. Já trabalhei em agências de publicidade da Região dos Lagos, no Rio de Janeiro, e hoje sou sócio na Editora Comunicação, onde sou Diretor de Arte.