Hyper Text Markup Language

Tipus	API web , recomanacio W3C , obra creativa , familia de formats de fitxer , llenguatge de marques i estandard ISO
Extensio	html i htm
MIME	text/html
Desenvolupador	World Wide Web Consortium , Internet Engineering Task Force i Web Hypertext Application Technology Working Group (en)
Versio inicial	1989
Extensio de	Standard Generalized Markup Language
Estandard	RFC 2659: Security Extensions For HTML (en) i The 'text/html' Media Type
Mes informacio
Stack Exchange	Etiqueta , Etiqueta , Etiqueta , Etiqueta , Etiqueta , Etiqueta , Etiqueta , Etiqueta , Etiqueta , Etiqueta , Etiqueta , Etiqueta , Etiqueta , Etiqueta , Etiqueta , Etiqueta , Etiqueta i Etiqueta
Wiki del format de fitxer	HTML
LocFDD	fdd000475
PRONOM	fmt/99
Lloc web	html.spec.whatwg.org…

HTML (acronim d’ Hyper Text Markup Language , en catala, "llenguatge de marcatge d'hipertext"), es un llenguatge de marcatge que deriva de l' SGML dissenyat per estructurar textos i relacionar-los en forma d' hipertext . ^[1] Gracies a Internet i als navegadors web , s'ha convertit en un dels formats mes populars que hi ha per a la construccio de documents per a la web.

Historia de l'HTML

En el seu origen, l'HTML era un llenguatge dissenyat per a compartir informacio cientifica entre cientifics de tot el mon. Era purament un llenguatge estructural, en que no hi havia forma de descriure l'aparenca de les pagines (ni tan sols la possibilitat de posar un text en negreta o cursiva). Mes endavant s'hi van afegir nombroses opcions a fi de formatar i presentar text i grafics.

A mitjans de la decada de 1990 van comencar les ampliacions de l'HTML per a aconseguir la presentacio desitjada, pero sempre des de perspectives diverses de diferents desenvolupadors, que van acabar amb diverses solucions no estandards per a diferents navegadors. Aixo va provocar l'aparicio d'un consorci que controla l'evolucio de l'HTML: el W3C (World Wide Web Consortium).

Aquesta evolucio tenia un punt clau: la separacio del contingut i l'aparenca. Amb la versio 4 de l'HTML es recomanava un altre mecanisme per controlar la visualitzacio del nostre contingut HTML : els fulls d'estil ( CSS : Cascading Style Sheets).

El W3C recomana l'us de l' XHTML , que mante la mateixa sintaxi i els mateixos mecanismes que l' HTML , pero reformulat amb les normes d'un XML , preparant-se aixi per a aprofitar els avantatges d'aquest llenguatge.

D'altra banda el WHATWG ^[2] ?grup de treball compost per la Fundacio Mozilla ^[3] i Opera ? estan plantejant una especificacio per un HTML 5 estenent l'HTML 4.01 i el DOM . L' HTML 5 intenta millorar la part d'aplicacio web amb l'especificacio Web Forms 2.0 . Aquest grup surt com a reaccio pel canvi brusc del pas d'HTML a XHTML que, si no fos per l'Apendix C de l'especificacio XHTML 1.0 ^[4] no es podria usar en navegadors que no suporten el MIME type application/xhtml+xml .

No s'ha d'entendre el WHATWG com una organitzacio paral·lela al W3C sino un grup complementari, ja que quan te un esborrany el proposa al W3C per tal d'estandarditzar-lo.

La darrera especificacio vigent es l'XHTML 1.1 que ja no contempla cap compatibilitat amb versions anteriors i, per tant, nomes es pot servir com a application/xhtml+xml excloent qualsevol navegador antic.

El punt mes polemic actualment es la proposta d'especificacio (en estat d'esborrany) XHTML 2.0 que deixa de ser compatible amb versions anteriors no nomes a nivell de MIME type sino que l'estructura de document i elements estructurals canvien.

Marcador HTML

L'HTML s'escriu utilitzant ≪etiquetes≫, envoltades per claus angulars (<,>, /). L'HTML tambe pot descriure, fins a un cert punt, l'aparenca d'un document, i pot incloure o fer referencia a codi en un tipus de llenguatge anomenat script , el qual pot afectar el comportament del navegadors web i altres processadors d'HTML. ^[5]

HTML tambe serveix per referir-se al contingut del tipus de MIME text/html o tambe mes ampliament com un terme generic per a l'HTML en general, ja sigui el que descendeix de l' XML (com poden ser XHTML 1.0 i posteriors) o el que descendeix de l' SGML (com poden ser HTML 4.01 i anteriors). L'HTML consta de diversos components importants propis del llenguatges, entre ells els elements i els seus atributs , tipus de data i la declaracio de tipus de document .

Elements

