You are on page 1of 5

Hola amigos de C! En esta ocasin les presento mi post para aprender HTML lo ms rpido posible. Qu es el HTML?

HTML, siglas de HyperText Markup Language (lenguaje de marcado de hipertexto), es el lenguaje de marcado predominante para la elaboracin de pginas web. Es usado para describir la estructura y el contenido en forma de texto, as como para complementar el texto con objetos tales como imgenes. El HTML se escribe en forma de etiquetas, rodeadas por corchetes angulares (La etiqueta se habre con "<" y se cierra con ">"). HTML tambin puede describir, hasta un cierto punto, la apariencia de un documento, y puede incluir un script (por ejemplo JavaScript), el cual puede afectar el comportamiento de navegadores web y otros procesadores de HTML.

Mi primera pgina web fue algo... Sinceramente, mi primera pgina web era un desastre, porque no saba programar, yo solo copiaba y pegaba cdigos, y, de esa manera, llegu a unos 111 errores y 13 peligros. Era por aqul entonces, en el 2010, que, bueno, solo tena unos 10 aos recin cumpliditos... hasta que empec a buscar, estudiar, y aprender de mi primo (l es diseador web). Bueno, luego de saber lo que se ahora, veo el cdigo de mi primer pg... y no la entiendo, porque no haba etiquetas <head> ni <body>, ni <html>. En este post quiero que aprendan a hacer una pg. web, ya sea por hobbie, fines personales o profesionales. La etiqueta "<html>" Esta etiqueta es muy fcil, ya que sta es la primera y ltima etiqueta en un documento HTML. Es decir, en un documento HTML, se escribe de esta forma:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="es" xml:lang="es"> //Esta semietiqueta indica al navegador que tipo de documento HTML es, ya sea HTML 1.1, 2.0, 4.0, 5.0, XHTML, etc. <html> //esta es la primera etiqueta, que le indica al navegador que es un documento <html>

La etiqueta "<head>" y compaa Esta etiqueta (cabecera en espaol) incluye todo lo que no se ve en una pgina web, ya sea el ttulo de una pestaa, como el linkeo a un documento HTML, o un js (javascript). --Etiqueta "<title>"-Esta etiqueta es fundamental, ya que le pone un nombre a la pestaa. Por ejemplo, si el <title> tiene el ttulo: "CODEMANA!" Publicar un n...", el cdigo sera el siguiente:
<title>CODEMANA! Publicar un n...</title>
Y se vera as:

Relacionar un estilo CSS al documento HTML Bueno, seguramente algn da nos tocar hacer un documento CSS. Qu es un documento "CSS"? Descripcin: Hojas de estilo en cascada. ES el diseo del sitio web, ya sea el orden del sitio como los colores, fondos, etc. Es la mejor forma de estructurar una pgina web En fin, la manera ms usada para vincular el HTML con el CSS es el siguiente (dentro de las etiquetas <head> y </head>:
<link rel="stylesheet" type="text/css" media="screen" href="estilo.css" />

donde Dice: "estilo.css", es donde va el nombre del documento .css

META TAGS Los meta tags son muy tiles, ya que informan tanto al buscador web (Google, Yahoo, Bing, etc) como al navegador, por ejemplo, el autor de la pgina, el idioma de la misma, el pas, etc etc
Para "refrescar" una pgina o redirigirla a otra, transcurrido un cierto tiempo: <meta http-equiv="refresh" content="20;URL=./indice.htm" > El tipo es httpequiv="refresh", en content le decimos el nmero de segundos (si indicamos CERO ser inmediato) y a continuacin indicamos la pgina a la que debe dirigirse, para ello usamos URL=nombre de la pgina.

En este ejemplo, se cargar la pgina indice.htm que est en el directorio actual

Las palabras claves que los "robots" usarn: <meta name="Keywords" content="las palabras separadas por comas" > Este tag lo usarn los "robots" enviados por los buscadores y se usar para indicar las palabras claves relacionadas con la pgina en cuestin. La descripcin de la pgina: <meta name="Description" content="descripcin de la pgina" > Este tag lo usan los buscadores para dar una descripcin del contenido de la pgina. Si los "Robots" deben tener en cuenta esta pgina o no: <meta name="Robots" content="ver los valores" > El valor de content puede ser: all para que el robot tenga en cuenta esta pgina y pueda seguir los links contenidos en la misma (este es el valor predeterminado) noindex para que no la tenga en cuenta. none que es lo mismo que noindex, nofollow index para que la tenga en cuenta follow para que pueda seguir los links que haya en la pgina nofollow lo contrario de follow. Si quieres saber ms sobre el tema este de los robots, mira lo que cuento sobre el fichero robots.txt. La fecha en la que expira una pgina: <meta http-equiv="expires" content="fecha en formato GMT" > La fecha en la que dicha pgina expira y por tanto el navegador "refrescar" el contenido despus de esa fecha. El formato de la fecha es algo como: Sat, 16 Nov 2002 16:05:00 GMT, tambin se puede indicar un CERO para que expire inmediatamente. En el caso de que el valor de content sea -1, no se guardar en el cach, e teora lo mismo que si fuese 0. Si se usan pginas ASP, se puede usar tambin: Response.Expires = -1 Para que no se guarde la pgina en el cach: <meta http-equiv="Pragma" content="no-cache" > Esto le indica al navegador que no guarde la pgina en el cach. Este meta-tag no es vlido para el Internet Explorer y segn la Knowledge Base, es preferible usar el mtodo indicado arriba, es decir usar "expires" y en content -1: <meta http-equiv="expires" content="-1" >

A ver si es cierto... ya que esto es el que yo necesito para evitar los problemillas que algunas veces me contis de que no se ve la pgina correcta... Evitar que una pgina se muestre dentro de un frame: <meta http-equiv="Window-target" content="_top" > En Content podemos usar: _top para indicar que se muestre en la pgina completa, no dentro de un frame, _blank para que se muestre en una nueva ventana

Tutorial de Santiago Agustn Gimenez

You might also like