Sola Para Entendidos: octubre 2011

Con estos pasos tendrás tu pagina web realizada ☺

Debes de tener una Computadora dar :

inicio
programas
Accesorios
Bloc de notas
tema sobre el cual se va a realizar la pagina

se detalla el formato básico para una página en HTML:

<HTML>

<HEAD>

<TITLE>Título</TITLE>

</HEAD>

<BODY>

Aquí se introducen las tablas, las fotos, enlaces

</BODY>

</HTML>

Las páginas empiezan con la etiqueta <HTML>, seguida por las etiquetas <HEAD>. Encontrará las etiquetas para introducir el nombre de la página en las etiquetas

<TITLE>. Se trata del título que aparece en la esquina izquierda superior de su navegador al acceder a la página. Note que se cierran las etiquetas TITLE y HEAD antes de introducir el contenido en sí de la página dentro de las etiquetas <BODY>.

PÁRRAFOS SALTOS DE LINEAS Y ESPACIOS :

Para crear un nuevo párrafo sólo tiene que añadir una etiqueta delante del texto. Así se crea una línea en blanco antes de empezar el párrafo.

Los saltos de línea se crean con la etiqueta , que hace que el texto comience una línea por debajo de la anterior, pero sin insertar ninguna línea en blanco.

También observará que puede usar la barra espaciadora del teclado mientras modifica textos HTML, aunque el navegador convertirá todos esos espacios a un espacio como máximo.

Para crear más de un espacio debe usar la etiqueta & nbsp; (por favor, no incluya el espacio en blanco que figura entre & y nbsp;).

Al insertar esta etiqueta en el texto está indicando al navegador que desea insertar espacios en la línea…

Formato para párrafos :

y Sirve para colocar un texto en Negrita.
 y Sirve para subrayar un texto
<STRIKE> y </STRIKE> Sirve para tachar un texto.
 y Cumple la misma función que 
 y Para colocar un texto en cursiva.
 texto con énfasis texto con énfasis
<CITE> citación</CITE> citación
<DFN> definición</DFN> definición
<KBD> teclado</KBD> teclado
<SAMP > ejemplo</SAMP> ejemploSIZE: Regula el tamaño de los caracteres.
Ejemplo: texto... .
FACE: Es la fuente que se quiere usar, Arial, Times new Roman

¿Cuánto texto se puede agregar?

Existe un número límite de caracteres que se pueden escribir en los cuadros de texto. Una vez que se alcanza ese límite, no se puede escribir más texto.

FUENTES :

Puede usar la etiqueta FONT para mejorar aún más el aspecto del texto. Por ejemplo, puede definir el tipo, tamaño y color de la tipografía, todo ello con la etiqueta FONT.

EJEMPLO :

¡HOLA!

¡HOLA! en la fuente ARIAL, tamaño 2 y color azul: ¡HOLA!

COLOR : (etiquetas)

Blanco

Blanco

Negro

Negro

Verde

Verde

Azul

Azul

Para ponerle color de fondo a la página escribir:

<body bgcolor=#808080></body> con el cual obtendremos un color de fondo gris oscuro.

PONER IMAGEN DE FONDO :

Es muy sencillo, basta con usar la etiqueta:
background="localización de la imagen" Esta etiqueta va dentro de la etiqueta <body>.

EJEMPLO :

imagen de fondo : ♣

PARA AGREGAR LISTAS :

Las listas pueden ser: Lista desordenada, <UL> (Unordered List).
Lista ordenada, <OL> (Ordered List).

Ejemplos de diferentes tipos de listas:

Lista con números romanos:
<ol>
<li type=I>Manzana
<li type=I>Zanahoria
<li type=I>Lechuga
<li type=I>Tomate
</ol>
Manzana
Zanahoria
Lechuga
Tomate

Lista numerada:
<ol>
<li>Manzana
<li>Zanahoria
<li>Lechuga
<li>Tomate
</ol>
Manzana
Zanahoria
Lechuga
Tomate

