Una Pagina Web Basica
Leccion #3

Que tal si ahora aprendemos sobre las imagenes!

Hay 2 tipos de imagenes que la gran mayoria de navegadores aceptan un tipo es GIF que simplemente tiene un extension .gif y el otro tipo es JPG que tiene un extension .jpg.

Cuando decidas poner imagenes en tus paginas y te aseguro que lo haras, tienes que especificar siempre la extension; La imagen>>>> carro.jpg no es lo mismo que carro.gif y absolutamente no es lo mismo que simplemente carro.

ya sabes como guardar esta imagen no?

Bueno y como se ponen estas cosas?
La etiqueta
<img> lo hara por ti (image)

<body color="#000000">
<img FACE="Verdana">
</body>

Pero esto no es suficiente tienes que dar el nombre de la imagen algo asi.

<body color="#000000">
<img src="ok.gif">
</body>

Y aunque no es totalmente necesario pero si quieres que tus paginas sean vistas rapidamente debes de darles a tus imagenes el atributo del tamaño mas o menos asi.

<body color="#000000">
<img src="ok.gif"
width=74 height=92>
</body>

Entonces tenemos algo asi.


Cuando ponemos imagenes en una pagina tenemos que poner el atributo src que te dara el nombre de la imagen y el lugar donde esta relativamente de donde esta la pagina en otras palabras si yo escribo src="ok.gif" el navegador buscara por esta imagen en el mismo directorio en el que se encuentra la pagina.

src="ok.gif" quiere decir que la imagen esta en la misma carpeta que se encuentra el documento html.
src="graficos/ok.gif" quiere decir que la imagen esta en una carpeta abajo dela carpeta que tiene el documento html que busca la imagen; esto puede seguir hasta llegar a la carpeta donde se encuentra la imagen.
src="../ok.gif" quiere decir que la imagen esta en una carpeta arriba de la carpeta donde esta el documento html que la pide; esto puede seguir hasta llegar a la carpeta donde se encuentra la imagen.

Espero que esto clarifique como usar este atributo y puedas asi organizar tus paginas y carpetas.


Pero que pasa si cambiamos las dimensiones de la imagen.

<body color="#000000">
<img src="ok.gif" witdth=
400 height=92>
</body>


<body color="#000000">
<img src="ok.gif" witdth=
20 height=41>
</body>


Cuando trabajes con imagenes recuerda de que tienen una gran cantidad de informacion trata de usar imagenes pequeñas en "Kb" las puedes recortar o les puedes reducir la cantidad de colores esto bajara la cantidad de informacion considerablemente.

Algo que esta de moda ultimamente es el uso de "thumbnails", basicamente copiamos una imagen y la reducimos en tamaño hacia algo pequeño y de ahi hacemos un enlace a la imagen que no esta modificada. "hablaremos de enlaces en la leccion 5" creo que es hora que te muestre este efecto.

Digamos que quiero compartir unas imagenes de mi coleccion

Caramelos Dinero flor

Selecciona cualquiera de las imagenes para ver la version grande!!!

Bueno eso es todo lo que tienes que hacer para poner imagenes en tus paginas, no es exactamente una cirugia del cerebro.

 

ATRAS  = = = ADELANTE

  

Introduccion Leccion 1 Leccion 2 Leccion 3 Leccion 4 Leccion 5 Leccion 6
E-mail