Hafen 1.0: un tema, 38 looks, cero archivos de fuentes
Nuestro tema de bloques deja atrás la serie 0.x. La 1.0 convierte cinco variantes de color en un sistema de looks con 38 caras, pone la columna de lectura al servicio de la legibilidad y trae el endurecimiento de una migración real. Aquí te contamos qué incluye exactamente y qué decisiones hay detrás.
Un lanzamiento de tema con el número 1.0 es una promesa: esto está pensado hasta el final. Hafen lleva funcionando desde la versión 0.4 en webs en producción, desde una asociación hasta una plataforma de coaching, y cada una de esas instalaciones ha dejado huella en el tema. La 1.0 lo reúne todo en un estado que defendemos sin notas al pie. Lo más grande que trae es el sistema de looks.
De cinco variantes de color a 38 looks
Casi cualquier tema de bloques trae variantes de estilo, y casi siempre significan lo mismo: la misma página con otros colores. A nosotros nos parecía poco, porque el carácter de una web depende tanto de la letra, la forma y el espacio como de la paleta. Por eso los 38 looks de Hafen 1.0 juegan con cuatro ejes de diseño: color, tipografía (pareja de fuentes y escala de tamaños), forma (radios de esquina desde cantos vivos hasta forma de píldora) y densidad (espaciados, altura de línea, ancho de texto).
El resultado son ocho caracteres con cuatro variantes cada uno, más un verso suelto para la playa: sobrio y funcional para servicios, cálido y narrativo para lo personal, llamativo y rotundo para campañas, tranquilo y serio para despachos y consultoría, accesible al máximo, técnico, juguetón, editorial. Cambiar es un clic en el editor del sitio, los contenidos quedan intactos y, como desde la 1.0 los radios y las sombras viven como tokens en el theme.json, las tarjetas, los botones, las imágenes e incluso la paginación del blog acompañan cada look con total coherencia.
Cero archivos de fuentes, y en todos los looks
Aquí está quizá la decisión más inusual de la 1.0: las 38 variantes usan pilas de fuentes del sistema. Segoe UI en Windows, San Francisco en dispositivos Apple, Roboto en Android, emparejadas y ponderadas con cuidado, pero sin una sola descarga de fuentes. Solo el look estándar carga la Inter incluida, como un único archivo variable desde el propio servidor, sin conexión con Google Fonts ni con ningún otro servidor de terceros.
La ganancia es doble: no hay nada que cargar y nada salta durante la carga, y en materia de protección de datos sencillamente no existe ningún proveedor externo de fuentes en el que haya que pensar.
La comprobación de contraste con derecho a veto
Revisar a mano la legibilidad de 38 looks es una ilusión, así que revisa una máquina. Una herramienta aplica cada variante sobre el theme.json, resuelve todos los valores de color y mide unos 30 pares de primer plano y fondo que aparecen de verdad en el tema contra WCAG 2.1 AA. Si un par obligatorio suspende, la compilación de la versión se cancela. En su primerísima ejecución, la herramienta encontró de inmediato seis errores de contraste en material ya aprobado, corregidos con la 1.0. Exactamente para eso se construyen estos guardianes.
Una columna de lectura al servicio del texto
El cambio más visible para webs existentes: el texto corrido fluye ahora en una columna de 680 píxeles con letra base de 18 píxeles, unos 68 caracteres por línea frente a los cerca de 90 de antes. La regla clásica de la tipografía para líneas bien legibles lleva décadas en 45 a 75 caracteres, y prácticamente todas las plataformas de lectura aterrizan ahí. Las listas de entradas, los destacados y los bloques anchos siguen intactos en 1180 píxeles, y el texto gana además un ritmo vertical de verdad: los títulos se pegan a su párrafo siguiente en lugar de flotar con separación uniforme.
Y como el ancho de lectura también es cuestión de gustos, sigue siendo un ajuste: en el editor del sitio, en Estilos, Disposición, documentado en cuatro niveles recomendados de 620 a 860 píxeles. El estándar es una recomendación, no un dogma.
El endurecimiento que dejó una migración real
En la 1.0 ha entrado además todo lo que sacó a la luz la migración de una web en producción, crecida durante años, de un tema clásico a Hafen: una plantilla de página para contenidos antiguos de ancho fijo, un airbag de embeds contra los saltos de maquetación en móvil por vídeos incrustados antiguos, saltos de ancla que ya no desaparecen bajo la cabecera fija y un menú móvil que también luce los colores del tema en los looks oscuros. La serie completa de mediciones, con todas las cifras y sus límites, está en nuestro caso real de cambio de tema en WordPress.
Lo que viene ahora
La 1.1 ya está esbozada: recetas de página completas como patrones (inicio, sobre nosotros, contacto, precios listos para encajar), una variante de cabecera centrada y más accesibilidad camino de la revisión oficial accessibility-ready. Si tienes peticiones, eres bienvenido en el foro de soporte del tema.
Prueba Hafen 1.0
En el directorio oficial de temas de WordPress, gratis y bajo GPLv2. Instálalo, hojea los 38 looks en el editor del sitio, en Estilos, y encuentra el tuyo.
Preguntas frecuentes
¿Es Hafen realmente gratuito?
Sí, del todo. Hafen está publicado bajo GPLv2 en el directorio oficial de temas de WordPress, sin versión Pro y sin funciones bloqueadas para venderte nada. Los 38 looks, todos los patrones y todas las plantillas vienen incluidos en el paquete gratuito.
¿Qué es un look y cómo lo cambio?
Un look es una variante de estilo del tema: un paquete coordinado de colores, tipografía, radios de esquina y densidad. Lo cambias en el editor del sitio, en Diseño, Estilos, con un clic y sin que tus contenidos cambien lo más mínimo. Volver al look anterior funciona igual, sin perder nada.
¿La actualización a 1.0 cambia mi web actual?
Los contenidos no, y tu look elegido sigue elegido. Lo que cambia son detalles: la columna de lectura es algo más estrecha con 680 píxeles y la letra base algo mayor con 18 píxeles, los títulos se acercan a su párrafo siguiente y los formularios llegan con diseño propio. Si prefieres el ancho antiguo, lo recuperas con un solo valor en el editor del sitio, en Estilos, Disposición.
¿Por qué la columna de lectura es ahora más estrecha?
Porque las líneas largas se leen mal. Con el ancho antiguo cabían unos 90 caracteres por línea; la regla clásica de la tipografía habla de 45 a 75. Los nuevos 680 píxeles dan unos 68 caracteres. Las cuadrículas de revista y los bloques anchos se quedan en 1180 píxeles, y el ancho sigue siendo ajustable, documentado en cuatro niveles de 620 a 860 píxeles.
