Tecnología

Tipografías y el balance entre rendimiento y diseño web

·

Si lleváis tiempo leyéndome seguramente sepáis ya que una de mis pequeñas pasiones es el diseño y el rendimiento web. Tuve que ahondar en estos temas profesionalmente para una etapa profesional anterior y me quedé con la copla. Tanto que ahora tengo una opinión muy fuerte sobre lo que creo que un sitio web debe y no debe dar en este tipo de materias.

Esa problemática la he trasladado también a Incognitosis, claro. El rediseño que puse en marcha hace ya dos años y medio sigue manteniendo su validez, pero eso no implica que no haya apartados que mejorar.

Uno de ellos es difícilmente atacable. Resulta que cuando me puse a probar rediseños tuve claro que quería una tipografía muy especial. El problema es que las tipografías «seguras» (safe web fonts) que se usan por defecto en la mayoría de navegadores son efectivas pero impersonales, y yo buscaba un toquecito de personalidad.

Eso me acabó decidiendo a usar Linux Libertine, una tipografía con guiño incluido (para eso soy linuxero de corazón, aunque use Windows todo el día) que me pareció perfecta para ese rediseño. ¿Qué problema hay? Pues que como buena webfont, su uso condena (un poco el rendimiento).

Eso se ve rápidamente cuando paso alguna prueba de rendimiento rápida como WebPageTest en la que la cascada de elementos y recursos que se van cargando deja claro que cualquier webfont impone una carga inadmisible si buscas rendimientos óptimos. Da igual que yo use Redis como sistema de caché y que la carga de la página (menos de 1MB normalmente) sea asumible y se realice en un par de segundos. El caso es que lo de las tipografías web se nota. Pesa. Durante todo este tiempo he preferido obviar el problema y sacrificar tiempo de carga y tamaño de página para lograr un Incognitosis que en mi opinión está bastante logrado. Esta mañana, no obstante, un artículo sobre rendimiento web me ha recordado que debería volver a repasar el asunto y quizás buscar alternativas.

Lo ideal, claro, es tirar de tipografías seguras y estándar. En sitios como CSS Font Stack tienen una buena relación de lo seguras que son esas fuentes (con una estimación de lo mucho que están soportadas en Windows y macOS), y de las que vi disponibles en el catálogo de serifas solo me parecía adecuada Garamond, con un 86,47% de soporte en Windows y, eso sí, un pobre 49,91% en macOS, bastante bajito. Podría ir a una Times New Roman mucho más segura, como ocurre con Georgia o Palatino, pero ninguna de ellas me acaba de convencer en las pruebas preliminares. De hecho he puesto un rato Garamond y si habéis accedido a Incognitosis de nuevas hoy habréis visto que la cosa cambiaba bastante:

Si pincháis en la imagen podréis verla a tamaño completo. A la izquierda, Garamond. A la derecha Linux Libertine.

La verdad es que de primeras choca, porque con una Garamond 26px/36px el texto  está casi como medio borrado frente a una mucho más consistente Linux Libertine 22px/32px. No se lee mal, y de hecho la lectura es como más «ligera», por decirlo de algún modo, pero no sé si me convence. Y aquí, claro, es donde llega la pregunta. Creo que voy a dejar Linux Libertine, pero ¿cómo veis el cambio?

Actualización: los experimentos, mejor con gaseosa. Volvemos a Linux Libertine (puede que tarde un poco en refrescar aspecto por caché). Quizás más adelante vuelva a probar cosas de este estilo con algo más de calma.


Incognichollos

