Web design, como qualquer indústria ou profissão, tem uma linguagem própria. À medida que você entra na indústria e começa a falar com seus colegas, sem dúvida você vai se deparar com uma enxurrada de termos e frases que são novos para você, mas que fluem nas línguas de seus colegas profissionais da web. Dois dos termos que você ouvirá são "tag" e "elemento" em HTML.
Ao ouvir esses dois termos falados, você pode perceber que eles estão sendo usados de forma intercambiável. Como tal, uma questão que muitos novos profissionais da Web têm quando começam a trabalhar com código HTML é "qual é a diferença entre uma tag HTML e um elemento HTML?"
Embora esses dois termos tenham significado semelhante, eles não são sinônimos. Então, qual é a semelhança com esses dois termos? A resposta curta é que ambas as tags e elementos se referem à marcação usada para gravar HTML. Por exemplo, você pode dizer que está usando o
tag para definir um parágrafo ou o elemento para criar links. Muitas pessoas usam os termos tag e elemento de forma intercambiável, e qualquer web designer ou desenvolvedor com quem você fala entenderá o que você quis dizer, mas a realidade é que existe uma pequena diferença entre os dois termos.
Tags HTML
HTML é uma linguagem de marcação, o que significa que ela é escrita com códigos que podem ser lidos por uma pessoa sem precisar ser compilada primeiro. Em outras palavras, o texto em uma página da web é “marcado” com esses códigos para fornecer ao navegador da web instruções sobre como exibir o texto. Essas tags de marcação são as próprias tags HTML.
Quando você escreve HTML, você está escrevendo tags HTML. Todas as tags HTML são compostas de várias partes específicas, incluindo:
- Um sinal de menor que
<
- Uma palavra ou caractere que determina qual tag está sendo escrita
- Qualquer número de atributos HTML opcionais na forma de um
name = "value" par
- E finalmente um sinal de maior que
>
Por exemplo, aqui estão algumas tags HTML:
Estas são todas as tags de abertura de HTML, sem quaisquer atributos opcionais adicionados a elas. Essas tags representam:
-
- define um parágrafo
-
- define a página como HTML
-
- define uma divisão
A seguir também são tags HTML:
-
-
- o
- é uma lista não ordenada que inclui um atributo de ID
- A divisão tem um atributo de classe
- O elemento âncora ou link inclui o atributo "href"
- A tag de imagem com um atributo "src"
Todos esses exemplos incluem atributos que foram adicionados às tags HTML de abertura.
Para as tags de âncora e de imagem, os atributos não são realmente opcionais, eles são necessários para que essas tags sejam exibidas corretamente. Você precisa dizer ao link para onde ir (que é o que o "href" faz) e a imagem que mostrar (que é o que o atributo "src" fornece).
O que são elementos HTML?
De acordo com a especificação HTML do W3C, um elemento é o bloco de construção básico do HTML e é tipicamente composto de duas tags : uma tag de abertura e uma tag de fechamento. Até agora só olhamos para tags de abertura, que inicia os elementos. Para finalizar esse elemento, você escreve as tags de fechamento correspondentes.
Por exemplo, para o elemento de parágrafo você escreve isto:
Isso é feito da tag de abertura que vimos há pouco, assim como a tag de fechamento - Quase todos os elementos HTML têm uma tag de abertura e uma tag de fechamento. Essas tags cercam o texto que será exibido na página da web. Por exemplo, para escrever um parágrafo de texto, você escreve o texto a ser exibido na página e, em seguida, o envolve com essas tags: É aqui que você escreveria o texto do parágrafo que gostaria de exibir na página da web. Alguns elementos HTML não possuem uma tag de fechamento. Estes são chamados de "elementos vazios". Às vezes, eles também são referidos como elementos "singleton" ou "void". Os elementos vazios são fáceis de usar, pois você só precisa incluir uma tag na sua página da Web e o navegador saberá o que fazer. Por exemplo, para adicionar uma única quebra de linha à sua página, você usaria Outro elemento comum que inclui apenas uma tag de abertura é o elemento "image". Por exemplo: Vimos este exemplo anteriormente, mas não há tag de fechamento para este elemento de imagem. O navegador simplesmente substituiria esse código pela imagem referenciada no atributo "href". Nesse caso, isso seria "logo.png". Em geral, quando nos referimos a um elemento HTML ou tag, usaremos o termo "elemento" para indicar que estamos nos referindo a todas as partes do elemento (as tags de abertura e de fechamento). Nós só usamos "tag" quando nos referimos apenas a um ou outro. Este é o uso correto desses dois termos, e nós encorajamos você a usá-los corretamente - mas saiba que, se você os escorregar e trocar um pouco, você ainda será compreendido pelos seus novos colegas de desenvolvimento web!
tag.
