Proyecto técnico · Sitios web
Plataforma orientada al análisis y exploración de características técnicas de sitios web mediante revisión de rendimiento, recursos, configuración, señales SEO y exposición técnica a partir de una URL.
Evaluar el estado técnico de una página web suele requerir múltiples herramientas, revisar métricas manualmente y combinar información de distintas fuentes para obtener una visión completa del sitio.
Aspectos como rendimiento, enlaces rotos, recursos que fallan, prácticas de SEO, exposición técnica o configuraciones de seguridad normalmente se analizan por separado, dificultando tener una lectura rápida del estado general de una web.
El objetivo del proyecto es centralizar estas verificaciones en una sola plataforma, generando un diagnóstico que permita identificar oportunidades de mejora y convertir métricas técnicas en información más fácil de interpretar.
Para abordar el problema, se construyó una plataforma orientada a explorar y analizar distintas características técnicas de sitios web, consolidando la información obtenida en un único punto de consulta.
El proceso inicia a partir de una URL ingresada al sistema. A través de servicios desarrollados en Python se ejecutan análisis sobre rendimiento, navegabilidad, recursos cargados, experiencia de usuario, SEO y exposición general de seguridad.
Los resultados obtenidos son procesados y almacenados en una base de datos mediante Django, para posteriormente ser expuestos a través de una API desarrollada con Django REST Framework y consumida por un frontend construido en Angular.
La arquitectura del proyecto separa la exploración técnica, el procesamiento de resultados, la lógica de negocio y la visualización final, permitiendo un flujo más organizado, reutilizable y fácil de mantener.
El proceso inicia con una URL que es analizada mediante servicios en Python. Estos servicios utilizan herramientas como Lighthouse, Requests y BeautifulSoup para evaluar rendimiento, enlaces, recursos, SEO, experiencia de usuario y seguridad.
Posteriormente, Django guarda los resultados en una base de datos y los expone mediante una API desarrollada con Django REST Framework. Finalmente, Angular consume estos datos para presentar el diagnóstico técnico de forma clara y visual.
Vista general de los resultados obtenidos durante la revisión técnica del sitio web.
Cargando datos del dashboard…
Hallazgo 1
La revisión muestra que el sitio cuenta con una base técnica segura: usa HTTPS, tiene un certificado SSL válido, maneja una conexión moderna y mantiene baja exposición de información técnica. Sin embargo, aunque el servidor responde rápido, la página todavía puede sentirse pesada durante la navegación, especialmente al cargar todos sus recursos o responder a ciertas interacciones del usuario.
Hallazgo 2
La cantidad de solicitudes, el peso transferido y el tiempo de respuesta inicial permiten evaluar cuánto puede influir el volumen de recursos en el rendimiento del sitio analizado.
Hallazgo 3
Una parte importante de las imágenes no cuenta con texto alternativo (alt), lo que limita accesibilidad para lectores de pantalla y reduce contexto para motores de búsqueda. Además, no se detectó una meta descripción válida, elemento que normalmente ayuda a mejorar presentación y descubrimiento del sitio. También se detectó un salto en la jerarquía de encabezados, lo que puede afectar estructura semántica y navegación asistida.
Hallazgo 4
La navegación muestra pocos errores críticos y no se detectaron redirecciones excesivas. Sin embargo, aún aparecen recursos con respuestas HTTP problemáticas y el archivo robots.txt expone rutas que podrían revelar estructura interna del sitio. Esto no implica una vulnerabilidad inmediata, pero sí conviene revisar qué información está siendo publicada para buscadores.
Con base en los resultados obtenidos durante la revisión de la web, se proponen acciones para mejorar velocidad de carga, accesibilidad, mantenimiento técnico y experiencia general del sitio.
Recomendación 1
Aunque el servidor responde rápido, la página descarga una cantidad alta de recursos y todavía puede sentirse pesada durante la carga. Reducir peso de imágenes, diferir scripts no críticos, comprimir recursos y aplicar carga progresiva ayudaría a mostrar contenido útil más rápido y mejorar la experiencia de navegación.
Recomendación 2
Varias imágenes no cuentan con texto alternativo y la meta descripción no está configurada correctamente. Completar estos elementos mejora accesibilidad para lectores de pantalla, comprensión del contenido y presentación del sitio en buscadores.
Recomendación 3
Se detectaron respuestas HTTP problemáticas, errores en consola y uso de tecnologías o prácticas antiguas. Priorizar estos elementos ayuda a prevenir fallos futuros, mejorar compatibilidad y mantener una experiencia más estable para usuarios reales.
Recomendación 4
La configuración HTTPS y SSL presenta un estado sólido, pero todavía existen políticas de navegador que pueden fortalecerse. Completar encabezados pendientes y revisar la exposición de rutas públicas ayuda a conservar un nivel de seguridad consistente en el tiempo.
El proyecto fue diseñado separando la exploración técnica, el procesamiento de resultados, el almacenamiento de métricas y la visualización final, evitando ejecutar análisis completos cada vez que un usuario consulta el dashboard.
La lógica se dividió en módulos especializados para rendimiento, navegabilidad, recursos, UX/SEO y seguridad. Esto permite mantener cada análisis separado, más fácil de entender y de ajustar sin afectar todo el proyecto.
La exploración se ejecuta desde un comando personalizado que recibe una URL, procesa las validaciones técnicas y almacena los resultados para su posterior consulta. Esto evita depender de una ejecución directa desde el frontend.
Los resultados de Lighthouse, enlaces, recursos, SEO y seguridad se almacenan en base de datos para que el dashboard consulte información ya procesada, reduciendo carga y tiempos de respuesta.
Django REST Framework expone los datos para que Angular los consuma y construya visualizaciones con Chart.js, manteniendo separadas la lógica técnica del backend y la presentación del frontend.
Este proyecto demuestra cómo la exploración técnica de sitios web puede transformarse en un dashboard visual que traduzca métricas e información técnica en resultados comprensibles para apoyar decisiones relacionadas con rendimiento, accesibilidad, SEO y seguridad.
El principal aprendizaje fue separar la captura de información, el procesamiento de resultados y la visualización final. Lighthouse y los módulos de análisis generan indicadores especializados, Django centraliza y expone los resultados mediante API y Angular los convierte en gráficos e indicadores pensados para facilitar interpretación.
El proyecto también permitió entender cómo conceptos que normalmente aparecen aislados —como Core Web Vitals, certificados SSL, encabezados HTTP, robots.txt, accesibilidad y estructura SEO— se relacionan entre sí y terminan impactando experiencia de usuario, posicionamiento y calidad técnica del sitio.
Más allá del dashboard, el valor del análisis está en convertir información técnica en acciones concretas: identificar cuellos de botella, reducir exposición técnica, mejorar accesibilidad y priorizar cambios con mayor impacto sobre la experiencia del usuario.
