Si te estas iniciando en el desarrollo web y estás a punto de publicar tu primera web, o si dispones ya de una y tienes la sensación que no es todo lo eficiente que debería, lee este post y descubre 22 herramientas gratuitas para validar páginas web. Si además intentas abrirte en el mundo de la programación como freelance, deberías también echarle un ojo, ya que ¡estas mismas herramientas pueden ser utilizadas para analizar la calidad de tus desarrollos!

Hace ya tiempo que una web dejó de ser un mero escaparate de contenido, más o menos elegante. Hoy en día, como desarrollador, deberás tener en cuenta, no solo los requisitos explícitos de tus clientes, sino además todo aquello que se le presupone: rapidez, eficiencia, facilidad de uso, adaptación a todo tipo de dispositivos, compatibilidad con diferentes navegadores y un amplio etcétera de cuestiones técnicas.

En este post te muestro 22 herramientas gratuitas para validar páginas web, que te permitirán diagnosticar e identificar errores y, algunas de ellas, incluso te aportarán las soluciones a adoptar para erradicarlos.

Validar Estándares

Uno de los aspectos fundamentales que debería asegurar tu web es el cumplimiento con los estándares definidos por el World Wide Web Consortium, que puedes consultar en esta página.

El Consorcio World Wide Web (W3C) es una comunidad internacional que trabaja para desarrollar estándares Web y cuya misión es guiar la Web hacia su máximo potencial.

Ellos mismos, el W3C,  ponen a tu disposición, de forma gratuita, 2 herramientas imprescindibles, que te muestro a continuación. De todas formas, déjame que te haga un comentario a este respecto. Si al pasar los test descubres múltiples errores, no te asustes. Esto es bastante normal dependiendo de la herramienta que hayas seleccionado para crear tu web y, si analizas algunas webs famosas, verás que ellos tampoco se escapan. Así que tómatelo con calma.

#1 W3C Markup Validation Service

Validar paginas a nivel de HTML

Verifica que el documento escrito en HTML es conforme a la norma seleccionada y, en caso de no conformidad, te indica los errores, el lugar del documento y la causa para que puedas corregirlo. Te permite validar una página web que ya esté publicada, o bien cargar un archivo para su validación, o escribir un texto directamente y validarlo, antes de introducirlo en tu web.

#2 CSS Validation Service

Validar páginas a nivel de CSS

Esta herramienta funciona como la anterior, pero en este caso focalizada en validar las hojas de estilos de tu página. Tambien te indica los errores, el lugar del documento y la causa para que puedas corregirlo y te permite validar una página web que ya esté publicada, o bien cargar un archivo para su validación, o escribir un texto directamente y validarlo, antes de introducirlo en tu web.

Velocidad y Rendimiento

La velocidad de carga de una página es una de las características más valoradas por los navegantes. Piensa en ti mismo, cuantas veces has desestimado visitar una página web porque ésta tardaba mucho en cargarse. De que valen un diseño exquisito y un contenido de primera si ni siquiera se esperan a ver la página. Y, por supuesto, tú no quieres que esto te pase a ti. Es por ello que te recomiendo el uso de alguna de estas herramientas:

#3 GTmetrix

GTMetrix. Validar páginas a nivel de Rendimiento

Esta es una de mis herramientas favoritas y que suelo usar con frecuencia. GTmetrix te da una visión de cómo carga tu sitio y te ofrece recomendaciones prácticas sobre cómo optimizarlo. Te aporta indicadores de rendimiento basados en las reglas de Google y Yahoo!, monitoriza gráficamente el rendimiento de la página en el tiempo, pudiendo definir alertas y muchas más características.

#4 PageSpeed Insights

PageSpeed. Validar páginas a nivel de Velocidad

Esta es otra herramienta muy interesante, que Google pone a tu disposición. PageSpeed Insights analiza el contenido de una página web y, a continuación, genera sugerencias para mejorar la velocidad de las páginas.

#5 YSlow

YSlow. Validar páginas a nivel de Rendimiento

Otra gran herramienta para determinar el rendimiento de tu web. YSlow analiza las páginas web y sugiere formas de mejorar el rendimiento, en base a un conjunto de 34 reglas de optimización con las que puedes y hacerla considerablemente más rápida. Puedes consultar dichas reglas en este enlace.

