Hoy les voy a enseñar como hacer paginas web con el block de notas!
Primero tienen que saber sobre el lenguaje "HTML":
El lenguaje "HTML" es el lenguaje que se utiliza para crear paginas web el cual utiliza basicamente etiquetas o "tags"donde:
La etiqueta puede ser escrita en mayusculas o minusculas
Hay una etiqueta de inicio y una de cierre
No debe contener espacios y su estructura es:
<etiqueta> "etiqueta de inicio"
texto
</etiqueta> " etiqueta de cierre"
Block de notas
Navegador
Esta es la estructura basica para poder crear paginas. Dentro de todo esto va el contenido de nuestra pagina que al final le dara forma a la pagina.
<HTML>
<HEAD>
<TITLE> TEXTO </TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
A contunuacion les dejo las etiquetas que me se con su significado (si alguien se sabe otras, avisenme y las publico)
<center> texto </center>...................Centra el texto encerrado en la etiqueta
<br>.....................Provoca un espacio (como el enter en word). no tiene etiqueta de cierre
<hr>.................... Crea una linea horizontal en el lugar donde se ubique la etiqueta . No tiene etiqueta de cierre.
<b> texto </b> ................ Pone las letras negritas.
<i> texto </i>............... Pone las letras en cursivas.
<a> texto </a>.................Crea hipervinculos. Ej.: <a href="taringa.com"> T! </t>
<font> texto </font> ........... Tipo, tamaño y color de la letra. ej.: <font face="tipo de letra" size="tamaño" color="color en ingles">
<marquee> texto </marque>.......... Crea una barra de color con texto que se mueve. Ej.: <marquee bgcolor="blue"> T! </marquee>
<body background="imagen.jpg">....... Pone una imagen de fondo. La imagen debe estar en la misma carpeta que la pagina web. En donde dice jpg puede ir gif o bmp (depende del fomato de la imagen)
<img src="imagen.jpg" alt="descripcion de la imagen" align="left, right, center"....... Pone una imagen en el texto. no necesita etiqueta de cierre.
Ahora que ya leyeron esto les toca hacer su propia pagina. Sigan los siguientes pasos:
1. Primero creamos una nueva carpeta. Le podemos poner cualquier nombre. Alli estara nuestra pagina web.
2. Abrimos block de notas y ponemos esto:
<HTML>
<HEAD>
<TITLE> TEXTO </TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
(recuerden que es la estructura basica de la pagina )
3. Empezamos a modificar la estructura basica poniendo los tags o etiquetas que vimos arriba.
4. Si ponen alguna imagen recuerden que debe estar en la misma carpeta que la pagina.
5. Cuando crean que ya esta lista guardenla en la carpeta que creamos. pongan cualquier nombre, pero al final debe de ir ".html". ejemplo: "paginaweb.html.
6. Vamos a la carpeta y debe aparecer un block de notas con el simbolo de nuestro navegador predeterminado (firefox, safari, chrome, etc.)
7. Si lo abrimos aparecera la pagina en nuestro navegador.
Si quieren modificar la pagina les recomiendo que abran la pagina y el block de notas al mismo tiempo y cada que modifiquen algo en el block guardenlo y actualizen la pagina. Asi veran todo lo que hacen .
Por el momento la pagina se guardara en tu computadora. Luego les pongo en este post como hacer para guardarla en la red.
Primero tienen que saber sobre el lenguaje "HTML":
El lenguaje "HTML" es el lenguaje que se utiliza para crear paginas web el cual utiliza basicamente etiquetas o "tags"donde:
La etiqueta puede ser escrita en mayusculas o minusculas
Hay una etiqueta de inicio y una de cierre
No debe contener espacios y su estructura es:
<etiqueta> "etiqueta de inicio"
texto
</etiqueta> " etiqueta de cierre"
Herramientas necesarias para crear HTML
Block de notas
Navegador
Esructura basica
Esta es la estructura basica para poder crear paginas. Dentro de todo esto va el contenido de nuestra pagina que al final le dara forma a la pagina.
<HTML>
<HEAD>
<TITLE> TEXTO </TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
Etiquetas
A contunuacion les dejo las etiquetas que me se con su significado (si alguien se sabe otras, avisenme y las publico)
<center> texto </center>...................Centra el texto encerrado en la etiqueta
<br>.....................Provoca un espacio (como el enter en word). no tiene etiqueta de cierre
<hr>.................... Crea una linea horizontal en el lugar donde se ubique la etiqueta . No tiene etiqueta de cierre.
<b> texto </b> ................ Pone las letras negritas.
<i> texto </i>............... Pone las letras en cursivas.
<a> texto </a>.................Crea hipervinculos. Ej.: <a href="taringa.com"> T! </t>
<font> texto </font> ........... Tipo, tamaño y color de la letra. ej.: <font face="tipo de letra" size="tamaño" color="color en ingles">
<marquee> texto </marque>.......... Crea una barra de color con texto que se mueve. Ej.: <marquee bgcolor="blue"> T! </marquee>
<body background="imagen.jpg">....... Pone una imagen de fondo. La imagen debe estar en la misma carpeta que la pagina web. En donde dice jpg puede ir gif o bmp (depende del fomato de la imagen)
<img src="imagen.jpg" alt="descripcion de la imagen" align="left, right, center"....... Pone una imagen en el texto. no necesita etiqueta de cierre.
Practica!!
Ahora que ya leyeron esto les toca hacer su propia pagina. Sigan los siguientes pasos:
1. Primero creamos una nueva carpeta. Le podemos poner cualquier nombre. Alli estara nuestra pagina web.
2. Abrimos block de notas y ponemos esto:
<HTML>
<HEAD>
<TITLE> TEXTO </TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
(recuerden que es la estructura basica de la pagina
)
3. Empezamos a modificar la estructura basica poniendo los tags o etiquetas que vimos arriba.
4. Si ponen alguna imagen recuerden que debe estar en la misma carpeta que la pagina.
5. Cuando crean que ya esta lista guardenla en la carpeta que creamos. pongan cualquier nombre, pero al final debe de ir ".html". ejemplo: "paginaweb.html.
6. Vamos a la carpeta y debe aparecer un block de notas con el simbolo de nuestro navegador predeterminado (firefox, safari, chrome, etc.)
7. Si lo abrimos aparecera la pagina en nuestro navegador.
Si quieren modificar la pagina les recomiendo que abran la pagina y el block de notas al mismo tiempo y cada que modifiquen algo en el block guardenlo y actualizen la pagina. Asi veran todo lo que hacen
.
Por el momento la pagina se guardara en tu computadora. Luego les pongo en este post como hacer para guardarla en la red.