Iniciación al lenguaje HTML
El lenguaje HTML es el lenguaje con el que se definen las páginas web. Funciona mediante un conjunto de etiquetas que definen la forma en la que se va a visualizar todos los elementos de la página web.
En esta entrada vamos a tener un primer contacto con el lenguaje HTML, utilizando el programa "Dreamweaver".
Abrimos el programa Adobe Dreamweaver CS6, y este se nos presenta de la siguiente forma:
%2B13.12.58.png)
Nos dirigimos a la parte superior del programa y clickamos sobre "Dividir":
%2B13.14.49.png)
E introducimos el siguiente código:
En esta entrada vamos a tener un primer contacto con el lenguaje HTML, utilizando el programa "Dreamweaver".
Abrimos el programa Adobe Dreamweaver CS6, y este se nos presenta de la siguiente forma:
<html>
<head>
<title>TU NOMBRE</title>
</head>
<body bgcolor="#6600CC">
<font color="#FFCCCC" size="5">Hola, estoy haciendo pruebas.</font>
</body>
</html>
Clickamos sobre ACTUALIZAR
%2B13.17.02.png)
<head>
<title>TU NOMBRE</title>
</head>
<body bgcolor="#6600CC">
<font color="#FFCCCC" size="5">Hola, estoy haciendo pruebas.</font>
</body>
</html>
Clickamos sobre ACTUALIZAR
De esta manera nos aparece la visualización de los elementos que hemos formateado junto con el texto introducido.
A continuación introducimos el siguiente código:
<html>
<header>
<hgroup>
<h1>El blog de Luna Jiménez</h1>
<h2>Este es el blog de Mejorando la web</h2> </hgroup>
</header>
<nav>
Aquí va la botonera de navegación
</nav>
<section>
<article>Aquí va un post, con su titulo en P1</article> <article>Aquí va un post, con su titulo en P2</article> <article>Aquí va un post, con su titulo en P3</article> </section>
<aside>
Barra lateral con cosas que nadie lee, como cuentas de twitter, facebook, posts viejos, etc.
</aside>
<footer>
Pie de pagina, amenazas de copyright, etc.
</footer>
</html>
De nuevo clickamos sobre ACTUALIZAR para visualizar todas las modificaciones.
%2B13.27.00.png)
<header>
<hgroup>
<h1>El blog de Luna Jiménez</h1>
<h2>Este es el blog de Mejorando la web</h2> </hgroup>
</header>
<nav>
Aquí va la botonera de navegación
</nav>
<section>
<article>Aquí va un post, con su titulo en P1</article> <article>Aquí va un post, con su titulo en P2</article> <article>Aquí va un post, con su titulo en P3</article> </section>
<aside>
Barra lateral con cosas que nadie lee, como cuentas de twitter, facebook, posts viejos, etc.
</aside>
<footer>
Pie de pagina, amenazas de copyright, etc.
</footer>
</html>
De nuevo clickamos sobre ACTUALIZAR para visualizar todas las modificaciones.
Comentarios
Publicar un comentario