A diferencia de las herramientas que hemos visto hasta ahora, YSlow no es una herramienta en línea, sino que debe descargarse como complemento de tu navegador, para poder validar tu página.

#6 Pingdom Website Speed

Pingdom. Validar páginas a nivel de Rendimiento

Otra herramienta fantástica para ayudarle a analizar la velocidad de carga de tu sitio web y aprender cómo hacerla más rápida. Se trata de una herramienta fácil de usar, independientemente de tu nivel de conocimientos.

Diseño Adaptativo (Responsive Design)

Una de las cuestiones fundamentales que todo sitio web debe cumplir hoy día es la capacidad de adaptarse a todo tipo de dispositivo (smartphone, tablet, equipo de sobremesa, …). Consciente de ello, seguro que elegiste para tu sitio una plantilla responsive o bien has utilizado algún framework como Bootstrap. De todas formas, para salir de dudas puedes probar con las siguientes herramientas:

#7 W3C Mobile Checker

W3CMobileAlpha. Validar páginas a nivel de Diseño Responsive

Se trata de una herramienta para desarrolladores web que quieren hacer que su página web o aplicación web funcione mejor en los dispositivos móviles. Permite validar páginas en formato smartphone y/o tablet.

#8 W3C mobileOK Checker

W3C mobileOK Checker. Validar Páginas a nivel de Diseño Responsive

Estamos frente a otra herramienta de validación creada por el W3C. En este caso, se llevan a cabo varias pruebas en la página web para determinar su nivel de optimización para móviles. Una página web es mobileOK cuando pasa todas las pruebas definidas en W3C mobileOK Basic Tests 1.0.

Al igual que ocurre con las herramientas de validación de HTML y CSS, te permite validar páginas web que ya estén publicadas, o bien cargar un archivo para su validación, o escribir un texto directamente y validarlo, antes de introducirlo en tu web.

Usabilidad

Una vez has garantizado una buena velocidad de carga y la visibilidad en cualquier tipo de dispositivo, el siguiente reto está en aportar una buena experiencia de navegación al usuario. Quizás esta sea el aspecto más subjetivo a la hora de validar páginas y es por ello que las herramientas disponibles son más escasas. Aun así, en la web UsabilityHub tienen varios tests que puedes utilizar de forma gratuita, aunque primero deberás registrarte. Las herramientas disponibles son:

#9 Five Second Test

Five Second Test. validar Páginas a nivel de Usabilidad

El test de los primeros 5 segundos es una técnica que consiste en enseñar el diseño a un grupo de personas durante 5 segundos y posteriormente se les pregunta que es lo que recuerdan. El sistema recoge los datos y elabora el informe que posteriormente podrás consultar.

#10  First Click Analysis

First click testing. Validar Páginas a nivel de Usabilidad

Este tipo de test analiza como los usuarios interactúan con la web, con el objeto de obtener información que te permita mejorar el diseño y disposición de los elementos de la página.

#11 Navigation Testing

Navigation Testing. Validar Páginas a nivel de  Usabilidad

Esta herramienta tiene por objetivo analizar como los usuarios navegan por tu página, con el objetivo de mejorar el ratio de conversión de la misma.

#12 ClickHeat

ClickHeat. Validar Páginas a nivel de Usabilidad

ClickHeat es una herramienta que realiza un mapa de calor visual de los clics en una página web, mostrando cuales son las zonas frías y cuales las calientes. Se trata de un software Open Source, publicado bajo licencia GPL, y de gratuito.

Adaptabilidad

Los conceptos de usabilidad y adaptabilidad van muy cogidos de la mano, sólo que la adaptabilidad está orientada a asegurar una buena experiencia de usuario independientemente de cuales sean sus condiciones fisiológicas. Si no estás muy puesto en el tema, te recomiendo leas la Guía de Accesibilidad para el Contenido Web (WCAG) 2.0 editada por el W3C. También puedes consultar la infografía que he preparado, a modo de resumen, y que encontrarás en la sección de Infografías  o en Pinterest.

#13 TAW

TAW. Validar Páginas a nivel de Adaptabilidad

TAW es una herramienta que tiene por objetivo validar páginas a nivel de accesibilidad, indicando el nivel alcanzado en el diseño y desarrollo de páginas web con el fin de permitir el acceso a todas las personas independientemente de sus características diferenciadoras.

#14 HERA.

