Marcações e uma Cascata (Dicas HTML e CSS)

Para os que não conhecem o assunto, algo desconhecido e difícil. Para os que já conhecem, algo simples. Para mim, uma mudança no modo de enxergar a web. 

Isto é um resumo das linguagens HTML e CSS, formadoras das páginas web.

No curso "Primeiros Passos em Tecnologia", da DIO, o conhecimento da linguagem de marcação de hipertexto (HTML) e folha de estilos em cascata (CSS) me fez

pensar que, se eu agora sei como estruturar páginas web com estas ferramentas, e as grandes empresas também utilizam estes mesmos recursos, eu sou capaz de muita coisa na web. Para os que também estão aprendendo, ou desejam aprender, aí vão algumas dicas e noções básicas.

Primeiramente, nenhuma das duas linguagens é de programação. HTML é uma marcação: por meio das tags, indica ao navegador o que deve aparecer naquele

espaço indicado. CSS é uma linguagem de estilos: ela indica como aquele objeto do HTML deve ser exibido (cores, fonte do texto, espaçamento, borda...).

A primeira citada é a mais importante dentre estas duas, pois sem sua existência, qual o propósito de estilizar algo que não existe? 

Utilizando-se uma lógica matemática de símbolos, a sequência de uma página é a seguinte: {HTML} [head] (title) [head] [body] (tags intermediárias) [body]{HTML}

HTML engloba tudo, head é o "cabeçalho do site", onde ficará o "nome" da página no navegador, e body é o corpo do site e dentro dele se insere o conteúdo da página, por meio das outras tags intermediárias (para inserir conteúdo e/ou modificar textos). Ao construir páginas neste bootcamp, principalmente a primeira, aprendi algumas dicas importantes:

- Para a página inicial, o nome deve ser "index.html", é uma "convenção" da internet;

- Utilize nomes simples para as páginas, pois isto encurtará os links e facilitará modificações;

- A organização é muito importante, pois facilitará a estruturação e manutenção;

- Existem funções em HTML mais viáveis de uso no CSS, então foque mais no CSS no momento de estilizar o site, e foque o HTML na estruturação deste.

O CSS possui uma estrutura mais simples: "nome { estilos; }".

Foi outra ferramenta que me marcou durante este curso, pois me permitiu transformar páginas que antes pareciam dos anos 1990 em sites tão esteticamente bons como os da DIO. Foi como transformar água em vinho, e já que mencionei CSS, aí estão dicas para seu uso:

- Organização, novamente, é essencial para a fluidez do trabalho;

- Utilize ID's e classes (class) para identificar elementos e facilitar a reescrita da estrutura;

- Utilize nomes simples no momento de nomear uma classe ou ID, para encurtar a estrutura o máximo possível.

- Utilize cores em alguma formatação (Hex, RGB) é melhor do que simplesmente digitar o nome, pois navegadores podem interpretar diferente;

- Monte layouts responsivos, evite utilizar pixel como unidade e substitua-o por rem ou porcentagem.

Por fim, aí está o site da W3Schools, onde se pode aprofundar mais em HTML e CSS, conhecer os "comandos" das duas linguagens e praticar. Este site foi muito útil para mim durante este bootcamp.

https://www.w3schools.com/