Els elements son l'estructura basica de l'HTML. Els elements tenen dues propietats basiques: atributs i contingut . Els atributs i contingut tenen certes restriccions perque es considerin valids dins el document HTML. Un element generalment te una etiqueta d'inici (per exemple, <nom-de-element> ) i una etiqueta de tancament (per exemple, </nom-de-element> ). Els atributs de l'element estan continguts a l'etiqueta d'inici i el contingut esta situat entre les dues etiquetes (per exemple, <nom-de-element atribut="valor"> Contingut </nom-de-element> ). Alguns elements, com ara <br> , no tenen contingut ni porten una etiqueta de tancament. A sota es llisten diversos tipus d'elements de marcat utilitzats en HTML.

El marcatge estructural descriu el proposit del text. Per exemple, <h2>Golf</h2> estableix ≪Golf≫ com un encapcalament de segon nivell, el qual es mostraria en un navegador d'una forma similar al titol ≪marcador HTML≫ al principi d'aquesta seccio. El marcatge estructural no defineix com es veura l'element, pero la majoria dels navegadors web han estandarditzat el format dels elements. Pot aplicar un format especific al text per mitja de fulls d'estil en cascada .

El marcatge de presentacio descriu l'aparenca del text, sense importar la seva funcio. Per exemple, <b>negreta</b> indica que els navegadors web visuals han de mostrar el text en negreta , pero no indica que han de fer els navegadors web que mostren el contingut d'una altra manera (per exemple, els que llegeixen el text en veu alta). En el cas de <b>negreta</b> i <i>italica</i> , trobem altres elements que es veuen de la mateixa forma pero tenen una naturalesa mes semantica: <strong>emfasi fort</strong> i <em>emfasi</em> . Es facil veure com un lector de pantalla hauria d'interpretar aquests dos elements. Tot i aixi, son equivalents als seus corresponents elements de presentacio: un lector de pantalla no hauria de dir mes fort el nom d'un llibre, encara que el nom estigui ressaltat amb italiques a la pantalla. La majoria del marcat de presentacio ha estat rebutjat a partir de la versio 4.01, en favor dels fulls d'estil en cascada.

El marcatge hipertextual s'utilitza per enllacar parts del document amb altres documents o amb altres parts del mateix document. Per crear un enllac es necessari utilitzar l'etiqueta d'ancora <a> juntament amb l'atribut href , que establira l'adreca URL a la qual apunta l'enllac. Per exemple, un enllac que mostri el text de la direccio i vagi cap a la nostra Vikipedia podria ser de la forma <a href="{{format ref}} http://ca.wikipedia.org ">{{format ref}} http://ca.wikipedia.org</a> . Tambe es poden crear enllacos sobre altres objectes, com ara imatges <a href="enlace"><img src="imatge"/></a> .

Atributs

La majoria dels atributs d'un element son parells nom-valor, separats pel signe igual ≪=≫ i continguts a l'etiqueta de comencament d'un element, despres del nom de l'element. El valor pot estar envoltat per cometes dobles o simples, encara que certs tipus de valors poden estar sense cometes en HTML (pero no en XHTML). Tot i aixi, deixar els valors sense cometes es considerat poc segur.

Etiquetes basiques

Les etiquetes basiques d'HTML, d'obligada presencia en tot document son:

• <!DOCTYPE> : Es l'etiqueta que permet definir el tipus de document HTML que s'empra. Existeixen tres tipus basics: l'estricte (Strict), el transicional (Transitional) i el de marcs (Frameset).
• <html> : Es l'etiqueta arrel de qualsevol document HTML o XHTML .
• <head> : Defineix la capcalera del document HTML. Permet declarar metainformacio del document que no es mostra directament en el navegador. Aquesta informacio es d'especial rellevancia pels indexadors i cercadors automatics.
• <body> : Defineix el cos del document. Aquesta es la part del document HTML que es mostra en el navegador.

Dintre de la capcalera <HEAD> s'hi pot trobar:

• <title> : Permet definir el titol de la pagina. En navegadors grafics el contingut del title apareix a la barra del titol a sobre de la finestra.
• <meta> : Permet definir metainformacions del document tals com l'autor, la data de realitzacio, la codificacio del document ( UTF , ISO , etc.), les paraules clau i la descripcio del mateix
• <LINK> : Permet definir metadades complementaries a les del meta tals com el document anterior, el seguent, el capitol al qual pertany el document, la pagina glossari, etc.

Dintre del cos <BODY> s'hi pot trobar:

• <a> : Etiqueta ancora. Crea un enllac a un altre document o a una altra zona d'aquest, segons els atributs.
• <h1>, <h2>,… <h6> : capcaleres o titols del document, acostumen a distingir-se per mida.
• <div> : Divisio estructural de la pagina.
• <p> : Paragraf.
• <br> : Salt de linia.
• <b> : Text en negreta ( etiqueta desaprovada. Es recomana usar l'etiqueta <strong> ).
• <i> : Text en cursiva ( etiqueta desaprovada. Es recomana usar l'etiqueta <em> ).
• <s> : Text ratllat ( etiqueta desaprovada. Es recomana usar l'etiqueta <del> ).
• <table> : Indica el comencament d'una taula, despres s'haura de definir les files amb <tr> i les cel·les dintre de les files amb <td> .
  • <tr> : Fila d'una taula.
  • <td> : Cel·la d'una taula (ha d'estar dins d'una fila).
• <ul> : Llista desordenada (sense numerar). Els items es defineixen amb <li> .
• <ol> : Llista ordenada (numerat). Els items es defineixen amb <li> .
• <dl> : Llista de definicio. Hi ha dos tipus d'item; el dt i el dd .
  • <dt> : Terme a definir.
  • <dd> : Definicio del terme.

Excepte unes poques etiquetes, la majoria requereixen ser tancades escrivint la mateixa etiqueta precedida d'una barra "/". Exemple: <html>…</html>

Nocions basiques d'HTML

El llenguatge HTML pot ser creat i editat amb qualsevol editor de text basic, com pot ser Gedit en GNU/Linux , el Bloc de notes de Windows, o qualsevol altre editor que admeti text sense format com GNU Emacs , Microsoft Wordpad , TextPad , Vim , Notepad ++ , entre d'altres.

Existeixen, a mes, altres editors per a la realitzacio de llocs web amb caracteristiques WYSIWYG ( What You See Is What You Get , o en catala: ≪el que veus es el que obtens≫). Aquests editors permeten veure el resultat del que s'esta editant en temps real, a mesura que es va desenvolupant el document. Ara be, aixo no significa una forma diferent de fer llocs web, sino que es una forma una mica mes simple, ja que aquests programes, a mes de tenir l'opcio de treballar amb vista preliminar, tenen la seva propia seccio HTML, la qual va generant tot el codi a mesura que es treballa. Alguns exemples d'editors WYSIWYG son KompoZer , Microsoft FrontPage o Adobe Dreamweaver .

Combinar aquests dos metodes resulta molt interessant, ja que es complementen entre si. Per exemple, si s'edita tot en HTML i el desenvolupador oblida algun codi o etiqueta, nomes cal dirigir-se a l'editor visual o WYSIWYG i es continua aqui l'edicio o viceversa, ja que hi ha casos en que resulta mes rapid i facil escriure directament el codi d'alguna caracteristica que l'usuari vol afegir al lloc que buscar l'opcio en el programa mateix.

Hi ha un altre tipus d'editors HTML anomenats WYSIWYM que donen mes importancia al contingut i al significat que a l'aparenca visual. Entre els objectius que tenen aquests editors es la separacio del contingut i la presentacio, fonamental en el disseny web.

HTML utilitza etiquetes o marques, que consisteixen en breus instruccions de comencament i final, mitjancant les quals es determina la forma en que ha d'apareixer al seu navegador el text, aixi com les imatges i els altres elements.

Tota etiqueta HTML esta tancada entre els signes menor que i major que (<>), i algunes tenen atributs que poden prendre algun valor. En general les etiquetes s'aplicaran de dues formes especials:

• Obrint-se i tancant-se, com ara: <b> negreta </b> , que es veuria al seu navegador web com negreta .
• Sense obrir-se i tancar-se, com <hr/> , que es veuria al seu navegador web com una linia horitzontal.

Les etiquetes basiques o minimes que conformen un document HTML son:

<! DOCTYPE HTML>

<
html
>

  
<
head
>

    
<
meta
 charset 
=
 "utf-8"
/>

    
<
title
>
 Exemple 1 
</
title
>

  
</
head
>

  
<
Body
>

    
<
p
>
 Paragraf d'exemple 
</
p
>

  
</
body
>

</
html
>

Accessibilitat web

El disseny en HTML, a part de complir amb les especificacions propies del llenguatge, ha de respectar certs criteris d' accessibilitat web , seguint unes pautes o les normatives i lleis vigents als paisos on es reguli aquest concepte. Es troba disponible i desenvolupat pel W3C a traves de les Pautes d'Accessibilitat al Contingut Web 1.0 WCAG (actualitzades recentment amb l'especificacio 2.0), tot i que molts paisos han desenvolupat especificacions propies, com es el cas d'Espanya amb la Norma UNE 139803. ^[6]

Entitats HTML

Molts caracters especials, lletres accentuades, dieresi o simbols d'escriptura del llenguatge poden representar-se en un document HTML tant per si mateixos, com per una referencia a una entitat. Entre els avantatges d'utilitzar una referencia a una entitat, hi ha la de poder representar caracters Unicode emprant una codificacio de caracters diferent, o la de suplir la manca d'alguns caracters que falten al teclat usat.

Referencies

Vegeu tambe

• Llista de colors HTML
• AsciiDoc
• Aplicacio HTML
• Javascript
• Fulls d'Estil en Cascada o CSS

Enllacos externs

En altres projectes de Wikimedia :
	Commons (Galeria)
	Commons (Categoria)
	Viquillibres

• World Wide Web Consortium Regulador dels estandards de la Web , incloent HTML
• HTML Home Page Pagina oficial del HTML
• Validador automatitzat de codi HTML
• Apunts rapids d'HTML Arxivat 2009-07-24 a Wayback Machine .