Hera. Validar páginas a nivel de adaptabilidad

HERA es una utilidad para validar páginas a nivel de accesibilidad, de acuerdo con las recomendaciones de las Directrices de Accesibilidad para el Contenido Web 1.0 (WCAG 1.0). HERA realiza un análisis automático previo de la página e informa si se encuentran errores (detectables en forma automática) y qué puntos de verificación de las pautas deben ser revisados manualmente.

#15 CheckMyColours

CheckMyColours. Validar páginas a nivel de adaptabilidad

Es una herramienta que analiza el contraste del color de primer plano con el de fondo de todos los elementos de la página, con el objeto de determinar si el contenido puede ser percibido por personas con deficiencias visuales relacionadas con el color. Todas las pruebas se basan en los algoritmos sugeridos por el W3C).

#16 AccessColor

AccessKeys. Validar páginas a nivel de adaptabilidad

Se trata de una herramienta con los mismos principios de funcionamiento que la anterior: el análisis de contraste de color de primer plano y de fondo de todos los elementos de la página web para determinar si hay el contenido puede ser percibido por personas con deficiencias visuales.

Otros Conceptos

Estas herramientas, aunque estén en el apartado de “otros”, no por ello son menos importantes. Aquí encontraras herramientas para comprobar que no hay enlaces rotos, la compatibilidad de tu web con diferentes navegadores o que te ofrecen informes más completos que incluyen resultados de varios aspectos vistos hasta ahora.

#17 Link Checker

W3C Link Checker. Validar páginas a nivel de enlaces rotos

Nuevamente, una herramienta proporcionada por el W3C. En esta ocasión destinada a verificar si tu web cuenta con enlaces rotos, algo que puede suceder sobretodo con los enlaces externos.

#18 Browsera

Browsera. Validar páginas a nivel de navegaores

Browsera localiza problemas de diseño de compatibilidad con los diferentes navegadores. También te permite localizar errores de JavaScript, entre otros.

#19 Browsershots

BrowserShots. Validar páginas a nivel de navegadores

Se trata de una herramienta que realiza captura de pantalla de tu web ordenadores de diferentes sistemas operativos (Mac, Windows y Linux) y con diferentes navegadores: Chrome, Firefox, Opera, Lynx, entre otros.

#20 Unicorn

Unicorn. Validar páginas a nivel global

Unicorn es el validador del W3C unificado, que ayuda a mejorar la calidad de tus páginas web mediante la realización de una variedad de controles . Unicornio recoge los resultados de los populares validadores de HTML y CSS, así como otros servicios útiles.

#21 Dr. Watson

Dr. Watson. Validar páginas a nivel global.

Que el nombre no te despiste. Dr. Watson nada tiene a ver con la vieja herramiente de Microsoft. Este es un servicio gratuito para validar páginas web que te permite verificarlo siguientes aspectos :

  • La sintaxis HTML
  • Validez de los enlaces de texto y de imágenes
  • Genera contador de palabras
  • Ortográfia para texto no HTML
  • Velocidad de descarga
  • Compatibilidad con motores de búsqueda
  • Popularidad de tus enlaces

#22 Spur

Spur. Validar páginas a nivel de diseño

Se trata de una aplicación que te permite poner a prueba el diseño de tu web con aspectos diferentes a los vistos hasta ahora. Entre ellos encontrarás: Escala de grises, contraste, giro, espejado, etc.

Espero que estas herramientas para validar páginas te sean de utilidad en tu proceso de test y posteriormente, en el de mantenimiento.

¿Qué te han parecido estas herramientas? ¿Añadirías otras? ¿Cual usas tú?

Si te ha gustado el post, siéntete libre de compartirlo con tus amig@s

Esther Claravalls
Sígueme en

Esther Claravalls

Ingeniera. Profesionalmente vinculada a la informática industrial y a la creación de proyectos web. Buscadora incansable de conocimiento por el puro placer de aprender.
Esther Claravalls
Sígueme en

Latest posts by Esther Claravalls (see all)

Uso de cookies

Este sitio web utiliza cookies para que tengas la mejor experiencia de usuario. Si continuas navegando estas dando tu consentimiento para la aceptación de las mencionadas cookies y la aceptación de lapolítica de cookies, pincha el enlace para mayor información.

ACEPTAR

Pin It on Pinterest

Share This