Quais são os princípios básicos do HTML?

Publicados: 2023-09-25

HTML (Hypertext Markup Language) é um elemento fundamental do web design em Orange County. É uma linguagem de marcação usada para criar a estrutura e o conteúdo de uma página da web e é a base de todos os sites. Provavelmente todos os web designers encontraram HTML em suas carreiras!

HTML é a linguagem padrão usada para criar páginas da web estáticas, que são páginas que não mudam sem a edição manual do código HTML, o que significa que os usuários não podem afetá-lo.

os-básicos-das-linguagens-de-codificação-HTML-no-web-design-orange-county-pinterest

O básico do HTML

HTML é um conjunto de elementos ou tags, e cada elemento representa um componente específico da página da web. Parece simples, não é? Isso é porque é! Esses documentos HTML são criados em um editor de texto e salvos com a extensão .html. Um documento HTML básico deve ter os seguintes elementos para funcionar corretamente:

A declaração <!DOCTYPE>

A declaração <!DOCTYPE> serve como ato de abertura para seu documento HTML, preparando o cenário informando ao navegador sobre a versão específica do HTML que você está usando. Pense nisso como uma introdução amigável que diz: “Ei, navegador, vamos dançar no ritmo do HTML5!” HTML5 é a atual estrela do show no mundo do desenvolvimento web e traz uma série de recursos e melhorias interessantes para a mesa. Portanto, ao incluir esta declaração, você está essencialmente dizendo ao navegador para se preparar para uma experiência HTML moderna e repleta de recursos. É a sua maneira de garantir que seu conteúdo da web seja apresentado corretamente e aproveite todos os recursos interessantes do HTML5.

<!DOCTYPEhtml>

O elemento <HTML>

Pense no elemento <html> como o chefão do seu documento HTML. É o chefão, o chefe e aquele que mantém tudo em ordem. Assim como um chefe gerencia uma empresa, o elemento <html> gerencia toda a sua página web. É o ponto de partida e o contêiner para todos os outros elementos que você usará para construir seu conteúdo da web.

Dentro deste elemento <html>, você encontrará o modelo da sua página web, incluindo os elementos <head> e <body>. O elemento <head> contém informações importantes sobre o seu documento, como título, meta tags e links para recursos externos. Enquanto isso, o elemento <body> contém todo o conteúdo visível que os usuários veem quando visitam seu site.

Então, em poucas palavras, o elemento <html> é o quadro geral, o comandante-chefe e o organizador final do seu documento HTML. Garante que tudo corra bem e que sua página web seja estruturada e apresentada corretamente ao seu público.

O elemento <Head>

O elemento <head> é como o cérebro do seu documento, contendo informações importantes como título, meta tags e links para coisas sofisticadas, como folhas de estilo e scripts. Portanto, embora o elemento <head> possa não estar visível em sua página da web, ele desempenha um papel vital para garantir que seu site tenha uma ótima aparência, tenha um bom desempenho e se comunique de maneira eficaz com os usuários e com os mecanismos de pesquisa. É como o centro de comando que ajuda sua página da web a funcionar da melhor forma.

O elemento <Título>

O elemento <title> especifica o título do documento, que aparece na barra de título do navegador. Não é apenas um requisito técnico, mas também uma ferramenta poderosa de comunicação. Criar um título claro, conciso e relevante é essencial para garantir que sua página da web seja facilmente reconhecível, acessível e atraente tanto para os usuários quanto para os mecanismos de pesquisa.

O elemento <corpo>

O elemento <body> contém todo o conteúdo da página web, como texto, imagens, vídeos e outros elementos. É como o palco principal de um teatro – é onde toda a ação acontece no seu documento HTML. É um dos blocos de construção fundamentais de qualquer página web e o seu papel é bastante simples, mas essencial: contém todo o conteúdo visível que os utilizadores veem quando visitam um site.

Elementos HTML

Os elementos HTML são colocados entre tags de abertura e fechamento, entre colchetes angulares. A tag de abertura começa com o nome do elemento, seguido por quaisquer atributos na forma de pares nome-valor. A tag de fechamento é exatamente igual à tag de abertura, mas tem uma barra (/) antes do nome do elemento como uma espécie de observação de encerramento.

Por exemplo, o código a seguir cria uma página HTML simples:

<!DOCTYPEhtml>

<html>

<cabeça>

<title>Minha primeira página HTML</title>

</head>

<corpo>

<h1>Bem-vindo ao meu site</h1>

<p>Esta é minha primeira página HTML.</p>

</body>

</html>

Aqui, o elemento <html> é o elemento raiz e contém os elementos <head> e <body>. O elemento <head> contém o elemento <title>, que especifica o título do documento. O elemento <body> contém o conteúdo da página, que inclui um título e um parágrafo. Em um documento HTML típico, você deve começar primeiro com o elemento maior (neste caso, HTML) e depois ir para os pedaços menores à medida que cria a página (por exemplo, cabeçalho, título, corpo, etc.).

Atributos HTML

Os atributos HTML fornecem informações adicionais sobre um elemento e são incluídos na tag de abertura. Eles meio que atuam como um descritor. Os atributos mais comuns incluem o seguinte:

O atributo ID

O atributo id identifica um elemento e em JavaScript e CSS para manipular o elemento.

O Atributo de Classe

O atributo class agrupa elementos, permitindo que sejam estilizados com CSS.

O atributo de estilo

O atributo style é um recurso HTML bacana que permite aplicar estilos diretamente a um elemento individual, ali mesmo no código HTML. É como dar uma reformulação de moda a esse elemento específico, especificando coisas como cores, fontes e espaçamento sem ter que criar uma folha de estilo separada. Isso pode ser útil quando você deseja fazer uma alteração rápida e única na aparência de um elemento sem afetar o restante dos estilos do seu site. Portanto, é a sua ferramenta ideal para adicionar um toque de exclusividade a elementos específicos em seu web design.

O atributo Href

O atributo href é usado em links para especificar a URL da página de destino.

Conclusão

HTML é a base do web design e é essencial para a criação de uma página web bem estruturada. Eles são os primeiros passos para um site completo! Assim, entender os fundamentos do HTML é essencial para quem deseja construir um site. HTML é uma linguagem de marcação que compreende elementos, atributos e conteúdo. Cada elemento representa um componente específico da página web e os atributos fornecem informações adicionais sobre um elemento. Com HTML, você pode criar um site estruturado, visualmente atraente e interativo.

Veja o artigo relacionado aqui: https://www.drivetrafficmedia.com/the- Different-coding-Languages-of-web-design/