DANDO FORMATO AL TEXTO



      Siguiendo el sentido de las etiquetas, ahora vamos a aprender algo sobre como presentar los t�tulos y las im�genes en su p�gina, para esto abra el archivo formato1.htm como ya se explic� en la secci�n anteri�n y ubique la siguiente etiqueta:

<h1 align="center"><font color="#000000"><em><u><b>TITULO EN LA PAGINA AQUI<b></u></em></font></h1>

   Esta es una etiqueta de t�tulo <h 1-6> </h 1-6 > bastante simple.  En general los atributos mas comunes de los t�tulos y  texto en general son los siguientes:

  •  Tama�o del texto: Cambiando de h1 al h6 las dos etiquetas <h1>

  • Color del texto: Cambiando donde dice #000000 (negro) por cualquiera de los c�digos que se mostraron en la tabla anterior. Recuerde tomar en cuenta el color de fondo antes de elegir el color de sus textos.

  • Subrallado: Esto se cambia eliminando o colocando las  dos etiquetas
    <u> </u>

  • Negrita: De manera similiar, si a�ade etiquetas <b></b> en los extremos del texto este queda en negritas.

  • Cursiva: Para que un texto se presente en letra cursiva, este debe quedar dentro de dos etiquetas <em> </em>

  • Ahhh y por supuesto, lo mas importe, escriba el texto que le guste como titulo substituyendo donde dice "TITULO DE LA PAGINA AQUI" sin comillas.



   Ejemplo terminado:


<h1 align="right"> <font color="#808080">LA PAGINA DEL SR. PACO</font></h1>

   Efecto:

LA PAGINA DEL SR PACO

    Si gusta puede guardar los cambios y cargar la p�gina (o actualizar) la p�gina en el navegador para ver los cambios.

 

 COMO PRESENTAR IMAGENES:

Introducci�n:

   Se puede escribir un libro entero  sobre como optimizar una imagen para Internet. Sin embargo, los factores m�s importantes para presentar una imagen en una p�gina web son: El formato, y el tama�o (f�sico y en bytes).

   Si usted tiene algo de experiencia navegando en la red, ya se habr� dado cuenta que los formatos m�s comunes para enviar fotos son el gif y el jpg. Esto tiene sus motivos. Cuando uno guarda una foto en formato bmp (o cualquier otro no comprimido) el tama�o en bytes del archivo que contiene la foto es GIGANTESTO 2 a 3 Mb  una foto 4 x 6�.

   En el formato gif la misma foto puede estar por el orden de los 500 a 700 Kb. Y si la guarda en formato Jpg puede llegar hasta los 180 Kb dependiendo el factor de compresi�n elegido. Como puede Ver, en estos formatos se utilizan MENOS BYTES pero de todas formas son demasiados. Particularmente en Internet, porque una imagen de 500 Kb puede tardar en cargarse hasta 4 MINUTOS A 28.8 Kbps. Esto espantar�a autom�ticamente a cualquiera de su p�gina.

   Otro aspecto importante a considerar es que de ser posible (si sabe como hacerlo), guarde los archivos de fotos.jpg en codificaci�n "progresiva" y los foto.gif en modo "entrelazado" Esto har� que sus im�genes aparezcan en su p�gina a medida que se van cargando. (esto no es indispensable pero da un toque agradable).

   Mi consejo final para las im�genes, es que en su programa de retoque fotogr�fico, recorte la foto lo m�s que pueda para colocar solo lo imprescindible. Luego reduzca su tama�o para que sea m�s �liviana�. Y por �ltimo, gu�rdela en el formato que le ofrezca la mejor compresi�n posible. Un rango apropiado estar� entre los 30 a 120 Kb. (para todas las im�genes de la p�gina).

 

Ahora el HTML

   Busque en el editor de texto lo siguiente: 

<img src="IMAGENPERSONAL.GIF"�alt="mi foto"� height="20" width="20"> 

   Esta etiqueta le dice al navegador algo as� como: Ahora carga y presenta la foto imagenpersonal.gif en tama�o 20 x 20 pixels. Si tienes la presentaci�n de im�genes desactivada, entonces escribe el texto "mi foto" en el recuadro de 20 x 20. 

   Lo que podemos hacer es cambiar donde dice "imagenpersonal.gif" por el nombre de la foto que queremos colocar en la p�gina. Adem�s es necesario seleccionar el tama�o en que va a salir la foto para que no se deforme. Esto lo hacemos conociendo el tama�o real de la foto en cuesti�n desde cualquier programa de retoque fotogr�fico. Esto se hace generalmente desde el men� propiedades o informaci�n de la foto. 

   Para los que no tienen ninguno de estos programas existe otra salida. Arrastre la foto que quiere utilizar hacia  una ventana de su navegador,  luego de que el navegador la cargue, col�quele encima el puntero y presionando el bot�n derecho selecione "propiedades".

 

   Ahora ver� algo como as�:

 

   Una vez conocido el tama�o real de la foto, cambiamos el valor height=�20� por el alto en p�xeles de la foto y donde dice width=�20� por su ancho. Otra cosa que podemos hacer es modificar el texto que aparece en los navegadores cuando se desactiva la opci�n de �ver las im�genes�. Esto se hace cambiando donde dice alt=�mi foto� por lo que queramos. 

   Ejemplo terminado: 

<img src="fotobebe.jpg" alt="Esta es la foto del Nuevo Beb�" height="120" width="60">

     Si usted desea una im�gen de fondo en su p�gina, utilice el archivo formato2.htm y busque entre las primeras l�neas de c�digo la siguiente expresi�n:

<body background="FONDO FORMATO GIF O JPG"> y remplace donde dice fondo formato gif o jpg por el nombre de su im�gen con su respectiva extensi�n

     Ejemplo:

<body background="fondofloral.gif"> 

   Es importante mientras aprendamos y para evitar complicaciones, que tanto en su computador como en el servidor que almacenar� su p�gina, usted guarde el(los) archivo(s) de im�gen(es) y el archivo html, en la misma carpeta. 

   Ahora Puede guardar el ejercicio para ver los cambios en el navegador.

 

  Texto e Im�genes

Hosted by www.Geocities.ws

1