.comment-link {margin-left:.6em;}

BETA (Bytes sobre Educación y Tecnología en Argentina)

viernes, junio 02, 2006

Tutorial de HTML - 1

Cuando se desea hacer una página web hay que pensar en muchas cosas a la vez: que cualquier persona con cualquier navegador pueda utilizarla, que sea sencilla de interpretar para la gente de edad avanzada o con problemas de vista, que pueda ser utilizada con un pulsador o algún dispositivo utilizado por las personas con problemas motrices, que las personas que no oyen no se pierdan ningún contenido, etc. En resumen, hay que pensar en que la página sea usable y accesible a la mayor cantidad posible de personas.

Hoy comienzo una serie de posts con la intención de brindar un tutorial para crear sitios web accesibles, comenzando desde el principio: el lenguaje HTML.

El lenguaje HTML es un código que utilizan los navegadores para interpretar qué es cada cosa en una página web.
Para escribirlo hace falta conocerlo, y tener cualquier editor de texto (por ejemplo, el Notepad que viene con el Windows) y un navegador para visualizar nuestro trabajo.

Empecemos a trabajar. Vamos a abrir el Notepad o el editor de textos que elijamos y vamos a escribir este código:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Este título se va a ver en la barra de título de la ventana del navegador</title>
</head>
<body>
<p>Este texto se va a ver en el contenido de la ventana. Es un párrafo.</p>
</body>
</html>

Aquí observamos una serie de etiquetas que comienzan con el signo menor y terminan con el signo mayor. Cada una de ellas es un TAG, y le indica al navegador algo que debe hacer.

  • El primer renglón indica el tipo de documento (DOC = documento TYPE=tipo).
  • El segundo renglón anuncia que lo próximo será un texto escrito en lenguaje HTML.
  • El tercer renglón anuncia que ahora escribiremos el contenido del encabezado de nuestra página web. El encabezado puede contener varias cosas, pero por hoy sólo contiene el título, que es el texto que comienza con <title> y finaliza con </title>
  • Luego viene el cuerpo (body), donde sólo escribimos un párrafo. Para indicar el comienzo y el final del cuerpo se utilizan las etiquetas <body> y </body>, y para indicar el comienzo y final de un párrafo se utilizan <p> y </p>

Una vez que hayamos escrito (o copiado y pegado) el código en un editor de textos, lo guardamos como "primeraprueba.html" o el nombre que más nos guste. Abrimos la carpeta donde lo guardamos y con doble clic en el archivo... ¡Guau! Estamos viendo nuestra primera página web.

Ejercicios para seguir practicando: Hacer una página con varios párrafos.

  • Para escribir un título, utilizar <h1> y </h1>
  • Para dejar un renglón en blanco, <br>

Pregunta para saber si todavía están despiertos: ¿Qué significará la última etiqueta? (/html)

4 Comments:

  • Gracias Iris, en cuanto pueda, haré la tarea. Por cierto, ya me senté en el estadio... me puse mi blusa roja.
    Besos
    Katy lu

    By Anonymous Anónimo, at 6:30 p. m.  

  • Este blog ha sido eliminado por un administrador de blog.

    By Blogger Unknown, at 7:35 a. m.  

  • Imagino que la última línea te indica que está hecho en ése lenguaje. ¿Es así?

    By Blogger Unknown, at 7:51 a. m.  

  • Al principio dijimos que se "anuncia" que lo que sigue es lenguaje html, con el tag:
    < html >

    Al final se cierra ese tag, significando que allí termina el código en ese lenguaje.

    Saludos!

    By Blogger Fernández, at 8:08 a. m.  

Publicar un comentario

<< Home