Holmes.css un detective per il vostro markup
- Scritto da Giulia Ballarin
- in HTML e CSS, Tutorials
- il 26 Ottobre 2011
- Commenti
Holmes è un file CSS che, grazie all’utilizzo di pseudo-classi, pseudo-elementi e selettori d’attributo, è in grado di evidenziare markup HTML non valido, inaccessibile o errato.
Errori, avvisi e proprietà CSS deprecate
Utilizzando holmes.css possiamo individuare, attraverso bordi di colori differenti, errori, avvertimenti ed elementi CSS deprecati per le seguenti categorie:
- attributi mancanti, come l’attributo name per i tag di input
- markup migliorabile, come i link con href=”#”
- elementi deprecati e non conformi al W3C
- attributi non W3C
Come analizzare il nostro codice
Utilizzare holmes.css è molto semplice: una volta scaricato il file, basterà richiamarlo all’interno della nostra pagina e aggiungere la classe “holmes-debug” al tag body o html. Nulla di più.
<html> <head> <link rel="stylesheet" type="text/css" href="holmes.css"> </head> <body class="holmes-debug"> </body> </html>
Una volta caricata la vostra pagina nel browser vedrete, se presenti, errori o elementi mancanti segnalati con il relativo colore (vedi la pagina di prova).
Holmes.css è disponibile anche come plugin per WordPress.
Perché utilizzare holmes.css
Holmes.css è uno strumento utile per la correzione di pagine di siti ormai datati o l’analisi di codice complesso. Il lavoro di correzione viene agevolato dalla resa grafica di eventuali errori del markup e dalla visualizzazione immediata del problema.
Browser supportati
- Chrome 10+
- Safari 5+
- Opera 10+
- Firefox 3.5+
- Internet Explorer 9+
- Altri articoli che potrebbero interessarti:
Come disabilitare css e javascript dei plugin WordPressLeggi
FlexSlider – jQuery slider responsiveLeggi
Come fare il backup di WordPressLeggi
Commenti
Commenta
Articoli popolari
-
Robots.txt e Google Webmaster Tools -
Come sostituire il logo di WordPress nei pannelli login e admin - Come fare il backup di Wordpress
Screensiz.es – Tutte le risoluzioni per realizzare siti responsive
Caniuse.com – Risorsa per web designer e developer sulle funzionalità CSS3, HTML5 e SVG supportate dai browser
Grazie per l’ articolo, prima d’ ora non conoscevo questo holmes.css e devo dire che mi sarà molto utile in futuro.
Sai quando è stato il suo ultimo aggiornamento?
Ciao, sul sito non sono presenti note sui vari rilasci, ma se clicchi sul collegamento a github vedrai che l’ultimo file caricato risale a circa sei mesi fa.