El disseny web, com qualsevol indústria o professió, té un llenguatge propi. A mesura que entris a la indústria i comencis a parlar amb els teus companys, sense cap dubte trobaràs una gran quantitat de termes i frases nous que et faran servir, però que surten de les llengües dels teus companys de professionals web. Dos dels termes que escoltaran són "etiqueta" i "element" HTML.
A mesura que escolteu aquests dos termes parlats, podeu adonar-vos que s'estan utilitzant d'una manera indistintable. Com a tal, una pregunta que molts professionals web nous tenen quan comencen a treballar amb codi HTML és "quina és la diferència entre una etiqueta HTML i un element HTML?"
Si bé aquests dos termes són similars en el significat, no són realment sinònims. Quina és la semblança d'aquests dos termes? La resposta curta és que tant les etiquetes com els elements es refereixen al marcat que s'utilitza per escriure HTML. Per exemple, podeu dir que esteu utilitzant el
etiqueta per definir un paràgraf o l'element per crear enllaços. Moltes persones utilitzen l'etiqueta i l'element de termes indistintament, i qualsevol dissenyador o desenvolupador web amb què parleu entendria el que volia dir, però la realitat és que hi ha una lleugera diferència entre els dos termes.
Etiquetes HTML
HTML és un llenguatge de marques, el que significa que està escrit amb codis que pot llegir una persona sense haver de compilar primer. En altres paraules, el text d'una pàgina web està "marcat" amb aquests codis per donar instruccions al navegador web sobre com mostrar el text. Aquestes etiquetes de marca són les mateixes etiquetes HTML.
Quan escriviu HTML, esteu escrivint etiquetes HTML. Totes les etiquetes HTML es componen d'una sèrie de parts específiques, com ara:
- Un signe de menys de
<
- Una paraula o un caràcter que determinen quina etiqueta està sent escrita
- Qualsevol nombre d'atributs HTML opcionals en forma de
name = "value" parell
- I, finalment, un signe més gran que el signe
>
Per exemple, aquí teniu algunes etiquetes HTML:
Aquestes són totes les etiquetes d'obertura HTML, sense que s'afegeixin cap atribut opcional. Aquestes etiquetes representen:
-
- defineix un paràgraf
-
- defineix la pàgina com a HTML
-
- defineix una divisió
A continuació també hi ha etiquetes HTML:
-
-
- El
- és una llista desordenada que inclou un atribut ID
- La divisió té un atribut de classe
- L'element ancoratge o enllaç inclou l'atribut "href"
- L'etiqueta d'imatge amb un atribut "src"
Tots aquests exemples inclouen atributs que s'han afegit a les etiquetes HTML obertes.
Per a les etiquetes d'àncores i imatges, els atributs no són opcionals, són necessaris perquè aquestes etiquetes es mostrin correctament. Heu de dir l'enllaç a on anar (que és el que fa "href") i la imatge que mostrar (que és el que proporciona l'atribut "src").
Quins són els elements HTML?
Segons l'especificació HTML del W3C, un element és el bloc de construcció bàsic de l'HTML i normalment es compon de dues etiquetes : una etiqueta d'obertura i una etiqueta de tancament. Fins ara només hem mirat les etiquetes d'obertura, que inicia els elements. Per finalitzar aquest element, escriviu les etiquetes de tancament corresponents.
Per exemple, per a l'element de paràgraf, escriu això:
Està format per l'etiqueta d'obertura que vam veure fa un moment, així com l'etiqueta de tancament, Gairebé tots els elements HTML tenen una etiqueta d'obertura i una etiqueta de tancament. Aquestes etiquetes envolten el text que es mostrarà a la pàgina web. Per exemple, per escriure un paràgraf de text, escriu el text que es mostrarà a la pàgina i l'envoltarà amb aquestes etiquetes: Aquí és on voleu escriure el text del paràgraf que voleu que es mostri a la pàgina web. Alguns elements HTML no tenen una etiqueta de tancament. Aquests s'anomenen "elements buits". De vegades, també es denomina elements "singleton" o "void". Els elements buits són fàcils d'utilitzar perquè només heu d'incloure una etiqueta a la vostra pàgina web i el navegador sabrà què fer. Per exemple, per afegir un sol salt de línia a la vostra pàgina, feu servir el Un altre element comú que només inclou una etiqueta d'obertura és l'element "imatge". Per exemple: Hem vist aquest exemple anteriorment, però no hi ha cap etiqueta de tancament per a aquest element d'imatge. El navegador simplement substituirà aquest codi per la imatge que es fa referència a l'atribut "href". En aquest cas, això seria "logo.png". En general, quan ens referim a un element o etiqueta HTML, utilitzarem el terme "element" per indicar que ens referim a totes les parts de l'element (tant les etiquetes d'obertura com les de tancament). Només fem servir "etiqueta" quan es refereix només una o una altra. Aquest és l'ús adequat d'aquests dos termes, i us animem a que els utilitzeu correctament, però només sabeu que, si us llisca i els intercanvieu un poc, els vostres nous companys de desenvolupament web encara ho comprendran.
etiqueta.
