Test de verificación HTML y herramientas útiles

10.Test de verificación HTML y herramientas útiles
Hay una gran cantidad de herramientas muy útiles para desarrolladores de forma online o que se instalan en los navegadores en forma de extensiones o plugins y que nos permiten funcionalidades extra. A continuación veremos algunas de ellas.
10.1. Validador HTML, W3C
El W3C nos ofrece varias herramientas e información muy valiosa para la elaboración de nuestros desarrollos. Entre las herramientas destacadas se encuentra el validador HTML (validator.w3.org) que nos permite encontrar errores en nuestros ficheros. Este validador HTML nos permite validar nuestras páginas seleccionando los ficheros HTML a validar o eligiendo directamente la url publicada. Además se pueden configurar parámetros como la codificación o el tipo de documento HTML a validar.
10.2. HTMLHint, extensión para Visual Studio Code
Las páginas web se pueden validar en Visual Studio Code mediante la extensión HTMLHint. Para ello, accede a la pestaña “Extensions” de Visual Studio Code e instala la extensión tal y como puedes ver en la siguiente captura:

Una vez realizada la instalación la herramienta mostrará los errores de validación en el código de cada documento HTML, tal y como se puede ver en la siguiente captura:

Para ver los errores tan solo tenemos que ir al menú ver/problemas.
10.3. Firefox developer edition
Se trata de un navegador creado específicamente para desarrolladores web que ofrece herramientas muy interesantes como por ejemplo: panel de tipografías, editor de formas, inspector, consola o depurador, entre otras. mozilla.org/es-ES/firefox/developer/.
10.4. Web developer
Consiste en una extensión disponible para Chrome, Firefox o IE que nos ofrece un control exhaustivo de varias partes de la web, tales como el CSS, los formularios o las imágenes. Con Web Developer instalado podemos, por ejemplo, alterar casi cualquier elemento final de la web en tiempo real y así aplicarlo a los archivos finales.

10.5. Seositecheckup
SEOSiteCheckup es una herramienta online que nos ayuda a analizar el SEO de un sitio web para conocer factores como las palabras clave, enlaces rotos, mapa de sitio, etiquetas alt en las imágenes, velocidad de carga, servidores y seguridad, usabilidad en dispositivos móviles, etc. Esta herramienta online ofrece funciones limitadas en su versión gratuita. seositecheckup.com
10.6. CodePen
CodePen es una comunidad en línea para probar y mostrar fragmentos de código HTML, CSS y JavaScript. Funciona como un editor de código en línea y un entorno de aprendizaje de código abierto, donde los desarrolladores pueden crear y probar fragmentos de código, llamados «pens». Ver tutorial de CodePen.