¿Que é unha etiqueta HTML versus un elemento HTML?

Hai unha diferenza entre estes dous termos

O deseño web, como calquera industria ou profesión, ten unha linguaxe propia. Ao ingresar á industria e comezar a falar cos teus compañeiros, seguramente atoparás unha serie de termos e frases novos para ti, pero que flúen as linguas dos teus compañeiros profesionais da rede. Dous dos termos que escoitarán son "etiqueta" e "elemento".

Ao escoitar estes dous términos falados, podes darse conta de que se están empregando de forma indistinta. Como tal, unha pregunta que moitos profesionais novos da web teñen cando empezan a traballar co código HTML é "cal é a diferenza entre unha etiqueta HTML e un elemento HTML?"

Mentres estes dous termos son similares en significado, non son realmente sinónimos. Entón, cal é a semellanza con estes dous termos? A resposta curta é que tanto as etiquetas como os elementos fan referencia ao marcado usado para escribir HTML. Por exemplo, pode dicir que está a usar a etiqueta

para definir un parágrafo ou o elemento para crear ligazóns. Moitas persoas usan a etiqueta e o elemento de forma indistinta, e calquera deseñador ou desarrollador web que fale con vostede entendería o que quería dicir, pero a realidade é que hai unha lixeira diferenza entre os dous termos.

O HTML é unha linguaxe de marcado , o que significa que está escrito con códigos que pode ler unha persoa sen necesidade de compilar primeiro. Noutras palabras, o texto dunha páxina web está "marcado" con estes códigos para darlle instruccións ao navegador web sobre como amosar o texto. Estas etiquetas de marca son as mesmas etiquetas HTML.

Cando escribes HTML, estás escribindo etiquetas HTML. Todas as etiquetas HTML están compostas por unha serie de pezas específicas, que inclúen:

• Un signo menos que <
• Unha palabra ou un carácter que determinan que etiqueta está a ser escrita
• Calquera número de atributos HTML opcionais na forma dun par nome = "valor"
• E, finalmente, un signo maior que>>

Por exemplo, aquí tes algunhas etiquetas HTML:

Estas son todas as etiquetas de apertura de HTML, sen que se engadan atributos opcionais. Estas etiquetas representan:

• - define un parágrafo.

• - define a páxina como HTML
• - define unha división.

Os seguintes son tamén etiquetas HTML:

• Estes exemplos inclúen atributos que se engadiron ás etiquetas HTML abertas.

  • A
    é unha lista desordenada que inclúe un atributo ID
    • A división ten un atributo de clase
    • O elemento de ancoraxe ou ligazón inclúe o atributo "href"
    • A etiqueta de imaxe cun atributo "src"

    Para as etiquetas de ancoraxe e imaxe, os atributos non son opcionais, son necesarios para que as etiquetas se mostren correctamente. Debe dicir a ligazón onde ir (que é o que fai o "href") ea imaxe que mostrar (que é o que proporciona o atributo "src").

    Que son os elementos HTML?

    Segundo a especificación HTML do W3C , un elemento é o bloque de construción básico de HTML e normalmente está composto por dúas etiquetas : unha etiqueta de apertura e unha etiqueta de peche. Ata agora só observamos as etiquetas de apertura, que inicia os elementos. Para finalizar ese elemento, escribe as etiquetas de peche correspondentes.

    Por exemplo, para o elemento de parágrafo escribes isto:

    Esta componse da etiqueta de apertura que vimos fai un momento, así como a etiqueta de peche - . As etiquetas de clausura son realmente só a etiqueta de apertura repetida, pero cun "barra de diante" engadido directamente despois do "menos que o símbolo".

    Case todos os elementos HTML teñen unha etiqueta de apertura e unha etiqueta de peche. Estas etiquetas rodean o texto que se mostrará na páxina web. Por exemplo, para escribir un parágrafo de texto, escribe o texto que se mostrará na páxina e logo o rodeará con estas etiquetas:

    Aquí é onde escribirías o texto do parágrafo que che gustaría mostrar na páxina web.

    Algúns elementos HTML non teñen unha etiqueta de peche. Estes son chamados "elementos baleiros". Ás veces, tamén se refire como elementos " singleton " ou "void". Os elementos baleiros son fáciles de usar porque só tes que incluír unha etiqueta na túa páxina web e o navegador saberá que facer. Por exemplo, para engadir un salto de liña única á túa páxina, usarías a etiqueta de b.

    Outro elemento común que só inclúe unha etiqueta de apertura é o elemento "imaxe". Por exemplo:

    Vimos este exemplo anteriormente, pero non hai etiqueta de peche para este elemento de imaxe. O navegador simplemente substituiría este código coa imaxe que se fai referencia no atributo "href". Neste caso, iso sería "logo.png".

    En xeral, cando fago referencia a un elemento ou etiqueta HTML, vou usar o término "elemento" para indicar que me refiro a todas as partes do elemento (tanto as etiquetas de apertura e de peche). Eu uso "tag" é realmente un referente só un ou outro. Este é o uso axeitado destes dous termos, e animo a que os utilice correctamente, pero só sei que se desliza e intercábeos un pouco, aínda os entenderán os novos compañeiros de desenvolvemento web.

    Artigo orixinal de Jennifer Krynin. Editado por Jeremy Girard o 21/2/17