¿Son las imágenes punteadas una nueva tendencia en diseño web?


8

Últimamente he notado que algunos de los sitios web que visito regularmente están adoptando una nueva y extraña tendencia en diseño web: "las imágenes punteadas". No estoy seguro de cómo llamarlo. Parece que un patrón de puntos regularmente espaciados se colocó deliberadamente en la parte superior de todas las miniaturas, o a veces es un patrón de cuadrícula claro en lugar de puntos, pero el aspecto final es similar. Parece un poco una imagen borrosa.

Personalmente, considero que el efecto es terrible y al principio pensé que el procesamiento de la imagen de mi navegador tenía la culpa, pero probé 3 navegadores diferentes y aún puedo ver el patrón. Parece que fue destinado.

En realidad, uno de los sitios web que solía hacerlo volvía a las fotos normales. Era el sitio web de un periódico y sospecho que recibieron un montón de llamadas preguntando por qué sus fotos estaban en mal estado y revirtieron la decisión después de unos meses.

¿Alguien ha escuchado o visto esto antes?

Enlace de ejemplo: http://www.linkedin.com/today/se/editorspicks


1
¿Qué tal algunos ejemplos?
Dan Hanly

Lo siento, quería publicar una, acabo de actualizar mi pregunta.
md1337

3
No, no es una nueva tendencia.
DA01

1
Vale la pena señalar que puede causar efectos de muaré que distraen cuando se escala la imagen, por ejemplo, en el navegador de un teléfono inteligente.
e100

1
No lo veo ...
Alex

Respuestas:


13

En el pasado, he visto este efecto usado para mejorar una característica de la imagen. El enlace que publicaste parece estar haciéndolo innecesariamente.

Ver http://demo.grandpixels.com/?theme=linguini

El texto en las imágenes del control deslizante principal realmente aparece porque la superposición de estilo de cuadrícula / punto oscurece y difumina la imagen ligeramente, haciendo que el texto blanco parezca aún más blanco y claro.

Las imágenes en mi enlace se ven geniales, y la imagen superpuesta tiene un propósito bastante claro, y es mejorar el mensaje del texto; algo que hace bastante bien.

ingrese la descripción de la imagen aquí

Sin la superposición de cuadrícula, el texto blanco se mezclaría con el queso detrás.
Necesitaban un estilo que funcione para cualquier imagen detrás, clara u oscura, y para que el texto no pierda su impacto cuando se muestra sobre cualquier imagen de fondo.

Su ejemplo de linkedin muestra cómo no se debe usar.
La mayoría de las veces, el diseño gráfico es una ciencia más que un arte, y los efectos como este no deberían usarse porque "se ven bien", deberían usarse porque se ha definido un propósito claro para su uso, y su uso se justifica en el contexto de la página.


Gran consejo sobre cómo la superposición de cuadrícula ayuda a que el texto se destaque de la imagen.
jhocking

Puedo ver el uso en casos limitados como en su ejemplo. De lo contrario, es solo un truco. Me dio mucha curiosidad cuando comencé a ver esto en más y más sitios web últimamente y creo que hay algún tipo de tendencia en aumento. Con suerte, morirá igual de rápido. Como nota al margen amigable, encuentro que su implementación técnica es subóptima, es bastante lenta porque usa un fondo repetido de 2x2 y pone mucha presión en el navegador para renderizar. Aumentaría considerablemente el tamaño de la superposición y notará una gran mejora en la respuesta de desplazamiento de la página.
md1337

Salud. Sin embargo, no es mío, lo acabo de encontrar en la web;)
Dan Hanly

5

La superposición de patrones es una herramienta de diseño útil y puede servir para algunos propósitos. Como se mencionó anteriormente, puede ayudar a separar visualmente los elementos gráficos en la página, pero también ayuda a ocultar imperfecciones / artefactos de compresión jpeg en imágenes de baja resolución que se están sobremuestreando para llenar una pantalla HD (1920 x 1080).

A veces utilizaré una superposición de patrones para unificar la apariencia de una colección de imágenes. Si tengo 6 imágenes que se toman muy bien y 3 imágenes que no son tan buenas, poner una superposición de patrones en ellas ayuda a igualarlas y hacer que la transición entre las imágenes buenas y malas sea menos dramática.

Aquí hay un ejemplo en el que creo que la superposición de patrones funciona bastante bien, aunque apuesto a que le será difícil tratar de convencer al fotógrafo original de que es una mejora. :) http://goo.gl/d0OYOO


2

El efecto en realidad proviene de los primeros días de la optimización web.

El efecto punteado se aplicaría a las imágenes que se comprimieron tanto que comenzaron a producir artefactos. La "cuadrícula de puntos" ocultaría estos artefactos y haría que la imagen pareciera menos comprimida.

Luego se propaga como un efecto normal y, como dice Daniel, puede hacer o deshacer una imagen. Si se usa correctamente (como con la mayoría de los otros efectos), puede obtener excelentes resultados.


1

Creo que en el caso de su ejemplo, se hizo para oscurecer ligeramente las imágenes.

También creo que es un retroceso a los estilos anteriores.


1

La razón es enmascarar la baja resolución de la imagen. El uso de una imagen de baja resolución puede mejorar los tiempos de carga del sitio web y hacer feliz a Google. Entonces, desde una perspectiva SEO, es una tendencia.


0

No puedo decir si es una tendencia o no. Pero si lo es , y mi interpretación coincide con el efecto ideado (refiriéndose al ejemplo de Pick del Editor de Linkedin), creo que es un concepto interesante que podría tener algo de peso, no solo pelusa.

Posiblemente, esto podría ser un poco exagerado, pero para mí, parece que lo que están tratando de lograr es indicar que esta imagen conduce a contenido / artículos que residen en otro lugar (es decir, material externo; no dentro del sitio actual). ) Casi como si estuvieras 'mirando' a través de una pequeña ventana, hacia otro lugar, agregando profundidad (otra capa) que, desde el punto de vista de la usabilidad, podría demostrar potencial en ciertos contextos.

Admito que no estoy seguro de la ejecución en el ejemplo que diste; el efecto no funciona de manera óptima en la mitad de las imágenes (el problema principal es que este concepto no funciona igual de bien en las imágenes que no son fotos).

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.