Con este gran manualillo podrás "CREAR" tus propias paginas web totalmente gratis y en poco tiempo, sin necesidad de bajar un software, ni nada, sólo necesitamos un simple editor de textos. Un editor de textos no es más que un software que permite escribir y modificar archivos compuestos únicamente por textos ej: Bloc de Notas, etc.
¿Conocimientos Básicos?
HTML (lenguaje de marcas hipertextual) es el lenguaje con el cual se escriben las paqinas web (existen otros + ), y se basa principalmente en colocar etiquetas (o marcas) las cuales indican el comienzo y final de una instruccion. HTML tambien consta de una estructura: Cabecera o head - cuerpo o body, mientras vayamos avanzando te daras cuenta de su importancia.
El inicio de un documento html se marca con la etiqueta "<html>" (sin comillas), y el final con un ( / ) antes </html>.
<html>
Linea de codigos.
</html>
La cabecera o head guarda informacion acerca del documento, se inicia con <head> y finaliza con </head>.Esta etiqueta va segidamente despúes del <html> y antes de </html> y puede contener otras etiquetas como <title> y </title> que mostraran el titulo de la pagina que suele ser visualizado por los navegadores en la cabecera de página.
<html>
<head>
<title> Conocimiento Libre </title>
Linea de codigos.
</head>
</html>
<BODY bgcolor="#XXXXXX">. Con esta etiqueta podras colocar un color de fondo para tu web. Las "XXXXXX", hacen referencia a los colores en formato hexadecimal.
Si deceas conocer toda la gama de colores en formato hexadecimal has click en este links. Colores en Hexadecimal
<BODY background="Imagen.jpg">. Podras colocar una imagen de fondo, cambia el nombre "Imagen.jpg", por la de tu imagen.
<html>
<head>
<title> Comocimiento Libre </title>
</head>
<body>
Cuerpo de infomación
</body>
</html>
Y ya tienes la estructura de tu pagina, guarda el archivo con cualquier nombre y con la extensión html ej: mipagina.html. Veras que tu Bloc de Notas se transformara en un documento html.
Ahora vienen los adornos para tu pagina.
<center> , </center>. Esta etiqueta se utiliza para centrar cualquier tipo de archivo
<html>
<head>
<title> Comocimiento Libre </title>
</head>
<body>
<center>Cuerpo de infomación</center>
</body>
</html>
<p>. "P" es una etiqueta para separar tus textos en parrafos, muy similar a <br>, pero saltara 2 lineas.
<h1> , </h1>. H1 resalta el titulo de cada articulo de tu pagina agrandando su tamaño y colocandolo en negrita, tambien puedes controlar su tamaño, <h3> y cerrandolo con </h3>, obviamente dentro de estas etiquetas ira el titulo a resaltar.
<hr>. Mostrara una linea horizontal de manera que subrayara el titulo o cualquier articulo que este antes de hr, no hay necesidad de cerrarla.
<blockquote> y </blockquote>. El texto que vaya dentro de estas etiquetas sera mostrado con sangria hasta que sea cerrado.
<html>
<head>
<title> Comocimiento Libre </title>
</head>
<body>
<center>
<h3>Bienvenidos a el blog del Conocimiento libre</h3> <hr>
</center>
<blockquote>Muchas gracias por visitarnos, Infinidades de cosas podras encontrar en este sitio<p>
<center>http://www.buggatux.blogspot.com</center>
</body>
</html>
<u> y </u>. El texto sera subrayado.
<!-- coment -->. Para realizar comentarios que no seran mostrados por el navegador.
Insertar Links
<a href="http://www.bugga.html">Nom_Pag</a>. Esta etiqueta te servida para crear liks a otras paguinas. Si deceas que estos se habran dentro de la misma pagina, introduce la etiqueta tal cual, pero si lo que deceas es abrir un links en otra pagina para que los usuario no salgan de la tuya agrega el atributo target="0" y quedaria de la siguiente forma.<a href="http://www.bugga.html" target="0">Nom_Pag</a>
<html>
<head>
<title> Comocimiento Libre </title>
</head>
<body>
<center>
<h3>Bienvenidos a el blog del Conocimiento libre</h3> <hr>
</center>
<blockquote>Muchas gracias por visitarnos, Infinidades de cosas podras encontrar en este sitio
</blockquote>
<center>
<a href="http://www.buggatux.blogspot.com" target="0">Buggatux</a>
</center>
</body>
</html>
Te habras dado cuenta que la etiqueta anterior realiaza una sangria efectivamente, pero es continua osea, simpre escribiras utilizandola. Si lo que deceas es una sangria simple ingresa la siguiente etiqueta <p style="text-indent: 50px">, donde el numero 50 harareferencia a la cantidad de lineas que existan desde el lado izquierda de la pagina hasta el inicio del texto.
Insertar Imegenes
<img src="Imagen.jpg">. Con esta etiqueta podras insertar imagenes en tu web, donde hayas guardado tu primera pagina coloca tus fotos que deceas subir, luego ingresa la etiqueta y haz referencia a ella cambiando el nombre "Imagen.jpg" por el de tu foto y coloca su extencion (el formato que tiene en este caso es jpg, pero esisten otros como pgn, gif, etc).
Si lo que deceas es colocar una imagen en el lado izquierdo o derecho de la pagina lo haras con el atributo aling="left" o aling="right" y quedara de la sugiente forma <img src="Imagen.jpg" aling="left right"> (claro que solo uno de los dos).
0 Comments:
Deja tu Comentario