Clase 2 Desarrollo Web

Antes de empezar vale la pena mencionar que HTML(“hiper text markup language”), es un
lenguaje para páginas web que utiliza marcas o etiquetas.
Las etiquetas son marcas o palabras claves encerradas en “<” menor que y “>” mayor que. Estas
etiquetas van a permitir la realización de la página web. Una etiqueta en HTML se prototipa así:
<etiqueta> la palabra clave encerrada entre el “<” y el “>”. Generalmente las etiquetas se cierran y
tienen el nombre de etiquetas llenas es decir:
Cuando utilizamos una <etiqueta> se debe cerrar así: </etiqueta> escribiendo la misma etiqueta
pero antecediendo el “/” slash a la palabra clave.
Cuando en una etiqueta no hay necesidad de cerrarla recibe el nombre de etiqueta vacía.
Para comenzar a escribir código HTML abrimos bien sea el código de la página anteriormente
creada o en algún editor de texto.
En este caso en el Block de Notas lo primero que debemos de escribir es:
<html>
</html> // No es necesario. Pero si conveniente para realizar un buen código fuente.
Una página web se compone de tres elementos principales.
 Un título
 Una Cabeza
 Un cuerpo
Si pegas todo este texto en un bloc de notas y lo guardas como: prueba.html y lo abres en un
navegador, verás a qué hace referencia cada parte del código. Te invito para que hagas el ejercicio,
lo guardes como prueba.html y vas modificando palabras y luego guardar para ver qué cambios se
van dando.

<HTML>
<HEAD>
<TITLE>BIENVENIDOS
</TITLE>
</HEAD>
<BODY>
<H1>Historia de Internet<H1>
<N>Bienvenidos al blog de …<N>
<Bg Color="Red">
<BODY BGCOLOR="#FF0044">
<BR>
<FONT COLOR="#FFFFFF">Musica<FONT>
<BR>
<IMG SRC="http://ayudawp.com/wp-content/uploads/2008/08/imagen.jpg" ALT="Casa azul">
</BODY>

Veamos qué quiere decir cada uno:
<HTML> … </HTML>: Delimita y engloba toda la página web, que consta de cabecera y cuerpo.
<HEAD> … </HEAD> : Delimita y engloba la cabecera de una página, que contiene un conjunto de
informaciones que no se muestran en la ventana, entre ellas el título de la página, pero que
pueden ayudar a los navegadores y a los buscadores para interpretar o a encontrar correctamente
la página.
<TITLE> … </TITLE>: Dentro de la cabecera (HEAD), lo que se incluye aquí se muestra en la barra
del título de la ventana del navegador.
<BODY> … </BODY>: Delimita y engloba el cuerpo de la página, que son el conjunto de
información (texto e imágenes) que se muestran en la página, así como las indicaciones de cómo
deben mostrarse.
<Bg Color="Red">: Agregar color al fondo. También se puede reemplazar la palabra Red por
colores Hexadecimales por ejemplo #FF0044 (Recuerda que son máximo 6 caracteres sin contar el
numeral)
<H1> ... </H1> o <H2> ... </H2>… </H3> … </H4>: Párrafos que son encabezamientos (con distintos
niveles).
<P>... </P>: Párrafos normales.
<P align="center">... </P>: El atributo align permite alinear el texto del párrafo. Se puede aplicar
igual a las etiquetas <H1>, <H2>, etc ...
<BR>: Permite partir un párrafo empezando una línea nueva pero sin dejar espacio.
<HR>: Pone una linea horizontal de separación. (admite atributos)
<BLOCKQUOTE>…</BLOCKQUOTE>: Sangra el párrafo.
Negrita: <B>…</B>
Cursiva: <I>…</I>
Subrayado: <U>…</U>

Teletipo: <TT>…</TT>
Tachado: <STRIKE>…</STRIKE>
Grande: <BIG>…</BIG>
Pequeña: <SMALL>…</SMALL>
Superíndice: <SUP>…</SUP>
Subíndice: <SUB>…</SUB>
<a href="http://servidor/recurso.html">texto del enlace</a>
Enlace absoluto a una página

Clase 2 Desarrollo Web

Recommended

Recommended

More Related Content

What's hot

What's hot (19)

Similar to Clase 2 Desarrollo Web

Similar to Clase 2 Desarrollo Web (20)

More from Planeta Digital 360

More from Planeta Digital 360 (20)

Recently uploaded

Recently uploaded (20)

Clase 2 Desarrollo Web