Lista con puntos:

<ul>
<li> Manzana
<li> Zanahoria
<li> Lechuga
<li>Tomate
</ul>
Manzana
Zanahoria
Lechuga
Tomate

Lista con círculos:
<ul>
<li type=circle> Manzana
<li type=circle> Zanahoria
<li type=circle> Lechuga
<li type=circle> Tomate
</ul>
Manzana
Zanahoria
Lechuga
Tomate

Lista con cuadrados:
<ul>

<li type=square> Manzana
<li type=square> Zanahoria
<li type=square> Lechuga
<li type=square> Tomate
</ul>
Manzana
Zanahoria
Lechuga
Tomate

PARA DARLE COLOR A TU PAGINA :

Ahora los colores se nombran ya sea en su nombre correspondiente en Inglés, o también en sus códigos respectivos en números.
Ejemplo 1:

< body bgcolor="black" text="white" >

Ejemplo 2:

< body bgcolor="#000000" text="#FFFFFF" >

Esto hará que tu página sea con un fondo de color negro y el texto blanco.

COMO CAMBIAR LOS COLORES DEL TEXTO Y DEL FONDO ?

La etiqueta <BODY> controla los colores, las imágenes de fondo y algunas otras características.

Puede controlar el color del fondo, texto y enlaces de la página principal por medio de la etiqueta <BODY>.

Para establecer el color del fondo, texto, enlace, enlace visitado o enlace activo, sustituya el valor de un color modificando los seis caracteres que aparecen tras el símbolo "#" como en el siguiente ejemplo.

No haga que todos ellos tengan el mismo color, ya que de hacerlo no vería nada en la página (porque tanto el fondo como el texto tendrían el mismo color).

Puede incluir cualquiera de los siguientes elementos (BGCOLOR, TEXT, LINK, VLINK o ALINK), o no incluir ninguno de ellos.

Éstos son algunos colores que puede usar:

Blanco #FFFFFF

Amarillo #FFFF66

Rojo #FF0000

Gris #CC9999

Azul #0000FF

Verde #00FF00

Negro #000000

Morado #CC33FF

Azul claro #00CCFF

COMO AÑADO UNA TABLA :

• Cada tabla tiene que abrirse con esta etiqueta <TABLE> y cerrarse con ésta </TABLE>.

• Cada fila de la tabla (table row en inglés) debe abrirse con esta etiqueta <TR> y cerrarse con ésta </TR>.

(etiqueta)

<TABLE>

<TR>

</TR>

</TABLE>

Border: sirve para ponerle un borde a la tabla; cuanto más alto sea el número

COMO REALIZAR LOS LINKS (enlaces) :

En la página puede crear enlaces que señalen a:

1. Una página o archivo del directorio

2. Una página o archivo de un subdirectorio

3. Una ubicación externa (en Internet)

fin de lista

Para crear un enlace a una página o archivo del mismo directorio que el de la página que se modifica, basta con usar la ruta de acceso relativa, con lo que el enlace sólo incluirá el nombre del archivo:

<a href="pagina.html">Página siguiente</a>

En la página aparecerá el texto "Página siguiente", y al hacer clic en él aparecerá la página cuyo archivo se denomina pagina.html.

Si desea cambiar el texto del enlace sustituya "Página siguiente" por el que desee usar. Además, si desea que el enlace señale a otra página, bastará con que sustituya "pagina.html"

por el nombre de ese archivo.

Cuando el enlace sea a un subdirectorio, debe usar este formato:

<a href="subdirectorio/pagina.html">Página siguiente</a>

Al crear un enlace a una página externa al directorio, o en Internet, basta con usar la dirección completa (denominada ruta de acceso absoluta) en lugar de la ruta de acceso relativa:

<a href="http://servidor.com.. ó, .es">Ir a Mi página!</a>

El código anterior, crea un enlace que permite ir a la página "seleccionada!"

COMO AÑADO UN LINKS DE IMAGEN :