Se você pretende criar um site, aprender o HTML básico é uma das melhores coisas que você pode fazer! Independentemente de pretender trabalhar com wordpress, web designer ou desenvolvimento web, conhecer o básico do HTML é essencial. Esse conhecimento permite compreender como funciona uma página web e seus elementos. Dessa forma, você pode criar seus próprios documentos e páginas HTML. Além disso, no futuro poderá também fazer uso desses recursos para fazer alterações e manutenções em páginas já existentes.
Ao final deste artigo, você terá um conhecimento do HTML básico. Portanto, conhecerá o suficiente para realizar as sugestões acima. Dessa forma, também será possível avançar seus estudos a um nível intermediário e avançado para começar a criar páginas profissionais.
Criando uma página com elementos do HTML básico
Neste momento, se você leu e acompanhou os tópicos anteriores, já pode dizer que compreende o básico do HTML. Porém, assim como qualquer linguagem de computação, seja de marcação ou programação, uma das coisas mais importantes a se fazer é praticar..
Vamos criar uma página do zero utilizando o básico do HTML passo a passo,vamos lá!!
A estrutura de um site
Como o objetivo aqui é te dar uma noção de como as coisas funcionam, vou te apresentar como normalmente os sites são estruturados.
Segue o exemplo e vamos destrinchar abaixo:
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<title>Título da página</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>Título</h1>
<p>Primeiro parágrafo</p>
<button>Botão para clicar</button>
<script src="script.js"></script>
</body>
</html>
Vamos lá! Primeiramente, temos a tag de identificação da versão do HTML que estamos usando <!DOCTYPE html>. Antigamente essa tag era mais importante, pois tínhamos que referenciar até a documentação da versão do HTML usada. Hoje, basta adicionar isso no topo que está tranquilo.
Em seguida, temos a tag <html>, que é a nossa principal e está acompanhada da propriedade lang indicando a língua dessa página- Português do Brasil.
Dentro da tag <html> temos duas partes que também são envolvidas por duas tags: <head> e <body>.
Como o próprio nome já diz, temos a cabeça e o corpo. A cabeça é onde adicionamos elementos que fazem parte das configurações e referências dessa página. O que está alí são coisas com o título, o favicon (aquela imagemzinha que fica nas abas dos navegadores), a descrição da página, palavras-chave, links para os arquivos de CSS, entre outros.
Já no corpo é onde vamos adicionar todas as tags que realmente farão parte da nossa página. Nesse caso, temos alí um título, um parágrafo e um botão. Além disso, observe que também temos uma tag <script> ali no finalzinho do <body>. Normalmente, também usamos o JavaScript em um arquivo separado e, por motivos de performance, carregamos ele no final da página.
Conclusão
Este artigo foi um tanto quanto mais complexo do que os que estamos acostumados aqui, no entanto, ele realmente só faz sentido se você quer elevar o seu nível na criação dos sites e acompanhar nosso blog que vai ter vários artigos sobre o assunto.
Recomendo muito ter uma compreensão básica do HTML para poder bolar sites mais bonitos, responsivos e dinâmicos.
Inscreva-se como aluno nos nossos cursos,Divirta-se!
Você possui um e-commerce, site ou vende seus produtos ou serviços pelas redes s...
→ Leia mais...
Não poder sair para a rua fez com que a sociedade olhasse mais para si, prioriza...
→ Leia mais...
É cada vez maior o número de pessoas que deixam cargos em grandes empresas para...
→ Leia mais...
André Andrade e gerente de produtos desde 2005 e sócio diretor da Estúdio Site Ltda. Formado em Análise de Sistema, atuou no desenvolvimento de mais de 200 projetos, onde trabalhou no levantamento de requisitos, arquitetura da informação, design das telas, desenvolvimento e etc. Hoje possui grandes cases principalmente utilizando o Moodle, CMS Joomla e com o framework Bootstrap Twitter.
→ Veja o Perfil Completo
