<html>
Mi primera página web
</html>
Después de esto ya podéis guardarlo en vuestra carpeta de trabajo con el nombre primera.html o vuestronombre.html.
Si abrís la carpeta con doble clic, os aparecerá la estructura más simple de una página web...
2. Ahora vamos a añadir las dos secciones principales en las que se divide una página web: cabecera (<head> </head>) y el cuerpo (<body> </body>).
Como ya hemos indicado antes, en el head irá todo lo que no se ve dentro de la página pero es información sobre la misma: autor, título,...
En el body insertaremos el texto, los gráficos y todos los demás tags que darán forma al texto.
3. Abrimos de nuevo el editor de texto con nuestro documento y lo modificamos:
<html>
<head>
<title>Primera Página</title>
</head>
<body>
Mi primera página web
</body>
</html>
4. Al abrirlo en el navegador, lo que aparece entre los tag <title> </title> es el título que veremos en la barra del navegador.
5. Ahora vamos a darle color a la página.
HTML utiliza un sistema de color llamado RGB y para especificar un color se utilizan seis dígitos en parejas de dos números escritos en sistema hexadecimal cuyo formato será el siguiente:
color=#rrggbb
- rr es la cantidad de color rojo que lleva la mezcla.
- gg es la cantidad de verde (green).
- bb será la cantidad de azul (blue).
El ejemplo que sigue sería la manera de darle color a nuestra página web (os pongo en negrita lo único que añadimos, bgcolor que es background color o color de fondo y va dentro del tag <body>):
<html>
<head>
<title>Primera Página</title>
</head>
<body bgcolor=#5d0000>
Mi primera página web
</body>
</html>
<head>
<title>Primera Página</title>
</head>
<body bgcolor=#5d0000>
Mi primera página web
</body>
</html>
Para escoger el color podemos utilizar cualquier herramienta de dibujo que tenga una paleta de colores o el mismo programa GIMP. Abriendo el programa y haciendo doble click sobre el cuadrado de color negro se nos abre un cuadro de diálogo donde podemos escoger el color que nos gusta o modificar los valores de rojo, verde o azul.
En la próxima entrada hablaremos de cómo darle forma y color al texto...
No hay comentarios:
Publicar un comentario