Imágenes y otros recursos Como se ha podido ver anteriormente, el
desarrollo de una página significa la creación de un
archivo en código HTML, pero no es lo único que debemos crear. En la mayoría de los casos también desearemos incluir imágenes y para ello será indispensable crear los correspondientes ficheros gráficos. El proceso para incluir una imagen en una página empieza por la creación de la imagen con un proyecto de diseño gráfico o mediante su digitalización con un escáner. Será indispensable que conozcamos sdeterminados de los
proyectos de diseño gráfico que tienen lugar en el mercado. Son muy interesantes Photoshop, Paint Shop Pro, Fireworks o Gimp, que sería la opción gratuita. En un comienzo podremos contentarnos con manejarlos por arriba y nos resultará medianamente fácil, pero según avancemos en el sendero
como diseñadores web será más indispensable dominarlos para conseguir frutos más profesionales. Los
tipos de ficheros gráficos que soporta Internet son JPG, GIF y PNG. Tienen características diferentes y por tanto usos distintos. Podemos
conocer más esto en el reportaje Formatos gráficos de Internet. Una vez poseemos los ficheros gráficos los ponemos en el mismo directorio que los ficheros HTML o en un subdirectorio de este y en el código de la página HTML pondremos una etiqueta especial para incluir la imagen, o la insertaremos con vuestro proyecto editor de HTML. Lo significativo de todo esto es que nos percatemos que el espacio web está compuesto por ficheros HTML, GIF, JPG y PNG e inclusive los correspondientes ficheros que contengan videos, animaciones Flash, proyectos Java, etc. Todos estos ficheros los poseemos que tener bien localizados dentro de vuestro disco duro y dentro de un mismo directorio. Por supuesto el orden
como estén los ficheros dentro del directorio es indiferente, pero podrá ser interesante que incluyamos subdirectorios para que quede todo mejor colocadito y su mantenimiento sea más fácil. Por ejemplo, una técnica muy habitual es ubicar todas las imágenes dentro de un subdirectorio llamado images. El meta de tanto orden y conocimiento de la localización de todos los ficheros es que a la hora de crear las páginas tendremos que especificar la ruta de cada enlace o cada imagen. Luego tendremos que subirlos al
servidor sin olvidarnos de ninguno, lo que es otra razón para tenerlos todos localizados. En capítulos posteriores veremos cómo se hace este paso. Un asunto tradicional con las imágenes y otros ficheros
externos consiste en que
cuando vemos las páginas en vuestro ordenador se ven correctamente y no falta ninguna imagen ni otros probables elementos. Sin embargo, cuando subimos los ficheros al servidor y vemos la página desde Internet esta se presenta con yerros en las imágenes y otros elementos, de modo que no se
pueden ver. Esto suele llamarse tener una "imagen rota". La razón por la que está rota es que no puede localizarla en el servidor y por tanto no la puede mostrar. Esto puede ser debido a algúnas razones. La imagen no ha sido subida al servidor La posición relativa de la imagen con respecto a la página no es la misma en vuestro ordenador (local) y en el servidor (remoto). Por ejemplo, las imágenes en local podrían estar en el directorio images entretanto que en remoto podrían estar en el mismo directorio que la página, lo que sería un error. Siempre se debe respetar la articula de directorios que hay en local y crearla exactamente idéntico en remoto. La imagen que se intenta alcanzar tiene un sendero dirigido a un directorio de vuestro disco duro,
como al ver la página desde Internet no se tiene entrada a tu disco duro, los
usuarios no podrán ver las imágenes. Cuando trabajamos con un editor de HTML y colocamos imágenes en determinadas ocasiones el editor coloca senderos en vuestro disco duro en espacio de senderos relativos. Los senderos relativos son rutas que empiezan en el espacio donde está la página que estamos diseñando. Hay una manera muy provechoso de conseguir pistas acerca del fallo de una imagen, consiste en pulsar con el botón derecho del ratón
sobre ella y seleccionar propiedades. Esto nos presenta inmaneración
sobre la imagen y nos inmanera sobre el espacio donde se está intentando encontrarla.