La presencia de una consultora industrial, reconstruida desde cero

El sitio anterior era una plantilla de WordPress con un maquetador encima. Los titulares iban en la tipografía por defecto, el título de la pestaña escribía mal el nombre de la empresa, y bajo un apartado llamado Our Customer Stories no había absolutamente nada. Ningún proyecto, ni una línea. La navegación llevaba una entrada Projects y, al pulsarla, uno acababa en el formulario de contacto.

Todo ello ilustrado con fotografía comprada que habría servido para cualquier empresa: gente ante portátiles, reuniones en mesas claras. Para una consultora que dimensiona hornos rotatorios, redacta el pliego y permanece en obra hasta que la línea funciona, eso no solo es genérico: contradice el objeto.

Y las cifras que debían sostener el conjunto eran redondas: 12+ años, 50+ clientes, 200+ proyectos, 14 países. En una página de referencias, las cifras redondas son la forma más débil de prueba, porque nada en ellas se puede comprobar y por eso no cuestan nada de escribir.

Realizado para Colleagues Consultants Private Limited.

El cliente lleva su propia lista de referencias desde el año de su fundación: cada encargo, con cliente, lugar, disciplina y ejercicio. Existía como archivo de presentación y nunca se había publicado. La pregunta dejó así de ser cómo hacer que el sitio sonara creíble y pasó a ser, mucho más modestamente, cómo llevar ese archivo a una web sin volver a teclearlo.

Un script lee el archivo directamente, con un pequeño lector de archivos comprimidos propio escrito sobre la biblioteca estándar y sin paquete de terceros, y escribe con él la colección desde la que se construye el sitio. La relación de clientes y la de países se calculan después desde esa colección en lugar de mantenerse al lado. Una nueva versión de la lista de referencias es así una orden y no un proyecto editorial.

Lo que figura después en el sitio está contado: 343 trabajos, 55 clientes nombrados, 16 países, 18 ejercicios ininterrumpidos. Las cifras redondas del sitio anterior se han retirado sin sustituirlas.

Había para ello un motivo que va más allá del orden. Al cotejarlas se vio que parte de la antigua relación de países no era sostenible. Las entradas erróneas habían sobrevivido a cinco rondas de revisión, porque una lista de aspecto plausible no delata nada a quien la corrige. Precisamente por eso clientes y países hoy se derivan y ya no se escriben: un dato calculado desde el registro no puede apartarse de él.

La fotografía de archivo no se sustituyó por fotografía de archivo mejor, sino por diez esquemas dibujados a mano: la línea de cemento desde la cantera hasta la expedición, el flujo de graneles, la ruta del acero, el ciclo de vida del proyecto y cuatro láminas isométricas por sector. Es el lenguaje visual de un plano técnico y no el de un banco de imágenes, y cada uno de ellos dice algo sobre el objeto.

Las reglas que los rigen se mantienen estrechas para que el conjunto se lea como una sola mano: exactamente dos grosores de línea, rótulos en la capa monoespaciada con sus líneas de guía, y rojo únicamente donde significa algo, es decir en flechas de flujo, zonas calientes y nodos activos. El color no se pinta en el dibujo, procede de variables, y por eso el mismo archivo es correcto en el esquema claro y en el oscuro sin existir dos veces.

Los rótulos de un dibujo son el punto por el que un conjunto así se deshace: uno se desliza sobre un borde, dos se solapan, y nadie lo advierte, porque nadie mira los diez archivos uno al lado del otro. Por eso una comprobación mide en cada compilación cada rótulo frente a sus vecinos y frente al marco. Son hoy 106 rótulos, todos libres.

El mapamundi no está dibujado en absoluto. Se calcula a partir de datos abiertos de fronteras: anillos descomprimidos, recompuestos a través del antimeridiano, simplificados y proyectados en plano. El mismo script escribe, desde las mismas constantes, la conversión con la que se sitúan los marcadores. Mapa y marcadores no pueden separarse, porque ambos provienen de una sola fuente.

La portada no lleva una imagen de reclamo sino el registro mismo: una esfera en la que cada país es un punto, ponderado por el número de encargos ejecutados allí. Se gira, se extrae un país y se lee la cifra al lado. La prueba no es una frase sobre la prueba: es el propio control.

Debajo hay un motor de dibujo, no un framework. La línea de costa está precalculada, codificada por diferencias y ocupa unos 56 KB comprimidos; se carga solo después del primer pintado, razón por la cual la portada compilada se mantiene en torno a 42 KB comprimidos y el mayor elemento durante la carga es el titular, no el lienzo. Debajo, como imagen de partida, hay un dibujo estático de la misma esfera, de modo que nada parpadea y nada salta antes de que lleguen los datos.

El bucle se detiene en cuanto no tiene nada que hacer. Si no se gira nada, si nada está seleccionado, si la esfera ha salido del encuadre o la pestaña está en segundo plano, no sigue corriendo: se para y arranca de nuevo con el siguiente evento. Una portada que dibuja sesenta imágenes por segundo durante horas en una ventana que nadie mira es un defecto que solo se nota por el ventilador.

El mismo motor sirve a dos consumidores, la portada y un archivo de demostración independiente, y una comprobación exige que siga siendo un archivo con una sola exportación. De lo contrario habría aparecido pronto la segunda esfera, contradiciendo en voz baja a la primera.

