viernes, 28 de junio de 2013
miércoles, 26 de junio de 2013
Imágenes adaptaptadas al dispositivo en diseños ‘responsive’
Llevo un tiempo dándole vueltas a las diferentes soluciones a la hora de servir imágenes en un diseño responsive. No me refiero simplemente a hacer que las imágenes sean fluídas y que se adapten al dispositivo, sino que hablo de que no sea necesario descargar una imagen de 1280px en un dispositivo que solo tiene 480px de ancho.

Imaginad una web que tenga muchas imágenes de alta resolución (hablando de páginas web), o si no sois capaces echad simplemente un vistazo a esta web. Si nos estamos adaptando a los dispositivos móviles, lo que no podemos es hacerle descargar al usuario más de 5 megas en fotos y luego escalarlas a la mitad, mucho menos si tenemos en cuenta el ancho de banda de las tarifas móviles españolas.
Por eso creo, y no soy el único, que habría que servir diferentes tamaños (y por lo tanto diferentes pesos) de imágenes en función del dispositivo que esté accediendo a tu web. La mejor solución que he encontrado es Adaptive Images, o cualquier sucedáneo del mismo. Pero el problema es que aunque es lo mejor que he visto no me convence, tiene ciertas pegas y no me gustaría que fuese peor el remedio que la enfermedad.
Las pegas que le veo a este sistema son:
- Todas las imágenes servidas de esta manera dejarán de ser ‘contenido estático’ ya que será un archivo PHP el encargado de decidir la imagen a servir en base a la resolución del dispositivo.
- Las imágenes afectadas no se podrán servir desde un dominio libre de cookies ya que el sistema se basa en ellas para funcionar.
Aún así, en webs que no tienen un excesivo tráfico no creo que conlleve un gran problema y creo que utilizar Adaptive Images mejorará la experiencia del usuario en dispositivos móviles sin afectar negativamente al resto de usuararios, pero me gustaría que me dijerais si vosotros os habéis planteado esto y si habéis encontrado una manera mejor de hacerlo.
Tomado de: http://www.berriart.com
lunes, 24 de junio de 2013
Lista de las resoluciones de pantalla de los dispositivos más populares
Cada dispositivo tiene su resolución de pantalla específica, por ejemplo los iPhone, los iPads, las distintas marcas de notebooks y más. Screensiz.es es un sitio muy útil que nos lista las resoluciones de pantalla de los dispositivos más populares del mercado.
Aqui les va el enlace: http://screensiz.es/
Aqui les va el enlace: http://screensiz.es/
sábado, 22 de junio de 2013
50 blogs en español sobre diseño y desarrollo web
Los blogs que menciono en esta lista están organizados de forma aleatoria.
1. Maestros del Web
2. Creadictos
3. Berriart
4. Gran Impetu
5. Casidiablo.net
6. Línea de Código
7. LaWebera
8. Pixelar.me
9. Miquel Camps Orteza
10. Sentido Web
11. Unijimpe
12. aNieto2K
13. Metabix
14. ARTEgami
15. Concepto Pixel
16. Frogx.three
17. Puente Cromático
18. Portafolio Creativo
19. Blog and Web
20. DiarioTHC
21. Área Photoshop
22. Diego Mattei Blog
23. Craftyman
24. Creativos Online
25. ZoneArtCSS
26. Pixelco
27. Kabytes
28. Fuel Your Creativity Español
29. Blog.EstudiosInnova
30. Pixelovers
31. Cristalab
32. Web.Ontuts
33. InfectedFX
34. CSSBlog ES
35. Intenta
36. Creativity Storm
37. Webmaster Libre
38. Nosolocodigo
39. Xyberneticos
40. Kernel Web
41. DiseñoWebZ
42. Blog de la Web
43. Oh! Gráfico
44. Creative Hacks
45. Cofre Gráfico
46. Chica Blogger
47. SOSFactory Blog
48. Puerto Pixel
49. Criterion
50. dzign.us
Si deseas encontrar blogs sobre diseño y desarrollo web en inglés, aquí te dejo varios artículos donde podrás encontrar los más representativos: