Question

Buenas Noches, he estado estudiando SEO y una de las característica principal en le posicionamiento es la velocidad de carga de un sitio. Para optimizar el trabajo con imágenes se recomienda el uso de Sprites y hago uso de él para los iconos e imágenes como banner y esas cosas estáticas que cambian poco o nunca. Entonces me surgió la inquietante ya que en la programación todo es posible solo depende del nivel de conocimiento que uno tenga. Así que dirigiendome a los más experimentados les pregunto si existe una forma ya sea con JS o PHP para coger las últimas 5 imágenes insertadas en una carpeta de tu servidor y convertirlas en un Sprite y guardarla en otra carpeta para sprite desde donde lo cargará la página web??
Saludos Dairon

Comments

También hay que tomar en cuenta que el tamaño de las imágenes siempre tiene que ser el mismo para que el posicionamiento con el CSS no tenga problemas, porque si no, tendrías que hacer variables para todos los tamaños que tengas pensado utilizar en esas imágenes que se suben o bien, recortar las imágenes como tal.

---

lo que tengo pensado haces es hacer un sprite con las últimas cinco fotos de portada subidas a la sección de albumes, genero el esprite cargo el css original del sitio le append el nuevo css con el mismo nombre de clase por ejemplo albimg1,... albimg5 y eso funcionaria como un refresh de css y guardo el nuevo fichero de css con el nombre que enlazo a mi sitio para así mantener bajo el numero de peticiones GET

---

pero eso no es contenido estático, sino dinámico, estatico son por ejemplos los iconos, banners, imagenes css del sitio web.

http://es.wikipedia.org/wiki/Contenido_din%C3%A1mico

por otra parte al hacer esto es posible que tengas problemas cuando se edite un articulo en tu sitio y sea precisamente esa imagen, tendrías que volver a generar un sprite, entonces estarias usando mas recursos de tu servidor y eso no suena muy bien.

Yo creo que una mejor opcion es comprimir tus imagenes al momento de subirlas para reducir su tamaño. podrias usar alguna libreria como:

http://nielse63.github.io/php-image-cache/

---

Suscribo lo dicho por white y añado a la lista de problemas los generados porque el navegador conserve la imagen en caché ya que como dices no va a cambiar de nombre.

---

entonces que me recomiendan ??

---

Comprimir las imagenes al subirlas, definiendo su calidad con un 90% y guardarlas como jpg podria ayudar, tambien puedes enviar las cabeceras: ´Last-modified´, ´cache-control´ y ´expires´. Si el navegador tiene en cache la imagen podrias enviar un 304.

http://ernieleseberg.com/php-image-output-and-browser-caching/
http://dtbaker.net/web-development/how-to-cache-images-generated-by-php/

---

de todas formas creo que puedo usar el sprite para secciones como las portadas de albumes que se insertaría uno semanalmente ??

---

Lo mismo que dije arriba, estarias complicandote demasiado, el navegador ya se encarga de por si en hacer cache de las imagenes, por que entonces usar mas recursos en tu servidor? hay varias contras de hacer esto en contenido dinamico.
solo por poner un ejemplo, supongamos que un buscador o un web crawler quiere indexar tu sitio y tomar las imagenes de un articulo/album, estaria indexando un articulo con una imagen que es un sprite, no creo se vea agradable que la indexe de esa forma no?

Answer 1

Si pero deberías aplicar cierta lógica con lo mas básico PHP y librería GD.

1 ) Carga todo el contenido de la carpeta en un arreglo donde estarán las imágenes.
2 ) Recorre el arreglo con la ruta de la imágenes para tratar el tamaño de dichas imágenes
3) teniendo cada ruta de las imágenes se crea el cuadro (x y) (ancho alto);
4) Para posicionar cada una de las imágenes se usa el tamaño (x & y) de cada una para posicionar.