Caso de estudio · Sin fines de lucro · Derechos civiles y movilidad económica · 2026
Urban League of Greater AtlantaUn siglo de servicio, preparado para el próximo.
Una plataforma WordPress a medida, un sistema de eventos pensado para explorar y un plan de modernización listo para que la dirección lo pusiera en marcha.
La Urban League of Greater Atlanta abre puertas a la oportunidad desde 1920. Reconstruí su sitio web como una plataforma WordPress a medida y sigo cuidándolo cada mes. En 2026 esa colaboración se convirtió en un programa de modernización: una nueva plataforma de eventos, una página de inicio que pregunta a las personas qué necesitan, un recorrido de donación guiado listo para instalar y un plan que protege la voz de la Urban League y su visibilidad en los buscadores.
- Cliente
- Urban League of Greater Atlanta
- Función
- Diseñador y desarrollador principal, colaborador continuo
- Plataforma
- WordPress a medida sobre Hello Elementor, plugins propios, SiteGround
- Cronología
- Mantenimiento continuo; programa de modernización 2026
- Entregables
- Sitio, plataforma de eventos, recorrido del donante (listo para instalar), hoja de ruta, biblioteca de imágenes
Dos formas de leer este caso. Cada capítulo empieza en lenguaje sencillo: qué cambió y para quién. Los lectores técnicos pueden abrir Bajo el capó para ver la ingeniería.
El desafío
Un sitio con mucho contenido pero cargado de texto, un calendario basado en un plugin anticuado y una necesidad creciente de gestionar la redacción de forma coherente en decenas de páginas.
El enfoque
Componentes propios en lugar de plugins frágiles, construidos junto a lo que ya funcionaba, con un plan que preserva primero el significado y lo mide todo.
El resultado
Una plataforma de eventos y un asistente de bienvenida en funcionamiento, un recorrido del donante listo para instalar, una herramienta de redacción para todo el sitio y una hoja de ruta de modernización para la dirección.
La colaboración
Una plataforma a medida, cuidada cada mes
El sitio web de la Urban League se rediseñó y reconstruyó como una instalación de WordPress a medida, y desde entonces lo sigo cuidando: actualizaciones mensuales, páginas nuevas, anuncios y correcciones.
Esa relación constante es la razón por la que el trabajo más amplio de 2026 pudo avanzar con rapidez. La base ya era nuestra para seguir construyendo.
- Construido a medida sobre el tema base Hello Elementor
- Mantenimiento y actualizaciones mensuales
- Anuncios que el personal puede colocar en cualquier página
Bajo el capóPara lectores técnicos
- WordPress sobre el tema Hello Elementor, construido con contenedores de Elementor y componentes a medida.
- Anuncios como el del nuevo programa de asistencia para el alquiler comenzaron como bloques HTML autónomos y ahora son un widget de Elementor reutilizable (véase Componentes que el personal puede gestionar).
- Alojado en SiteGround con su Speed Optimizer; el trabajo a medida está preparado para resistir la combinación de CSS y la carga diferida de imágenes (véase Cuidado y oficio).
Navegación por intención
“¿Qué le trae por aquí hoy?”
La Urban League hace muchísimo, y sus páginas eran ricas en contenido pero cargadas de texto. Los visitantes tenían que leer y buscar.
Ahora la página de inicio recibe a las personas como un conserje. Eligen lo que vinieron a buscar, como obtener ayuda, hacer voluntariado, patrocinar, asistir a un evento o donar, y van directamente allí. Siempre hay una persona real a una llamada de distancia.
- Cinco opciones claras al llegar
- Cada destino a dos clics como máximo
- Una señal de avance que indica a las personas que ya van en camino
Bajo el capóPara lectores técnicos
- Diseñado a partir de un mapa de intenciones: cada “Quiero…” conduce a un único destino óptimo entre los pilares, eventos, donaciones e informes de la Urban League.
- En funcionamiento en la página de inicio como cinco tarjetas fotográficas con una señal de avance y una línea telefónica directa, construidas con contenedores de Elementor.
- Siguiente paso propuesto: codificar el mapa como un árbol de intenciones basado en configuración que el equipo pueda editar sin un desarrollador, y reutilizar las mismas preguntas como contenido de preguntas frecuentes para buscadores y respuestas de IA.
Plugin propio · ULGA Events
Una plataforma de eventos pensada para explorar
El antiguo plugin de calendario era capaz, pero se veía anticuado en los teléfonos y era difícil de ampliar. La nueva plataforma de eventos se siente como una aplicación de streaming: un evento destacado con cuenta regresiva en vivo, filas con lo que ocurre pronto y lo que tiene inscripción abierta, y filas por tema, desde pequeñas empresas hasta vivienda y vida cívica.
Se construyó justo al lado del calendario anterior, que siguió funcionando sin cambios hasta que el nuevo demostró su valor. Primero se trasladaron todos los eventos pasados y próximos, para que nada empezara vacío.
- Vistas Destacado, Explorar, Calendario y Archivo
- Cuentas regresivas en vivo, inscripción con un toque, añadir al calendario
- Construida junto al calendario anterior sin ninguna interrupción
Bajo el capóPara lectores técnicos
- Plugin propio “ULGA Events”: su propio tipo de contenido (ulga_event) y un shortcode [ulga_events], elegido en lugar de un servicio alojado para que la Urban League sea dueña absoluta de la plataforma.
- Un contrato escrito de no interrupción: cada identificador tiene su propio espacio de nombres (tipo de contenido ulga_event, URL /event/<slug>/, taxonomías propias, metadatos _ulga_ev_, rutas REST ulga/v1, hooks y opciones ulga_events_*, CSS .ulga-ev), de modo que nada puede entrar en conflicto con EventON, que siguió funcionando sin cambios.
- Cargado con los 80 eventos publicados en EventON. EventON nunca expuso sus fechas y sedes a través de la API, así que el historial se recopiló de las páginas renderizadas, se normalizó y se importó con un importador idempotente indexado por el ID original de EventON: simulación por defecto, pantalla de administración más WP-CLI, nunca elimina nada. El calendario contiene ahora 100 eventos.
- Cada registro importado conserva su procedencia (ID original, URL de origen y la línea de fecha sin procesar tal como se mostraba), de modo que cualquier valor puede rastrearse hasta su origen. La auditoría de importación sacó a la luz defectos reales en los datos (horas de fin anteriores a las de inicio, fechas de inscripción que no coincidían, 28 eventos sin sede) y entregó al personal una hoja de trabajo de limpieza en lugar de modificar sus registros en silencio.
- Modelo de datos pensado para la API: todos los metadatos registrados con show_in_rest; fechas almacenadas como cadenas ISO 8601 con una zona horaria IANA; reglas de recurrencia RFC 5545; campos de inscripción, aforo, costo y modalidad en línea.
- Rápida por defecto: la página principal muestra solo los próximos eventos (74 de los 80 originales ya habían pasado), con el archivo en su propia URL enlazable e indexable. Los eventos siguen siendo “próximos” hasta que terminan, no cuando empiezan, para que los eventos de varios días no desaparezcan el primer día.
- Exportación al calendario (un evento o todo el feed en ICS), un endpoint REST con filtrado por categoría, plantillas sobrescribibles y un carrusel de eventos destacados para la página de inicio, disponible como shortcode y como widget de Elementor con controles de estilo completos, que reemplaza el antiguo widget que leía de EventON.
- Unas 5,500 líneas de PHP, JavaScript y CSS en 14 clases.
- Sistema visual: una interfaz oscura, al estilo de una aplicación, en Anton, Bebas Neue e Inter sobre una paleta roja y dorada.
- Ahora es la experiencia principal en /events (versión del plugin 0.10.0, confirmada en producción en octubre de 2026), con EventON todavía instalado como respaldo. El plan de migración avanza por fases de construcción, ejecución en paralelo, piloto y transición, con una reversión de pocos minutos en cada fase.
- El optimizador de CSS de SiteGround rompía las hojas de estilo de la página al combinar archivos; se resolvió incrustando el CSS del módulo detrás de un único interruptor en wp-config.
Eventos especiales
Momentos emblemáticos, con escenario propio
Los mayores encuentros de la Urban League, como el Economic Mobility Summit and Legacy Impact Gala, Spirit of the League y Super Saturday, merecen más que una entrada en el calendario.
Cada uno tiene ahora su propio tipo de página, para que el personal pueda contar la historia completa de un evento emblemático mientras el calendario sigue gestionando las fechas y las inscripciones.
- Cuatro páginas de eventos especiales
- Un centro de Eventos Emblemáticos
- Calendario e historias siempre en sintonía
Bajo el capóPara lectores técnicos
- Un segundo tipo de contenido personalizado (ulga_special_event) para páginas extensas de eventos emblemáticos, separado de las entradas fechadas del calendario.
- Una página de inicio de Eventos Emblemáticos construida con componentes a medida.
- Cuatro páginas de eventos especiales en producción, confirmadas a través de la API REST de WordPress (Meet the Money People, Super Saturday, Spirit of the League y el Economic Mobility Summit & Legacy Impact Gala).
Recorrido del donante
Ganarse la donación antes de pedirla
Una página de donaciones que empieza con un formulario de pago pide dinero antes de ganarse la donación. El recorrido del donante convierte la petición en cuatro pasos breves: elegir un camino, escoger la labor que le importa, ver lo que su aporte realmente logra y llegar al lugar adecuado para completarlo.
Las grandes donaciones reciben atención personal: a un posible donante de $25,000 se le ofrece una conversación junto con el pago. El recorrido está construido, empaquetado y listo para instalarse en la página de donaciones.
- Donar, colaborar como aliado o hacer una donación mayor o un legado
- Montos presentados según lo que logran
- Las donaciones de $1,000 o más pueden solicitar un seguimiento personal
Bajo el capóPara lectores técnicos
- Empaquetado como un widget nativo de Elementor bajo una categoría “Urban League”, editable por el personal en seis secciones de contenido y una pestaña de estilo: títulos, imágenes, colores, montos y correo de enrutamiento.
- Las áreas de impacto corresponden a las ocho causas de la Urban League: acceso a vivienda propia, pequeñas empresas, educación, carreras de alta demanda, reinserción, cuidado infantil, salud y educación financiera.
- Las donaciones por debajo del umbral enlazan directamente con el formulario existente de EveryAction con el monto y la frecuencia ya completados, eliminando el paso de volver a introducir datos, donde los flujos de donación suelen perder personas.
- Las alianzas, las donaciones mayores y las donaciones planificadas recogen el contacto completo y lo dirigen a desarrollo de fondos, con opción de suscribirse al boletín.
Estrategia
Un plan de modernización listo para ejecutar
La dirección recibió el plan en forma de sitio web: seis líneas de trabajo, un calendario de seis semanas que muestra quién es responsable de cada parte y principios que orientan cada decisión.
El trabajo de lenguaje va primero porque es de bajo riesgo, mientras los desarrollos más grandes avanzan en paralelo. La Urban League redacta y aprueba sus propias palabras; yo aporto la evidencia y la implementación.
- Seis líneas de trabajo en seis semanas
- Responsabilidades claras: las palabras son de la Urban League
- Principios: el significado antes que la mecánica, sin tácticas engañosas, la tecnología en propiedad
Bajo el capóPara lectores técnicos
- Líneas de trabajo: 01 auditoría y corrección editorial, 02 protección en SEO y en respuestas de IA, 03 plataforma de eventos, 04 navegación por intención, 05 representación, 06 incorporación de donantes.
- El plan de eventos definió criterios de salida fase por fase (por ejemplo, de 7 a 14 días de ejecución en paralelo sin ninguna desviación de datos antes de cualquier piloto) y una reversión en cada paso.
- Construido como sitio estático para que cada cifra y cada hallazgo se puedan enlazar, imprimir y versionar.
Plugin propio · LSJD Term Swap
Un criterio de redacción, aplicado en todo el sitio
Cuando la Urban League actualizó la forma en que describe parte de su labor, cambiar las palabras página por página habría llevado semanas y dejado puntos sin revisar. También corría el riesgo de borrar los nombres de programas, aliados e investigaciones por los que la Urban League es conocida.
Por eso se revisó cada página publicada y cada frase recibió una decisión clara: mantenerla, reformularla o trasladarla. La Urban League aprobó la nueva redacción, y una herramienta a medida la aplica ahora en todo el sitio, protegiendo nombres, citas y títulos de investigaciones.
- Una decisión para cada frase, aprobada por la Urban League
- Nombres de programas, citas y títulos de investigaciones protegidos
- Aplicada en todo el sitio mediante una sola herramienta que controla la Urban League
Bajo el capóPara lectores técnicos
- Un rastreo en vivo de las páginas principales, con cada aparición registrada por página, contexto y decisión en un explorador con búsqueda que sustituyó a la hoja de cálculo.
- Las reformulaciones aprobadas se entregaron como una hoja de cambios página por página antes de modificar nada en el sitio publicado.
- El plugin propio “LSJD Term Swap” aplica las reformulaciones al vuelo o las guarda en la base de datos, con una lista de frases protegidas; activado en septiembre de 2026.
Visibilidad en buscadores e IA
Seguir siendo visibles en las búsquedas
Cuando cambian las palabras, una organización puede perder las búsquedas en las que siempre ha aparecido. El plan mantiene a la Urban League visible en los temas que le pertenecen, sin texto oculto ni otros trucos que los buscadores penalizan.
Los buscadores modernos y los asistentes de IA entienden el significado y las palabras relacionadas, así que el plan se centra en el significado y mide antes y después de cada cambio.
- Sin texto oculto ni otros trucos que los buscadores penalizan
- Las preguntas que hace la gente, respondidas en la propia página
- Posicionamiento medido antes y después de cada ronda de cambios
Bajo el capóPara lectores técnicos
- El plan, para ejecutarse antes y durante cada ronda de cambios de redacción:
- Optimización semántica y de entidades para que los sinónimos mantengan a la Urban League vinculada a sus temas.
- Zonas de conservación justificables: los términos exactos se mantienen donde son factuales, como noticias, legislación citada, títulos de investigaciones y citas.
- Contenido de preguntas frecuentes y schema FAQPage, que se construirán a partir de las preguntas de intención de la página de inicio, el formato que citan los motores de respuesta.
- Señales de entidad externas que reforzar (Candid, Google Business Profile, Wikidata, prensa) y texto alternativo honesto.
- Medición de referencia en Search Console más un conjunto fijo de preguntas de prueba para asistentes de IA antes de las ediciones; después, revertir cualquier cambio que perjudique de forma medible.
Biblioteca de imágenes
Retratar a toda la comunidad
La Urban League atiende a familias rurales y urbanas de muy diversos orígenes, y sus imágenes deben reflejarlo. En lugar de comprar fotos de archivo, creé una biblioteca de 27 escenas ilustrativas en torno a los momentos en los que la Urban League está presente: una primera vivienda, un primer sueldo, una asamblea vecinal, un nuevo comienzo tras la reinserción.
Cada imagen está claramente identificada como ilustración generada con IA, y nunca se presenta como un cliente o un evento real.
- 27 escenas en dos colecciones: momentos de vida, y vida cívica y reinserción
- Etiquetadas por pilar de programa, etapa de vida y hogar
- Identificadas con honestidad, nunca usadas como gesto simbólico
Bajo el capóPara lectores técnicos
- Taxonomía de tres ejes: los cinco pilares de la Urban League, las etapas de vida (del primer empleo a la jubilación, reinserción y limpieza de antecedentes, inscripción electoral) y la edad y el tipo de hogar.
- La taxonomía puso de manifiesto el vacío: la participación cívica tenía una sola imagen; la segunda colección la llevó a ocho, más dos sobre reinserción.
- Un registro de recursos describe a las personas de cada escena; la biblioteca se entrega como un sitio estático filtrable.
Plugins propios · Herramientas para el personal
Componentes que el personal puede gestionar
Las tareas pequeñas y repetitivas antes requerían un desarrollador: anunciar un nuevo programa con una ventana emergente o agradecer a los patrocinadores con una fila de logotipos. Ahora cada una es un bloque listo para usar que el personal de la Urban League arrastra a cualquier página y completa por su cuenta.
Ambos se construyeron accesibles desde el principio, de modo que una franja de logotipos en movimiento siempre puede pausarse y a nadie se le muestra el mismo anuncio una y otra vez.
- Una ventana emergente para anuncios y folletos de eventos
- Una franja de logotipos de patrocinadores que solo se desplaza cuando es necesario
- Cada color, tamaño y tipografía editable sin código
Bajo el capóPara lectores técnicos
- ULGA Popup 1.0.0: un widget de Elementor con ubicación de imagen, título, texto enriquecido, botón y enlace para cerrar; se abre tras un retraso o desde cualquier enlace #ulga-popup-ID; frecuencia de una vez por visita, cada N días o en cada vista; al cambiar el ID vuelve a mostrarse a quienes lo cerraron. La configuración por defecto reproduce la ventana emergente original de Tenant Rental Assistance.
- ULGA Sponsors 1.0.0: una franja de logotipos que se repite en bucle sin cortes solo cuando los logotipos desbordan el espacio (o a partir de un número definido por dispositivo), con la velocidad fijada en píxeles por segundo para que se mantenga constante sin importar cuántos logotipos haya.
- Accesibilidad integrada: un control de pausa y reproducción, como exige WCAG 2.2.2, con pausa al pasar el cursor, al recibir el foco del teclado y cuando queda fuera de la pantalla; una cuadrícula estática para visitantes con movimiento reducido; los duplicados del bucle ocultos a los lectores de pantalla y a la tecla Tab; compatibilidad con arrastrar y deslizar.
- Texto alternativo, enlaces y ajuste de peso visual por logotipo; tamaños por dispositivo; escala de grises hasta pasar el cursor y bordes difuminados como opciones de estilo.
Cuidado y oficio
Los detalles que lo mantienen en marcha
Los sitios web reales conviven con las peculiaridades reales del alojamiento. Parte de cuidar el sitio de la Urban League es asegurarse de que el trabajo nuevo las resista, para que un ajuste de velocidad nunca rompa una página y cada imagen aparezca de verdad.
- Trabajo a medida que resiste el optimizador de velocidad del proveedor de alojamiento
- Imágenes que cargan de forma fiable dentro de los bloques a medida
- EventON intacto hasta que su sustituto demuestre su valor
Bajo el capóPara lectores técnicos
- SiteGround Speed Optimizer combina el CSS y reescribe las imágenes como un marcador de posición de 1x1 con la URL real guardada en data-src. Los bloques a medida se excluyen con skip-lazy y data-no-lazy, además de un pequeño script que restaura data-src como respaldo.
- Cuando el CSS combinado rompió toda la página, los estilos del módulo de eventos se incrustaron detrás de define('ULGA_EVENTS_INLINE_CSS', true), que ahora es lo primero que conviene revisar cuando los estilos fallan en todo el sitio.
- La protección contra bots de SiteGround bloquea la extracción de datos desde el servidor, por lo que los datos del sitio se recopilan a través de un navegador real.
Lléveselo
La historia completa, en papel.
El caso de estudio completo y un resumen de una página, diseñados para imprimir, compartir con una junta directiva o adjuntar a una propuesta.