O que é HTML? Entenda em 10 tópicos
- Nascimento Networks
- 20 de jul. de 2023
- 4 min de leitura
Atualizado: 21 de jul. de 2023
HTML, sigla para HyperText Markup Language, é uma linguagem de marcação utilizada na criação e estruturação de páginas na web. Desenvolvida originalmente por Tim Berners-Lee em 1990, ela foi fundamental para a popularização da internet, permitindo que informações pudessem ser compartilhadas e visualizadas de forma estruturada e interligada. Ao longo das décadas, o HTML evoluiu e se tornou um padrão universal para a construção de websites, sendo uma base essencial para o desenvolvimento web.
1. Estrutura Básica do HTML
O HTML é composto por elementos que atuam como blocos de construção para a página. Cada elemento é identificado por tags, que indicam a sua função e estrutura. Uma página HTML geralmente possui uma estrutura básica com uma tag <html> que engloba todo o conteúdo, contendo uma tag <head> para metadados e uma tag <body> para o conteúdo visível.
<!DOCTYPE html>
<html lang="pt-br">
<head> <title> Insira o título da aba aqui</title>
</head>
<body>
Aqui fica o corpo da página
</body>
</html>2. Tags e Atributos
As tags são palavras-chave envoltas por colchetes angulares, como <tag>. Elas são combinadas com atributos que fornecem informações adicionais sobre os elementos, como <tag atributo="valor">. Existem muitas tags disponíveis para diferentes propósitos, como títulos (<h1>, <h2>, etc.), parágrafos (<p>), links (<a>), imagens (<img>), listas (<ul>, <ol>, <li>), e muitas outras.
<!DOCTYPE html>
<html lang="pt-br">
<head> <title> Insira o título da aba aqui</title>
</head>
<body>
<h1> Título Maior</h1>
<h2>Título um pouco menor</h2>
<h3>Título menor ainda</h3>
Aqui fica o corpo da página, por exemplo aqui eu quebro o texto com <br> e continuo na próxima linha com o paragráfo:
<p>Competir é algo desumano já que tudo provém da poderosa de Redmond, a Microsoft corporation, competir é algo desnecessário, viola os direitos humanos e acima de tudo para boa convivência em sociedade devemos aceitar o monopólio da Microsoft</p>
<img src="/home/user/img/gates.png">
</body>
</html>3. Hipertexto e Hiperlinks
A capacidade de criar hiperlinks é uma das características mais importantes do HTML. Um hyperlink é criado usando a tag <a> e permite que os usuários naveguem entre diferentes páginas da web. Ao clicar em um link, o usuário é redirecionado para o endereço especificado no atributo href da tag <a>. Isso permite a interconexão entre páginas, tornando a navegação na web rápida e intuitiva.
<!DOCTYPE html>
<html lang="pt-br">
<head> <title> Insira o título da aba aqui</title>
</head>
<body>
<h1> Título Maior</h1>
<h2>Título um pouco menor</h2>
<h3>Título menor ainda</h3>
Aqui fica o corpo da página, por exemplo aqui eu quebro o texto com <br> e continuo na próxima linha com o paragráfo:
<p>Competir é algo desumano já que tudo provém da poderosa de Redmond, a Microsoft corporation, competir é algo desnecessário, viola os direitos humanos e acima de tudo para boa convivência em sociedade devemos aceitar o monopólio da Microsoft</p>
<img src="/home/user/img/gates.png">
<a href="https://ibm.com"> Link para a International Business Machiness</a>
</body>
</html>4. Imagens e Multimídia
Além do texto, o HTML também suporta a incorporação de imagens e outros tipos de mídia em uma página. A tag <img> é usada para inserir imagens, enquanto elementos como <audio> e <video> permitem a inclusão de arquivos de áudio e vídeo diretamente na página, proporcionando uma experiência multimídia aos usuários.
5. Formulários Interativos
Os formulários HTML são amplamente utilizados para interação com os usuários. Através de tags como <form>, <input>, <textarea>, <select>, entre outras, é possível criar campos de entrada de dados, botões de envio e caixas de seleção. Quando o usuário preenche e envia o formulário, as informações podem ser processadas por scripts no servidor.
6. Semântica e Acessibilidade
O HTML moderno também enfatiza a semântica, ou seja, o uso de tags que expressam significado para facilitar a compreensão do conteúdo pelos navegadores e mecanismos de busca. Tags como <header>, <nav>, <article>, <section>, <footer>, entre outras, ajudam a estruturar o conteúdo de forma mais clara e organizada. Além disso, o HTML é projetado para ser acessível, permitindo que pessoas com deficiências visuais ou outras limitações possam usar tecnologias assistivas para acessar o conteúdo.
7. Compatibilidade e Padrões
O HTML é um padrão universal, o que significa que os navegadores devem ser capazes de interpretar corretamente o código HTML para exibir o conteúdo da página de forma consistente em diferentes plataformas e dispositivos. No entanto, devido ao rápido avanço da tecnologia, é essencial que os desenvolvedores web se mantenham atualizados com as novas especificações do HTML e testem a compatibilidade em vários navegadores.
8. CSS e JavaScript
Embora o HTML seja a base da estrutura de uma página, ele geralmente é complementado pelo CSS (Cascading Style Sheets) e JavaScript. O CSS é usado para estilizar o conteúdo HTML, enquanto o JavaScript permite adicionar interatividade e funcionalidades dinâmicas à página, como animações e validações de formulários.
<!DOCTYPE html>
<html lang="pt-br">
<head>
<title>Nascimento System C Series</title>
<!- o style define um marcador de estilo css in line ->
<style type="text/css">
p{
font-family: arial;
}
</style>
</head>
<body>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit.<br>
Consequuntur quas, suscipit ipsum totam a aliquid molestiae libero aspernatur magnam aut. <br>
Laboriosam saepe assumenda sequi voluptatibus ipsa officia praesentium rerum ab?<br>
</p>
</body>
</html>9. Evolução do HTML
Ao longo dos anos, o HTML passou por várias revisões e atualizações, resultando nas versões HTML4, XHTML e, posteriormente, HTML5. O HTML5 é a versão mais recente e traz muitas melhorias, como novas tags semânticas, suporte a mídia integrado e recursos avançados para desenvolvimento web.
10. Conclusão
O HTML é a linguagem fundamental para a construção da web moderna. Seu papel como linguagem de marcação permitiu que a informação fosse compartilhada e apresentada de forma organizada, levando à explosão de conteúdo disponível na internet. Com a evolução contínua da tecnologia, o HTML continua a se adaptar às novas demandas, garantindo que a web permaneça acessível e interativa para todos os usuários. Ao aprender e dominar o HTML, os desenvolvedores têm uma base sólida para criar páginas web que sejam eficientes, atraentes e funcionais.
Para aprender mais sobre esta tecnologia recomendamos as aulas práticas de boson treinamentos:
Comentários