HTML/Introdución á sintaxe

En Galilibros, o Wikibooks en galego.
HTML
← Volver a Comprensión Introdución á sintaxe Seguir con Introdución á estrutura


HTML é unha linguaxe de etiquetaxe. Para converter un texto simple nunha páxina web hai que ir engadíndolle etiquetas que identifiquen o que é cada cousa. Para isto, primeiro aclararemos cinco conceptos de HTML: elemento, etiqueta, contido, atributo e valor.

Os elementos[editar]

Os elementos son as “cousas” que se definen coa linguaxe HTML. Son elementos os parágrafos, os encabezados, as imaxes, as listas, etc. Os elementos poden ter outros elementos dentro, como as listas, que teñen dentro distintos puntos. Ou poden estar contidos dentro doutros elementos, como todos os elementos antes mencionados, que formarían parte do corpo dun documento HTML.

Os documentos HTML non son máis ca isto, un elemento (o do documento) con outros elementos dentro, que á súa vez teñen outros, e estes outros, e así unha e outra vez ata que o documento queda completamente definido.

Exemplo da sintaxe dun parágrafo.

A meirande parte dos elementos da linguaxe están formados por:

  1. unha etiqueta inicial que sinala o comezo do elemento,
  2. uns atributos, cada un asociado a cadanseu valor,
  3. un contido ─caracteres e outros elementos─, e
  4. unha etiqueta que marca o final do elemento.

Así que podemos dicir que un elemento represéntase no código HTML mediante dúas etiquetas ─ou unha soa, como veremos a continuación─ e unha serie de atributos con valores asociados.

As etiquetas e mailo seu contido[editar]

As etiquetas son a representación no código dos límites dos elementos, é dicir, onde comeza un elemento (etiqueta inicial) e onde acaba (etiqueta final), así como o contido do elemento que iría entre ambas as dúas etiquetas. Exemplo: <etiqueta>Contido do elemento.</etiqueta>. Todas as etiquetas comparten o mesmo formato: comezan co signo «<» e rematan co signo «>». Cómpre poñer especial atención na etiqueta final, que sempre debe ter unha barra («/») a continuación do «<».

Nalgúns elementos, a etiqueta que delimita a súa fin é opcional, se ben por regra xeral recoméndase incluíla. É o caso, por exemplo, dos elementos das listas:

<ul>
  <li>Elemento 1.      <!-- Isto pode facerse. -->
  <li>Elemento 2.</li> <!-- Pero mellor destoutro xeito. -->
</ul>

Nalgúns casos concretos, un elemento pode non contar cun contido nin unha etiqueta final que o delimite, xa que en canto remata a etiqueta inicial remata tamén o efecto do elemento. Nestes casos, a etiqueta inicial remata en /> en vez de simplemente en <. É o caso, por exemplo, das imaxes:

<img src="/ruta/á/imaxe.png" />

Maiúsculas e minúsculas nas etiquetas[editar]

En HTML, as etiquetas poden escribirse en calquera combinación de maiúsculas e minúsculas. É dicir, valerían as formas <html>, <HTML>, <Html>, <hTmL>, etc.

Así e todo, recoméndase utilizar sempre a forma en letras minúsculas, <html>, posto que máis adiante poderíase optar por combinar o HTML con outras tecnoloxías que non fosen tan permisivas e só aceptasen esta forma. Mellor ir afacéndose agora que lamentalo no futuro.

Os atributos e valores[editar]

Os atributos son as propiedades que se lles poden asignar aos elementos, que terán un valor concreto. Un exemplo de propiedade sería lang, que é a lingua en que está o elemento. Os valores deste atributo poden ser os distintos códigos de lingua que existen[1].

Os atributos colócanse sempre nas etiquetas iniciais, a continuación do nome da etiqueta e antes do peche. Exemplo: <etiqueta atributo1="valor1" atributo2="valor2" >. A orde en que estean dispostos os atributos é completamente indiferente, se ben sería unha boa idea seguir unha certa pauta á hora de ordenalos. Si que é importante que os atributos estean separados do nome da etiqueta inicial e entre eles por espazos en branco.

As comiñas dobres inglesas («"») que se empregaron no exemplo anterior para delimitar o valor non son necesarias cando o valor non contén espazos, pero recoméndase empregalas sempre por precaución. Pódense empregar tamén comiñas simples inglesas («'»).

Existen unha serie de atributos que son comúns a todos os elementos da linguaxe HTML. Ademais deses, moitos elementos contan con atributos específicos que alteran o comportamento do elemento, ou definen propiedades adicionais para eses elementos. Por exemplo, nunha táboa a etiqueta inicial (<table>) podemos engadir o atributo summary, que permite establecer unha descrición curta do contido da táboa:

<table summary="Descrición da táboa." >

Ademais, existen algúns atributos que non necesitan valor, e a súa mera presencia xa abonda para alterar unha propiedade do elemento. Por exemplo, nunha lista de escollas, a mera inclusión nunha delas do atributo «selected» implica que dita opción estará seleccionada de maneira predeterminada:

<select>
  <option value="opcion1">Primeira opción</option>
  <option selected value="opcion2">Segunda opción</option>
  <option value="opcion3">Terceira opción</option>
</select>

Atributos implícitos e explícitos[editar]

Que no código non se estableza un par atributo-valor para un elemento non significa que o elemento non teña un valor asignado para ese atributo. Os propios navegadores web asígnanlles aos atributos dos elementos uns valores por omisión, xeralmente obedecendo á especificación do W3C.

Por exemplo, ao escribir un texto pode ser necesario salientar algunha frase ou palabra importante. Para resaltar texto emprégase o elemento «em», pero se o autor non especifica de que maneira se resalta o texto, será o navegador web do usuario que visite a páxina quen o faga. A meirande parte dos navegadores web amosan en cursiva os textos marcados co elemento «em», pero isto é só unha escolla dos navegadores, non unha característica propia de «em».

A maneira en que se presentan os elementos non forma parte da linguaxe HTML, que unicamente define de onde a onde van estes elementos e mailas súas propiedades. A presentación dos elementos pode modificarse mediante outras linguaxes de programación web, coma CSS.

Notas[editar]

  1. Para unha lista de códigos de linguas, véxase no apéndice Códigos lingüísticos.


HTML
← Volver a Comprensión Introdución á sintaxe Seguir con Introdución á estrutura