El claro es lo predeterminado y el oscuro es una decisión. El sitio deliberadamente no sigue el ajuste del sistema mientras el visitante no haya elegido nada: una consultora de ingeniería se lee primero sobre blanco papel, y quien lo quiera de otro modo lo dice una vez.

Esto lo sostienen dos atributos separados. Uno guarda la elección, el otro el esquema derivado de ella, y cada componente pregunta solo por el esquema. Parece un atributo de más, y es la razón por la que un tercer juego de colores sería aquí una adición en un solo sitio y no un cambio en dieciocho componentes. Ambos los fija el mismo script antes del primer pintado. Escríbalos por separado y obtendrá una página que pinta, durante un fotograma, texto oscuro sobre fondo oscuro.

Una superficie se comporta de forma distinta a todas las demás, la invertida: su fondo cambia con el esquema, así que también cambia la legibilidad del acento sobre ella. Por eso lleva un valor de acento propio, tomado en cada esquema del extremo adecuado de la rampa de rojos. Sin él, el rojo corporativo quedaría allí en algo más de 2:1 y sería invisible en un portátil dentro de un tren.

Medido en lugar de estimado: la tabla de contrastes del esquema claro está calculada, los 28 pares comprobados cumplen AA, y el más débil se sitúa en 4,90:1.

El sitio funcionó durante un tiempo con dos anchos, uno estrecho para la cabecera y las entradas y otro ancho para las bandas fotográficas. Eso pone dos aristas verticales en la misma página y, una vez que se ha visto, se ve en todas partes. Hoy hay exactamente un ancho de página, cabecera incluida.

El margen está atado a ese ancho en vez de elegido: su techo es la tasa con la que crece, multiplicada por el ancho máximo. Fije libremente uno de los dos números y se construirá un fallo que no parece nada. El margen está, en efecto, dentro del ancho máximo. Si sigue creciendo cuando el ancho ya está topado, el contenido se vuelve más estrecho cuanto más ancha es la ventana. Es exactamente lo que ocurrió aquí una vez, con un máximo justo antes del tope y una caída más allá.

Una captura de pantalla nunca muestra eso, porque cada imagen aislada resulta plausible. Una comprobación lo muestra de inmediato: mide el ancho del contenido por página y por tamaño de ventana, lo imprime como una fila, y un hundimiento en cualquier punto de la fila es la prueba. La misma ejecución recorre cada elemento en tres anchos de teléfono y nombra todo lo que sobresale del borde del documento.

Dos hallazgos son lo bastante generales como para llevárselos. Un elemento de rejilla centrado se dimensiona según su contenido máximo, de modo que un pie de imagen largo revienta la rejilla mientras no se le ponga un límite explícito. Y el desbordamiento no se aplica a una caja de tabla, razón por la cual la clase auxiliar que oculta contenido para los lectores de pantalla no recorta una tabla desnuda sino que la deja a la vista.

Junto al sitio hay un folleto de 37 hojas A4, y no es una copia. Es un único archivo HTML con sus tipografías e imágenes incrustadas, que se lee en el navegador y se imprime desde él. Lo que aparece en él procede de los archivos de contenido del sitio. Cambie una línea de servicio y cambian ambas ediciones.

La paginación está calculada, no compuesta. El paso de construcción valora cada fila en unidades de impresión y llena hojas hasta que están completas. Las constantes que eso requiere no se estiman sino que se miden: una comprobación renderiza el documento acabado y vuelve a leer las cajas. El primer intento las adivinó, y doce hojas consecutivas se desbordaron.

De ahí que al final haya una barrera que debe pasar. Una hoja A4 desbordada parece inofensiva en pantalla y pierde su borde inferior al imprimirse, sin que aparezca mensaje alguno en ningún sitio. Un fallo que solo se ve en el papel se ve demasiado tarde. Al lado está una exportación a un documento editable, verificada contra la composición del original, con una desviación restante de dos centésimas de píxel.

Nada de esto fuerza por sí solo la sincronía. Los contenidos se llevan al folleto de forma deliberada y no se cargan en tiempo de ejecución, para que un cambio en el sitio no altere retroactivamente un documento ya impreso.

Las fichas de proyecto son la parte del sitio destinada a seguir creciendo, y la única que necesita una interfaz. Existe, ocupa una dirección propia y funciona solo en el equipo de quien edita: una lista de los registros existentes, un formulario para cada campo, y al lado una vista previa de la tarjeta y de la página terminada.

Lo que edita son los mismos archivos desde los que se construye el sitio, sin base de datos y sin cuenta. Cada campo se valida al guardar contra el mismo esquema con el que valida la compilación. Un registro que pasa aquí no rompe la compilación: ese es todo el propósito del ejercicio, y el recorrido está probado en más de treinta comprobaciones.

Cuando una ficha no tiene detrás un documento firmado, se marca como representativa, de forma visible en el índice y en cada entrada. Lo documentado está en el registro; lo que se sitúa al lado no se presenta como pieza contractual. Esa separación es la condición bajo la cual esa mitad del sitio vale algo.

La entrega es estática desde un contenedor: archivos compilados tras un servidor ligero, y un envío a la rama principal reconstruye. Un pie de página nos nombra como autor, en el cuerpo de letra más discreto de la página.