Actualmente se habla mucho de que se puede construir una

pgina web completa y optimizada sin necesidad de saber HTML. Y es

cierto, pero a la hora de disear te vas a encontrar con problemas en
los que pensars si yo supiera algo de cdigo podra solucionar este
inconveniente. Pues aqu te muestro una pequea gua para
aprender lo bsico del cdigo HTML.

QU ES EL CDIGO HTML?
Se trata de un lenguaje de programacin que se utiliza para el
desarrollo de pginas web. Las siglas HTML corresponden
a HyperText Markup Language (lenguaje de marcas de
hipertexto. Este lenguaje permite estructurar el texto de los
documentos y se basa en etiquetas que determinan cmo debe
mostrarse el texto y los atributos que pueden tomar dichas etiquetas.

CONCEPTOS BSICOS DEL CDIGO HTML

1. LAS PARTES DE LA PGINA WEB

Toda pgina web se divide en dos partes principales:
la cabecera y el cuerpo (head y body).
La cabecera es la parte no visible de la pgina web. Esto
significa que todo lo que se indique ah no aparecer en la pgina
como tal, pero sin embargo es una parte importantsima: ah se
incluyen lasetiquetas meta que se usan para describir la pgina
(imprescindibles para el posicionamiento SEO), el ttulo de la pgina,
el idioma, informacin relacionada con hojas de estilo, etc.
 En el body se introducen todas las etiquetas que nos
permiten dar formato al documento.
Como esta gua est destinada a pequeas modificaciones en el
cuerpo de la pgina web, describir las etiquetas del body y no
mencionar nada ms sobre la cabecera. Pero si necesitas ahondar
en el tema o en ms lenguajes a parte de html, te dejo esta pgina
web, que es excelente para pequeas consultas que necesites.

2. LOS TTULOS
Las etiquetas que definen los ttulos se pueden utilizar para
marcar el ttulo y/o los diferentesapartados que forman el documento,
o simplemente para resaltar cualquier texto. Existen seis tiposde
ttulos, que van de la etiqueta nmero 1 (la ms grande) a la 6 (la ms
pequea). Esto tambin es muy importantes para el posicionamiento
en buscadores, ya que les ests indicando que lo que est entre estas
etiquetas es importante y caracterstico de tu web.
 3. LOS PRRAFOS
Los prrafos se delimitan con las etiquetas <p></p>. Un
prrafo es un bloque de texto que se muestra separado del resto por
un salto de lnea. Si dentro del prrafo queremos hacer un salto, pero
que se siga considerando un nico prrafo (dar un intro en word)
escribiramos la etiqueta <br>.
Sin embargo, si quieres escribir de manera libre y que te detecte
los saltos de lnea, solo tienes que escribir dentro de la etiqueta
<pre></pre>. El nico inconveniente de esto es que si copias el
texto de otro documento y tiene adems listas, ttulos, negritas es
posible que no te lo detecte todo.
 4. LAS LISTAS
Existen tres tipos de listas, las ordenadas, las no ordenadas y
las listas de definiciones.
Para las listas ordenadas usamos las etiquetas <ol></ol> para
delimitar la lista, y para las listas no ordenadas, las
etiquetas <ul></ul>. Para insertar cada elemento de la lista se
introducen las etiquetas <li></li>.
En las listas de definiciones, insertamos las
etiquetas <dl></dl> para delimitar la lista,
y <dt></dt> y<dd></dd> para el ttulo y definicin
respectivamente.
 5. LAS TABLAS
Para realizar una tabla debemos tener en cuenta que se est
realizando de izquierda a derecha y de arriba abajo. Es decir,
empezamos desarrollando la primera fila, dentro de ella, las
determinadas columnas que haya, y a continuacin, la siguiente fila.
La tabla debe ir entre la etiqueta <table>, especificando el borde
que deseamos. Los comandos que nos delimitan las filas
son <tr></tr>, y para las columnas <td></td>. Para combinar
varias columnas o filas utilizamos los
atributos colspan o rowspan respectivamente. Si quieres destacar
una fila o columna para que se comporte como ttulo
utilizamos <th></th>. Te muestro un ejemplo.
 6. LOS ENLACES
Los enlaces nos permiten acceder a otras pginas, sitios web,
ficheros (de msica, vdeos, programas, imgenes, etc.), permiten
descargar archivos de la red y acceder a otras partes o secciones
dentro de un documento. Se realizan con la etiqueta <a
href=http://www.enlace.com></a>. Aqu debo mencionar un
atributo muy importante: target=_blank, para que el enlace se abra
en una pestaa nueva del navegador.
 7. ATRIBUTOS Y ESTILOS
Por ltimo, he querido hacer una seleccin de los atributos y
estilos ms usados en html. Lo normal es que los estilos se
especifiquen en el fichero css, pero como he pretendido que esta
gua sirva para realizar pequeas modificaciones espordicas,
considero que aplicar estilos directamente en una etiqueta de html es
una opcin recomendable y que nos permite dar solucin a
problemas que no podemos solventar en nuestro cms, o porque la
plantilla no nos da opcin.
Aprende a solucionar pequeos problemas de diseo con estos
tips de cdigo #HTML y #CSS
CLICK TO TWEET
A continuacin te muestro una serie de atributos. stos se
colocan siempre dentro de una etiqueta, por ejemplo de la siguiente
manera: <body bgcolor=blue></body>
background=nombre-del-fichero: Imagen de fondo
bgcolor=color: Color del fondo
border=nmero: Tamao del borde de una imagen o tabla
bordercolor=color: Color del borde
width=px o %: Ancho de una imagen, tabla o bloque. Se puede
especificar en pxeles o en porcentaje, siendo 100% el tamao
completo de la pantalla
height=px o %: Altura de una imagen, tabla o bloque
 align=top, middle, bottom, left, right: Alineacin de una
imagen, texto, ttulo, tabla arriba, en medio, abajo, izquierda o
derecha, respectivamente
Te adjunto una lista de los colores que reconoce html por el
nombre. Para el resto de colores, debers introducir el cdigo en
concreto, en formato hexadecimal.

Finalmente, te muestro una pequea lista de estilos ms, que en

este caso son etiquetas entre las que ir el texto al cul quieres
aplicar dicho estilo:
Negrita: <b></b> o <strong></strong>
Cursiva: <i></i>, <em></em>, <cite></cite> o
<dfn></dfn>
Subrayado: <u></u>
 Tachado: <s></s>
Subndice: 
Superndice: 
Letra pequea: <small></small>
Letra grande: <big></big>

CONOCES MS ETIQUETAS Y ATRIBUTOS QUE SON

IMPORTANTES?
Esta es mi pequea gua de apoyo con el cdigo HTML. Espero
que te haya servido de ayuda. Te recomiendo practicar en cualquier
editor de texto con una plantilla cualquiera, en la que puedas
experimentar qu pasar si cambio esta etiqueta por esta otra?,
recargas la pgina y ves el resultado. Es la manera ms sencilla y til
para aprender y descubrir nuevas etiquetas y atributos.
Con este artculo pretenda explicar lo ms bsico de html, pero
seguro que me he dejado conceptos tambin bsicos que debera
haber incluido. Especifcalos y cuntame tu opinin, e ir mejorando
est gua.
Y por supuesto, si te ha parecido interesante y te ha gustado,
comparte!
 Las primeras cosas que debes saber sobre HTML: historia,
objetivos y dems conocimientos donde
sentar las bases del manual.
Por Rubn Alvarez
HTML es el lenguaje con el que se escriben las pginas web. Las
pginas web pueden ser vistas por
el usuario mediante un tipo de aplicacin llamada navegador.
Podemos decir por lo tanto que el
HTML es el lenguaje usado por los navegadores para mostrar
las pginas webs al usuario, siendo
hoy en da la interface ms extendida en la red.
Este lenguaje nos permite aglutinar textos, sonidos e imgenes
y combinarlos a nuestro gusto.
Adems, y es aqu donde reside su ventaja con respecto a libros
o revistas, el HTML nos permite la
introduccin de referencias a otras pginas por medio de los
enlaces hipertexto.
El HTML se cre en un principio con objetivos divulgativos. No
se pens que la web llegara a ser un
rea de ocio con carcter multimedia, de modo que, el HTML se
cre sin dar respuesta a todos los
posibles usos que se le iba a dar y a todos los colectivos de
gente que lo utilizaran en un futuro.
Sin embargo, pese a esta deficiente planificacin, si que se han
ido incorporando modificaciones
con el tiempo, estos son los estndares del HTML. Numerosos
estndares se han presentado ya. El
HTML 4.01 es el ltimo estndar a septiembre de 2001.
Esta evolucin tan anrquica del HTML ha supuesto toda una
seria de inconvenientes y
deficiencias que han debido ser superados con la introduccin
de otras tecnologas accesorias
capaces de organizar, optimizar y automatizar el funcionamiento
de las webs. Ejemplos que
pueden sonaros son las CSS, JavaScript u otros. Veremos ms
adelante en qu consisten algunas
de ellas.
Otros de los problemas que han acompaado al HTML es la
diversidad de navegadores presentes
en el mercado los cuales no son capaces de interpretar un
mismo cdigo de una manera unificada.
Esto obliga al web master a, una vez creada su pgina,
comprobar que esta puede ser leda
satisfactoriamente por todos los navegadores, o al menos, los
ms utilizados.
Adems del navegador necesario para ver los resultados de
nuestro trabajo, necesitamos
evidentemente otra herramienta capaz de crear la pgina en si.
Un archivo HTML (una pgina) no
es ms que un texto. Es por ello que para programar en HTML
necesitamos un editor de textos.
Descripcin de la sintaxis con la que se trabaja en el lenguaje
HTML, as como la estructura que
tendr el documento bsico HTML.
El HTML es un lenguaje de marcas que basa su sintaxis en un
elemento de base al que llamamos
etiqueta. A travs de las etiquetas vamos definiendo los
elementos del documento, como enlaces,
prrafos, imgenes, etc. As pues, un documento HTML estar
constituido por texto y un conjunto
de etiquetas para definir la forma con la que se tendr que
presentar el texto y otros elementos en
la pgina.
La etiqueta presenta frecuentemente dos partes:
Una apertura de forma general <etiqueta>
Un cierre de tipo </etiqueta>
Todo lo incluido en el interior de esa etiqueta sufrir las
modificaciones que caracterizan a esta
etiqueta. As por ejemplo:
Las etiquetas <b> y </b> definen un texto en negrita. Si en
nuestro documento HTML escribimos
una frase con el siguiente cdigo:
<b>Esto est en negrita</b>
El resultado Ser:
Esto est en negrita
Las etiquetas <p> y </p> definen un prrafo. Si en nuestro
documento HTML escribiramos:
 <p>Hola, estamos en el prrafo 1</p>
<p>Ahora hemos cambiado de prrafo</p>
El resultado sera:
Hola, estamos en el prrafo 1
Ahora hemos cambiado de prrafo
Partes de un documento HTML
Adems de todo esto, un documento HTML ha de estar
delimitado por la etiqueta <html> y
</html>. Dentro de este documento, podemos asimismo
distinguir dos partes principales:
El encabezado, delimitado por <head> y </head> donde
colocaremos etiquetas de ndole
informativo como por ejemplo el ttulo de nuestra pgina.
El cuerpo, flanqueado por las etiquetas <body> y </body>, que
ser donde colocaremos nuestro
texto e imgenes delimitados a su vez por otras etiquetas como
las que hemos visto.
El resultado es un documento con la siguiente estructura:
<html>
<head>
Etiquetas y contenidos del encabezado
Datos que no aparecen en nuestra pgina pero que son
importantes para catalogarla: Titulo,
palabras clave,...
</head>
<body>
 Etiquetas y contenidos del cuerpo
Parte del documento que ser mostrada por el navegador: Texto
e imgenes
</body>
</html>
Vamos a ver cmo se hace una pgina muy sencilla en HTML,
que
sirva de prctica a los debutantes.
Podemos ya con estos conocimientos, y alguno que otro ms,
crear nuestra primera pgina. Para
ello, abre tu editor de textos y copia y pega el siguiente texto en
un nuevo documento.
<html>
<head>
<title>Cocina Para Todos</title>
</head>
<body>
<p><b>Bienvenido,</b></p>
<p>Ests en la pgina <b>Comida para Todos</b>.</p>
<p>Aqu aprenders recetas fciles y deliciosas.</p>
</body>
</html>
Ahora guarda ese archivo con extensin .html o .htm en tu disco
duro. Para ello accedemos al
men Archivo y seleccionamos la opcin Guardar como. En la
ventana elegimos el directorio
donde deseamos guardarlo y colocaremos su nombre, por
ejemplo mi_pagina.html
CROSSBROWSING