Un completo curso de diseño gráfico, ilustración, diseño web y tipografía.

Referencia básica de html

Bàsics
<html></html>
Crea un document HTML
<head></head>
Defineix l'encapçalat de la fulla, al principi (just davant del tag de <html>) conté el títol i altra informació que no es mostra al navegador.
<body></body>
Defineix la part visible del document.
Encapçalament - etiquetes dins <head>
<title></title>
Defineix el títol del document, tal com apareix a la barra de títol del navegador.
<meta name="keywords" content="?"></meta>
Les etiquetes "Meta" ajuden als cercadors de pàgines en el procés de trobar i indexar la pàgina. Aquí hi podem incloure les paraules clau que volguem fer servir, separades per comes i un espai.
<meta name="description" content="?"></meta>
Aquí hi va la descripció que volguem.
Atributs del cos de la pàgina
<body bgcolor="?">
Serveix per definir el color del fons de la pàgina web. Per exemple, #FFFFFF és blanc.
<body text="?">
Serveix per determinar el color general del text.
<body link="?">
Color dels enllaços.
<body vlink="?">
color dels enllaços que ja ha visitat el navegant.
<body alink="?">
color dels enllaços en el moment en que es faci clic sobre ells.
Codis de text
<pre></pre>
Serveix per crear text pre-formatejat; al qual es mantenen tots els espais que es teclegin i la llargària de línia que faci falta.
<h1></h1>
Crea el títol de tamany major.
<h6></h6>
Crea el subtítol de tamany menor. La resta de subtítols h2...fins a h5 tenen tamanys intermitjos.
<b></b>
posa el text en negreta.
<i></i>
Posa el text en itàlica (cursiva).
<tt></tt>
Crea text de teletip (mecanografiat), elegint una lletra adient, com la courier new.
<cite></cite>
Crea un bloc de text en forma de cita (normalment en itàlica).
<em></em>
dóna èmfasi a un text (normalment en negreta o itàlica).
<strong></strong>
Semblant a l'anterior.
<font face="?"></font>
Permet canviar la lletra, respecte de la que s'ha elegit com a predeterminada.
<font size="?"></font>
Elegeix tamany per a la lletra, amb tamany relatiu creixent (de 1 to 7)
<font color="?"></font>
Canvia el color de la lletra, amb el valor hexadecimal o el nom del color (per als que tenen un nom reconegut per l'HTML, com ara white, orange, red...)
Codis per enllaçar
<a href="URL"></a>
Crea un hiperenllaç.
<a href="mailto:EMAIL"></a>
Crea un enllaç per enviar correu electrònic al destinatari elegit.
<a name="NAME"></a>
Crea un punt d'enllaç dins del document.
<a href="#NAME"></a>
Crea un enllaç amb un punt d'ancoratge com el del tag anterior.
Format de text
<p></p>
Crea un paràgraf nou.
<p align="?">
Especifica l'aliniat d'un paràgraf (left, center, right).
<br>
Inserta un retorn forçat. A diferència del paràgraf, és com si fos el mateix paràgraf, però passat a una nova línia. Qualsevol atribut de paràgraf, com ara <h2>, afectarà més enllà d'aquest retorn.
<blockquote></blockquote>
Sangra el paràgraf a ambdós costats.
<dl></dl>
Crea una llista de definicions.
<dt>
Figura abans de cada definició a una llista de les anteriors.
<dd>
Figura abans de cada definició.
<ol></ol>
Crea una llista numerada.
<li></li>
figura abans de cada element de la llista, i afegeix nombres consecutius.
<ul></ul>
Crea una llista amb "bullets", o vinyetes.
<div align="?">
Una etiqueta que serveix per donar format a blocs llargs de text, i també s'empra per aplicar fulls d'estil.
Elements Gràfics
<img src="name">
Afegeix un enllaç a una imatge.
<img src="name" align="?">
Serveix per aliniar la imatge respecte del text: left, right, center; bottom, top, middle
<img src="name" border="?">
Determina els marges de la imatge.
<img src="name" alt="?">
Col.loca una descripció en text de la imatge. És útil perquè es carrega abans que la imatge i si està desactivada la seva càrrega, es veu una descripció. També apareix en passar per sobre el ratolí.
<hr>
Inserta una línia horitzontal.
<hr size="?">
Serveix per determinar la gruixa de la línia horitzontal.
<hr width="?">
Determina l'amplària de la línia.
<hr noshade>
Crea una línia horitzontal simple, sense ombra
Taules
<table></table>
Crea una taula.
<tr></tr>
Crea cada fila de la taula
<td></td>
Crea cada cel.la de la taula.
<th></th>
Crea l'encapçalament de la taula, una cel.la amb text centrat i en negreta.
Atributs de les Taules
<table border=#>
Defineix el gruix de la línia de la taula
<table cellspacing=#>
Estableix la separació entre cel.les.
<table cellpadding=#>
Estableix una distància entre el marge de la cel.la i el contingut.
<table width=# or %>
Defineix l'amplària de la taula en pixels o en percentatge.
<tr align="?"> or <td align="?">
Alinea al centre, la dreta o l'esquerra les cel.les.
<tr valign="?"> or <td valign="?">
Estableix l'alineament vertical: a dalt, a baix o al centre.
<td colspan=#>
Nombre de cel.les que una columna inclou.
<td rowspan=#>
Nombre de cel.les que inclou una fila.
<td nowrap>
Evita que les línies dins d'una cel.la es trenquin per adaptar-se a l'amplària.