Quando conectados, formam uma rede de informações que permite a comunicação de dados, organizando conhecimentos e guardando informações. As primeiras versões eram flexíveis, e isso ajudava iniciantes na área. Com o tempo, a estrutura foi ficando mais rígida, mas até hoje os navegadores conseguem interpretar páginas web feitas da maneira antiga através da retrocompatibilidade. Para desenvolver páginas com HTML basicamente precisamos de um editor de texto, como o Bloco de Notas do Windows, Nano e Emacs no Linux, entre vários outros.

Na Listagem 13 vemos exemplos de uso dessas tags, e seu resultado pode ser observado em seguida, na Figura 9. A Listagem 12 mostra um exemplo de formulário com vários tipos de campos para entrada de dados e um botão para submetê-los ao servidor. As listas de definição têm um comportamento um pouco diferente, uma vez que cada item é composto por um título (dt) e uma definição (dd), semelhante ao que ocorre em dicionários, nos quais temos os verbetes e suas definições. Na Listagem 11 temos um exemplo desse tipo de lista, com seu resultado ilustrado na Figura 7. Atualmente a https://mobilidadesampa.com.br/2024/03/curso-de-desenvolvimento-web-desafios-e-exigencia-da-profissao/ encontra-se na versão 5 e é padronizada pelo W3C (World Wide Web Consortium), uma organização internacional responsável por estabelecer padrões para a internet, como a linguagem XML, CSS e o SOAP. Em sua carreira, dedica-se ao empreendedorismo, além de atuar como Desenvolvedor Fullstack e redator técnico.

Módulos

Semelhante ao áudio, também podemos inserir vídeos nas páginas HTML utilizando a tag video, adicionada na HTML5, como na Listagem 16. Com HTML também é possível inserir áudio e vídeo nas páginas com facilidade. Para áudio, podemos utilizar a tag audio, da mesma forma que apresentada na Listagem 14. Já a Listagem 6 mostra como adicionar um link para um elemento na mesma página. Nesse caso, ao clicar no link o browser mudará o foco para o elemento que possui o atributo id igual àquele indicado no href. A Listagem 5 mostra como adicionar um link para outra página, neste caso, indicada pelo arquivo pagina2.html.

Isso quer dizer que devemos saber exatamente quais os atributos e valores possíveis para cada elemento. Isso é necessário porque os marcadores servem para definir a formatação de uma porção do documento, e assim marcamos onde começa e termina o conteúdo que receberá a formatação ou marcação necessária, específica. Alguns elementos são chamados “vazios”, pois não marcam uma região de texto, apenas inserem algum elemento no documento. O código da Listagem 17 pode ser utilizado quando desejarmos informar mais de um arquivo de vídeo como opções de carregamento, da mesma forma que vimos na tag audio. O código da Listagem 4 insere uma imagem a partir do arquivo avatar.png, localizado na mesma pasta do arquivo HTML, e uma tag img apontando para um arquivo inexistente.

Resolvendo problemas comuns com HTML

Ambos são partes do nosso módulo completo para iniciantes indrodução à web. As tags div e span são duas das mais utilizadas no curso de desenvolvimento web, com objetivos distintos, porém com grande importância para a composição do layout das páginas e formatação do texto. Formulários são normalmente utilizados para integrar a página HTML a algum processamento no lado servidor. Nesses casos, a página envia dados para uma aplicação (Java, PHP, .NET etc.), que os recebe, trata e retorna algum resultado. Na Listagem 2 podemos ver como utilizar essas tags, e na Figura 1 temos o resultado desse código.

O principal ponto de entrada para a documentação HTML no MDN, incluindo referências detalhadas de elementos e atributos — se você quiser saber quais atributos um elemento possui ou quais valores tem um atributo, por exemplo, este é um ótimo lugar para começar. Dessa forma, ao salvar o arquivo com a extensão .html e abri-lo em um navegador, você verá o parágrafo escrito na tela do navegador. A anatomia de um documento HTML pode ser interpretada como uma árvore. Além disso, elementos que compartilham do mesmo ramo de origem podem ser chamados de irmãos.

Principais tags do HTML

Essa linguagem de marcação oferece uma ampla gama de recursos, tendo sido citados somente alguns deles, que podem ser utilizados de acordo com a necessidade do projeto. Um dos profissionais responsáveis por construir um site é a pessoa desenvolvedora front-end, que transforma em código um layout feito pela equipe de UX/UI design em uma aplicação como o Figma. Tecnicamente, a construção de um website é feita através de várias tecnologias, e uma delas é o HTML. Neste artigo, você vai conhecer o que é o HTML, para que serve e como utilizá-lo. Já a tag span é um elemento do tipo inline, ou seja, quando adicionado na página, ele é inserido lateralmente após os demais componentes, diferente das divs que são elementos do tipo bloco.