Contenidos de Periódicos Digitales frente a Rendimiento Web

29/jul/15 - 14:02 Actualizado: 11/ago/22 - 12:59

Cantidad VS Calidad: El eterno dilema!

No es una cuestión de elegir entre uno u otro, si no de una reevaluación constante. Se trata de encontrar el equilibrio entre los dos. De hecho tienen que coexistir y son dependientes el uno del otro, cada vez más, en el terreno del periodismo digital y con los nuevos canales de distribución de la información como las RRSS.

Sin embargo hoy vamos a hablar de este asunto en una perspectiva particular:

Contenido VS rendimiento web

El rendimiento de nuestra web es algo que siempre preocupa y sobre todo el tiempo de carga.

3 segundos de tiempo de carga son suficientes para que los usuarios abandonen el sitios web. (Cit.)

Sin embargo el rendimiento también se relaciona con la experiencia del usuario. Es más, siempre deberíamos contestar a estas preguntas antes de lanzar un periódico digital:

¿Todas las URL redirigen a las correctas páginas de destino?
¿Es el contenido de la página fácil de leer?
¿Son los anuncios un obstáculo para la navegación?

¿Qué debo hacer entonces para asegurarme de que mi contenido no ralentiza mi sitio web?

Imágenes:

Tamaño: Pocas imágenes en web tienen un tamaño mayor de 600 píxeles y, aún cuando son imágenes grandes, la mayoría de las veces 300 píxeles son más que suficiente para obtener una calidad y tamaño adecuados. A menudo las imágenes que necesitamos asociar a la información no tendrían porque medir más de 200 píxeles. Y en caso de que se esté preguntando que aspecto tiene una imagen 200x200 píxeles, aquí se puede ver:

Peso: Debemos conseguir imágenes que no pesen más de 100kb
- ¿Cómo optimizar las imágenes?:
  - Si se usa Photoshop hay una función sencilla que se llama "Guardar para Web". Con esto se optimizarán las imágenes para la web sin perder calidad. Si se pretende aplicar esta mejora a muchas fotos se puede realizar una optimización por lotes a través "Fichero > Automatizar > Lotes", luego "Optimización de imagen" y " Guardar para Web".
  - Si se usa Gimp se puede utilizar la función "Image> flatten image" y luego guardar como PNG o JPEG en función de la imagen, para las fotos con muchos colores se aconseja JPEG, si no PNG.
  - Si no está usando ninguno de los anteriores tal vez es aconsejable probar: http://www.imgopt.com/, jpegtran (JPEG), optipng (PNG) o pngquant (PNG), http://www.imageoptimizer.net/Pages/Home.aspx o cualquier otra herramienta que encuentre mediante la búsqueda de "herramientas de optimización de imagen".

Fuentes:

Elijir 1 fuente o máximo de 2 estableciendo reglas para usarlas. Para saber más acerca del tamaño para cabecera, entradilla , cuerpo del texto, notas, etc. consultar nuestra Guía de estilo: Opennemas - Style_Guidelines.pdf
No usar las "Serif", son buenas para el papel, pero no son bonitas en el entorno web.
No tener miedo de usar WebFonts y seguir los consejos en el artículo de Google https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/webfont-optimization?hl=es

Servicios Externos :

Los Widgets son maravillosos. Utilizamos widgets para todo. Nos encantan los widgets. Sin embargo los widgets frenan el rendimiento de nuestras páginas. Estos hacen una llamada externa, por lo que es posible que nuestros periódicos tarden más en cargar. Por lo tanto siempre deberíamos preguntarnos
- ¿Cuánto se ralentiza mi página web?
- ¿Nuestros usuarios necesitan Widgets en esa página?

Publicidad:

iFrame VS Javascripts:
- iFrame significa "marco flotante" (inline frame) y se trata de una función que se utiliza para incluir objetos externos (imágenes, vídeos, páginas html, etc) en un código de página.
- Etiquetas Javascript son scripts de código que llaman a otros scripts de código y le dicen al navegador de leerlo.
- Un iframe sólo se puede renderizar en un lugar, mientras que javascript no tiene esta regla.
- Los Javascripts se cargan con el contenido de la página y podría causar problemas de carga haciendo que los usuarios abandonen la página.
- El iFrame no es compatible con todos los tipos de navegador.
- Los usuarios pueden desactivar Javascripts en sus dispositivos.
- Con iFrame el contenido se carga antes del anuncio y esto es importante para un periódico.
- Con Javascript se puede servir varios tipos de anuncio, que no son disponibles con iFrame.
Conclusión: merece la pena probar las 2 soluciones, mirar a los resultados, analizando el tiempo de carga de las páginas, para así decidir cuál es el más adecuado para su sitio. En marzo de 2014 el New York Times eligió iFrame y optó por trabajar en sus desafíos para superarlos.