Esta es una selección con las mejores ofertas tecnológicas actualizadas casi diariamente, como expliqué aquí. Aunque estés en un post «antiguo» las ofertas son de última hora, los Incognichollos los actualizo aparte. También puedes seguir los Incognichollos en Twitter o en el nuevo canal de Telegram 🙂 . ¡Aprovecha, que no suelen durar mucho tiempo!

  • LG 65UM7610PLB: una smart TV de 65? con resolución 4K UHD, soporte HDR, palnel IPS, sistema webOS 4.5, asistente de Google y Alexa, sonido DTS Virtual:X. Está a 642,45 euros en Amazon (baja de 999).
  • Huawei P40 Lite: el nuevo modelo de 6,4? con un Kirin 810, 6 GB de RAM, 128 GB de capacidad, cámara quad (48+8+2+2), 4.200 mAh y con Android pero sin apps o servicios de Google, aunque hay formas de saltarse ese tema. Está a 202,99 euros en AliExpress Plaza con el código ALIVERSARIO27. En Amazon está a 299 euros aunque te incluye unos Freebuds 3.
  • Realme X2 Pro: 6,5 pulgadas 90 Hz, 12 GB de RAM, 256 GB capacidad, Snapdragon 855+, cámara cuádruple (64+13+8+2 MP), 4.000 mAh, lector bajo pantalla, está a 361 euros en AliExpress Plaza con el código ALIVERSARIO37. En Amazon está a 439 euros.
  • Xiaomi Redmi Note 8: 6,53?, Snapdragon 665, 4 GB de RAM, 64 GB de capacidad, cámara cuádruple (48+8+2+2) y 4.000 mAh de batería. Estupendo por 135,20 euros en AliExpress Plaza con el código 328TT11ANIVERSARIO. En Amazon está a 155,42 euros.
  • Smart TV Stream System 32?: una Smart TV modesta de 32 pulgadas HD Ready (1.366×768) que puede hacer el apaño. Tiene soporte de Netflix, HBO o YouTube, puerto HDMI, USB y WiFi. Está a 120 euros en AliExpress Plaza con el código ALIVERSARIO17.
  • Xiaomi Amazfit Pace: un reloj deportivo de Xiaomi que tiene GPS, frecuencia cardíaca, notificaciones, 4 GB de capacidad para música, batería de hasta 5 días en uso normal, está a 58,15 euros en AliExpress Plaza con el código ANS7.
  • Xiaomi Mi TV Box S: el set top box de Xiaomi con soporte de streaming en 4K, procesador Amlogic S905L (S905X), 2 GB de RAM, 8 GB eMMC, WiFi ac, BT 4.2, HDMI 2.0, mini TOSLINK, control remoto. Está a 49 euros en Amazon.
  • Apple iPhone 11 64 GB: 6,1 pulgadas de pantalla Retina, Apple A13 Bionic, Face ID, cámara dual de 12 +12 Mpíxeles, carga inalámbrica, resistencia IP68, carga rápida, Dolby Atmos, está a 749 euros en AliExpress Plaza con el código ALIVERSARIO60 (envío desde España). En Amazon está a 789 euros.
  • Amazon Kindle: el lector de libros electrónicos de Amazon ya cuenta en su versión básica con luz frontal integrada, así que puedes leer en la cama sin lámparas. 6 pulgadas 167 ppp, 4 GB de capacidad, está a 64,99 euros en Amazon (baja de 89,99). El Paperwhite resistente al agua está a 99,99 euros (baja de 129,99).
  • Monument Valley 2: un juego visualmente precioso con una mecánica de puzzles espectacular. Está gratis para Android en Google Play y también gratis para iOS en la App Store.
  • Apple Watch Series 5: el reloj inteligente de Apple baja un poco de precio. Pantalla siempre activa, 44 mm, tiene GPS pero no eSIM, correa de slicona, chip Apple S5, sensor de frecuencia cardáica, digital crown. Está a 315,43 euros en AliExpress con el código ALIVERSARIO37.
  • TD Systems K50DLJ10US: una Smart TV de 50 pulgadas con resolución 4K UHD, soporte HDR10, sonido Dolby Digital Plus, Android TV, está a 247,05 euros en AliExpress con el código ALIVERSARIO37. En Amazon 379 euros.
  • XIaomi Mi Band 4: la versión global enviada desde España de esta pulsera cuantificadora con pantalla AMOLED de 0,95?, monitorización de sueño, actividad física, GPS, todo por 22 euros en AliExpress. En Amazon está a 29,78 euros.
  • Xiaomi Redmi Note 9S: preventa (disponible el 7 de abril), 6,67?, Snapdragon 720G, 6 GB de RAM, 128 GB de capacidad, cámara quad (48+8+5+2 MP), 5.020 mAh de batería (uauh), está a 229 euros en AliExpress Plaza con el código NOTE9S40S.
  • TCL 50DP602: una Smart TV de 50? con resolución 4K UHD, soporte HDR, sonido Dolby Digital Plus, está a 326,22 euros en Amazon. Brutal.
  • Oppo Reno 2: 6,55?, Snapdragon 730G, 8 GB de RAM, 256 GB de capacidad, cámara cuádruple (48+13+8+2), lector de huella bajo pantalla, 4.000 mAh, cámara frontal «aleta tiburón». Muy curioso , está a 459 euros en Amazon (baja de 499).
  • Huawei P30 Lite: 6,15?, Kirin 710, 4 GB de RAM, 128 GB de capacidad, cámara triple (48+8+2), 3340 mAh, lector de huella trasero, NFC, minijack. Está a 172 euros en AliExpress Plaza (envío desde España) con el código ALIVERSARIO27.
  • Adaptador Bluetooth Philips AEA2000: un dispositivo que transforma en Bluetooth tus altavoces y equipo de sonido de siempre . Se conecta por minijack y ya lo puedes usar enviando música desde el móvil. Está a 19,97 euros en Amazon (baja de 34,99).
  • Mochila Under Armour Scrimmage 2.0: una mochila unisex para adulto con tejido que repele el agua y transpira, correas acolchadas para los hombros, funda para ordenador de 15,6?, bolsillo de malla para botella. Está a 19,98 euros en Amazon (baja de 40).
  • Micrófono Nacon PCST-200MIC: un estupendo micrófono de streaming profesional con conexión USB, patrón cardioide, incluye trípode ajustable, salida para monitor/auriculares con conector de 3,5 mm. Está a 44,95 euros en Amazon (baja de 70).
  • LG 49UM7100ALEXA: una Smart TV de 49? 4K, soporte HDR10 Pro y HLG, altavoces de 20 W Dolby Digital, webOS, AI ThinQ, Bluetooth, WiFi, Miracast, y soporte integrado de Alexa. Está a 364 euros en Amazon.
  • OnePlus 7T: 6,55?, soporte 90 Hz, Snapdragon 855+, 8 GB de RAM, 128 GB capacidad, cámara triple (48+12+16 MP), 3.800 mAh, lector bajo pantalla, excepcional por 453 euros en Banggood con el código BG7T128320. En Amazon cuesta 608 euros.
  • ASUS ZenBook 14: un portátil de 14? FullHD con un Ryzen 7 3700U, 16 GB de RAM (muy bien), 512 GB de SSD, una Radeon RX Vega 10, sistema operativo Endless OS, teclado español, lector de huella. Está a 649 euros en Amazon.
  • WD Black P10 5TB: una unidad de 5 TB de capacidad perfecta para consola o PC, capacidad estupenda, conexión USB 3.0, tasas de transferencia notables, está a 119,99 euros en Amazon (baja de 140,49).
  • Dos Sonos One (2ª Gen): un pack de dos altavoces Sonos One con control táctil y calidad excepcional de sonido, soporta Alexa y AirPlay, al agregar dos a la cesta y tramitar se aplica el descuento, están a 295 euros en Amazon. (bajan de 380).
  • Seagate Expansion 8 TB: otra unidad aún con mayor capacidad, 8 TB (uauh!) con interfaz USB 3.0 (compatible USB 2.0), 3,5 pulgadas y un precio muy bueno (no tanto como el anterior), 139,99 euros en Amazon.
  • HiSense H50AEE6400: una Smart TV de 50? con resolución 4K UHD, soporte HDR, plataforma VIDAA U, modo deporte, está a 349,99 euros en Amazon.
  • ‘World War Z’, ‘Figment’ y ‘Tormentor x Punisher’: Epic Games vuelve a regalar juegos. Tres más con muy buenas críticas, que os podéis descargar desde ya mismo. A por ellos!
  • Altavoces Edifier Studio R1280T: equipo de dos altavoces para sonido estéreo, hasta 42 W de potencia, conectores RCA y minikack, sensibilidad de 85 dB, mando a distancia. Son estupendos, de hecho los tengo en casa. Están a 73,99 euros en Amazon (bajan de 99,99).
  • Apple iPhone 8 256 GB (rojo, reacondicionado): atentos a este modelo, que según Amazon está como nuevo y «funciona como tal», nada menos que 256 GB de capacidad, 4,7 pulgadas, cámara de 12 Mpíxeles, TouchID, resistencia al agua IP67. Está a 399 euros en Amazon.
  • Sharp LC-55UI8762ES: una Smart TV de 55 pulgadas con resolución 4K UHD, soporte HDR+, Smart Aquos Net+, 3 x HDMI, 2 x USB, altavoces Harman Kardon, está a 399,99 euros en Amazon (baja de 799,99).
  • Philips 32PFS5823: una Smart TV modesta de 32 pulgadas y resolución Full HD para quienes no necesitan lo más de lo más. Tiene tecnología Pixel Plus HD, Dolby Audio, y puertos HDMI y USB. Está a 209,99 euros en Amazon (baja de 269).
  • Lenovo IdeaPad C340-14API: un portátil convertible en tablet muy majo de 14? Full HD con un Ryzen 5 3500U, 8 GB de RAM, 256 GB de SSD, Windows 10 y teclado en español por 599,99 euros en Amazon.
  • ASUS ZenBook UM431DA-AM003: un portátil de 14? Full HD con un Ryzen 5 3500U, 8 GB de RAM, 512 GB de SSD, sin sistema operativo, teclado en español, está a 549 euros en Amazon.
  • Humble Bundle Just Drive: un pack de juegos de conducción para quienes quieran disfrutar al volante «virtual». Asetto Corsa, Dirt 4 y Project Cars 2 entre otros por 12 euros en Humble Bundle. Brutal
  • Humble Bundle Stardock: esta empresa lleva años haciendo programas fantásticos de personalización y productividad de Windows 10. Por 13,50 euros tendrás el pack completo, incluidos Windows Blinds, Fences (escritorios virtuales) o Multiplicity (KVM software).
  • ASUS ROG Swift PG248Q: un monitor gaming de 24? FullHD, hasta 180 Hz, contraste 1000:1, 1 ms de tiempo de respuesta, están a 232,24 euros en Amazon reacondicionados (casi como nuevos, precio normal 425 euros).
  • Garmin Fenix 5: un reloj cuantificador y deportivo espectacular con GPS, medidor de frecuencia cardíaca, caja de 47 mm, un montón de indicadores, muy usado por triatletas, está a 382 euros en Amazon (baja de 499,99).
  • Acer Aspire 3: un portátil muy modesto pero curioso, 15,6? FullHD, Core i3-6006U, 4 GB de RAM, 128 GB de SSD, Linux preinstalado, teclado español, está a 239 euros en Amazon, buena opción como portátil de batalla o para niños.
  • Kllisre X79: curiosísimo esta combinación de placa base + CPU 8 GB RAM. Integra un Xeon E5 2620 y dos módulos DDR3 de 4 GB. Todo un poco antiguo pero curioso para montar un equipito de salón o trabajo majo. Está a 66,77 euros en AliExpress.
  • Honor Magic Watch 2: el reloj inteligente de Honor, la submarca de Huawei, con caja de 42 mm, Bluetooth 5.0, resistencia al agua (natación), ritmo cardiaco, monitor de sueño, diversas actividades, notificaciones, hasta 14 días de autonomía, está a 119 euros en AliExpress. El de 46 mm está a 130 euros en AliExpress.
  • AMD Ryzen 2600X: si estáis actualizando vuestro PC o vais a montaros uno nuevo atentos a este micro de 8 núcleos y 16 hilos de ejecución, preparado para overclocking, 95W de TDP, hasta 4,25 GHz. Está a 129 euros en Amazon (baja de 215).
  • Xiaomi Mi 9T: 6,39? AMOLED, Snapdragon 730, 6 GB de RAM, 128 GB de capacidad, cámara triple (48+8+13), cámara frontal retráctil (20 MP), lector de huella bajo pantalla, 4000 mAh. La versión de 64 GB está a 259,99 euros en Amazon (baja de 329).
  • Aspiradora Philips Speedpro: formato escoba, se puede usar como aspiradora vertical o aspiradora de mano, en ambos casos sin cable. Cepillo con succión de 180º, tecnología PowerCyclone 7, hasta 800 l/min de velocidad del aire, está a 149,99 euros en Amazon (baja de 289).
  • Amazon Prime Estudiantes: la suscripción a Amazon Prime está a solo 18 euros al año (60 para usuarios normales) con un periodo gratuito de 90 días de prueba. Ya sabéis, con ella tenéis entrega rápida gratis, prime video y prime music.
  • Xiaomi Redmi Note 8T: 6,3?, Snapdragon 665, 3 GB de RAM, 32 GB de capacidad, cámara cuádruple (48+8+2+2), 4.000 mAh, lector trasero, buena opción recién salida del horno. Está a 179 euros en Amazon.
  • Huawei P40 Lite + Freebuds 3: 6,4?, Kirin 810, 6 GB de RAM, 128 GB de capacidad, cámara cuádruple de 48+8+2+2 MP, 4.200 mAh de batería, regalo de los auriculares valorados en 179 euros. Está a 299 euros en Amazon, espectacular. Una sola pega: lleva Android 10, pero sin servicios y apps de Google.
  • HiSense H65A6500: una Smart TV enorme de 65 pulgadas con resolución 4K UHD, soporte HDR, con la plataforma VIDAA U, modo deportes, WiFi, Precision Color, está a 579,99 euros en Amazon.
  • Intel NUC: un miniPC potente y curiosón. Con un Core i5-7260U, 8 GB de RAM, 240 GB de SSD2, Windows 10, está a 525 euros en Amazon. Buen equipo de trabajo o incluso de salón.
  • Acer Aspire 3 A315-54K: un portátil de 15,6? Full HD con un Core i5-10210U, 8 GB de RAM, 512 GB de SSD, sin sistema operativo, con salida HDMI, RJ45, USB 3.1, lector de tarjetas, está a 499 euros en PcComponentes (en Amazon 708 euros).
  • Disco duro externo Maxtor 4 TB: una unidad ya reconocida, compacta, conexión USB 3.0/3.1 Gen 1, 4 TB de capacidad, está a 99,90 euros en Amazon.
  • Smartwatch Huawei GT Fashion: un reloj inteligente con monitor de sueño, ritmo cardíaco, sistema LiteOS, GPS, Bluetooth, y pantalla estupenda. Está a 99 euros en Amazon (en PcComp 147).
  • ASUS TUF Gaming FX505DV: un portátil gaming con pantalla de 15,6? Full HD a 120 Hz, Ryzen 7 3750H, 16 GB de RAM, 512 GB SSD, GeForce RTX 2060 (uauh), sin SO, teclado retroiluminado en español. En eBay está a 999 euros, rebaja brutal.

¿Quieres recibir un correo de aviso cuando publique nuevas entradas?

Standard

15 comentarios en “Tipografías y el balance entre rendimiento y diseño web

  1. Korso dice:

    La tipografía de tu blog -y el diseño en general- es de lo más agradable de leer que se puede encontrar (con permiso de Medium, que otra cosa no, pero es muy agradable de leer). Eso sí, estoy en Linux y estoy leyendo el blog en Arial. Javi, por favor xD

    • Sí, Lato efectivamente se me ha quedado porque la uso en los blockquotes y en la cajita del buscador. Quería probar quitando Linux Libertine, pero no parece que vaya muy bien la cosa :/

    • Hola Moronguer

      Claro que acepto sugerencias 😉 Los textos justificados funcionan para según qué cosas, pero creo que no son buenos para una narrativa como la de un blog en la que justificar párrafos invita a una lectura monótona. Que una línea acabe antes o después hace que el recorrido visual sea más entretenido en mi opinión, y ayuda a que no te pierdas si el texto es largo (o denso). Lo consideré en su momento y lo descarté.

      Gracias de todos modos, y no dudes en apuntar cualquier otra cosa que se te ocurra Moronguer!

Comentarios cerrados