Share
Ogni giorno, durante la revisione dei modelli su ThemeForest, eseguo il test degli invii per la convalida e la compatibilità del browser, per non parlare del mio stesso lavoro. Nel corso del tempo, ho cercato sul web la migliore validazione e gli strumenti per testare la compatibilità dei browser. Ecco i miei preferiti.
Diamo prima un'occhiata ad alcuni metodi per verificare la convalida di HTML e CSS. Dovrei menzionare che lavoro su un Mac, quindi questi saranno maggiormente influenzati dal Mac. Non preoccuparti però, ci sono molte soluzioni indipendenti dalla piattaforma.
Oltre a convalidare i tuoi file, dovresti formattare bene anche il tuo markup. "Esempi e suggerimenti per la formattazione HTML / CSS di grandi dimensioni" è un articolo per ulteriori informazioni su questo argomento.
Probabilmente il più noto è il servizio di validazione online W3C. Puoi convalidare tramite URI, caricare file o inserire direttamente il markup. Sono disponibili diverse opzioni di convalida, sebbene la maggior parte delle volte non sia necessario utilizzarle.
W3C ha anche un servizio di convalida CSS con cui probabilmente hai familiarità. Proprio come con il servizio di validazione HTML, la versione CSS ha opzioni aggiuntive se necessario e consente la convalida tramite URI, caricamento di file e immissione diretta del markup.
L'estensione della barra degli strumenti per sviluppatori Web per Firefox è molto popolare e ha un sacco di fantastiche funzioni insieme ad alcuni ottimi strumenti per verificare la convalida di HTML e CSS. Puoi verificare rapidamente la convalida del sito che stai visualizzando o un file locale che stai visualizzando. Invierà l'URI o il file da controllare su W3C e visualizzerà i risultati in una nuova scheda.
Puoi anche attivare "Visualizza convalida pagina" per mostrare alcune informazioni di convalida veloci per HTML e CSS senza dover aprire una nuova scheda. Molto utile se stai lavorando a un progetto. Puoi anche convalidare molto più che solo HTML e CSS.
Uso Safari come browser Web principale, ma Firefox mi ha rovinato prima di passare a una vasta selezione di estensioni come la barra degli strumenti di sviluppo Web e Firebug. Safari ha il Web Inspector, uno strumento simile a Firebug ma non ti consente di verificare la convalida dei file.
Un modo rapido e semplice per dare a quasi tutti i principali browser un modo per convalidare HTML e CSS è usare favelets. Le favelet sono snippet di JavaScript con segnalibro per aggiungere funzionalità extra. W3C fornisce diverse favole di convalida che uso frequentemente con Safari.
La maggior parte degli editor di sviluppo offre una sorta di strumento di convalida. Coda e CSSEdit sono attualmente i miei editor di scelta e forniscono entrambi strumenti di convalida.
Se è necessario verificare rapidamente la convalida su un gran numero di documenti, può essere un problema aprirli tutti nel tuo editor preferito o tramite browser. Questa applicazione rende facile e veloce.
Validatore S.A.C. è un'applicazione stand-alone di OS X in grado di convalidare documenti HTML (con W3C) usando una favelet, trascinare e rilasciare, con URL o solo File> Open dell'applicazione. Io uso il metodo drag and drop particolarmente spesso. ;-)
Mentre la validazione è molto importante, è è solo uno strumento per aiutarti a garantire che il codice sia all'altezza degli standard e di tutto ciò che è buono. Se stai usando alcune nuove tecnologie web, potrebbe non essere valido, ma ciò non significa che non dovresti usarlo. L'innovazione nasce spesso rompendo le regole.
Detto questo, se stai inviando un modello per la vendita presso la Foresta tematica, assicurati che TUTTI i tuoi file siano validi prima richiedente. Se ci sono errori di validazione dovuti a cose come CSS3, assicurati di menzionarlo nelle note al revisore. ;-)
Se tutti usassero versioni aggiornate di Firefox o Safari, il test del browser sarebbe un gioco da ragazzi. Ammettiamolo, non succederà e avremo a che fare con i problemi di Internet Explorer per gli anni a venire (non solo IE6).
Ecco alcuni degli strumenti che uso e altri no, per verificare la compatibilità su Internet Explorer, Safari, Firefox e altri browser.
Ovviamente avremo i browser correnti installati sui nostri sistemi come Firefox 3.5, Safari 4, Opera e Internet Explorer se sei su Windows.
Se hai bisogno di testare le versioni precedenti di Firefox, ci sono diversi modi per farlo, ma ho trovato più facile.
Portableapps su Windows esegue Firefox come applicazione standalone, quindi l'installazione non è necessaria e non rovinerà la tua attuale installazione di Firefox.
MultiFirefox 2.0 su Mac ti consente di eseguire più versioni di Firefox fianco a fianco gestendo i profili di Firefox.
Per scaricare altre versioni di Firefox puoi visitare http://releases.mozilla.org/pub/mozilla.org/firefox/releases/
Sfortunatamente per voi sviluppatori web basati su Windows, non ho una soluzione semplice per testare più versioni di Safari. Per noi utenti Mac c'è una bella raccolta di versioni standalone di Safari fornite da Michel Fortin.
Non esiste un modo semplice per testare interattivamente IE su Mac, quindi utilizzo Parallels per eseguire una macchina virtuale di Windows XP con IETester installato. Questa applicazione ti permette di testare le versioni di IE fino a 5.5 su Windows XP, Vista e 7.
Ogni tanto noterò una stranezza in IETester che non sono sicuro si verifica in una versione nativa di IE6 o 7 quindi ho anche installato versioni standalone di IE6, 7 e 8 utilizzando Internet Explorer Collection.
Se non è necessario interagire effettivamente con il tuo sito in questi browser, puoi anche utilizzare diversi servizi di snapshot del browser che mostreranno solo un'immagine di come il sito cercherà una vasta gamma di browser.
Adobe ha recentemente pubblicato un nuovo servizio chiamato BrowserLab che consente di visualizzare una foto di un sito Web tramite URL in diversi browser. È veloce, gratuito e ti offre un paio di opzioni di visualizzazione diverse per confrontare diverse versioni del browser.
Browsershots.org è la stessa idea di Adobe BrowserLab ma con diverse differenze. Puoi testare più browser su più piattaforme con più opzioni come screenshot, intensità del colore, javascript, flash, ecc. Lo svantaggio è che il servizio è un po 'più lento (a volte troppo lento) e non è altrettanto bello di un'interfaccia utente.
Se non hai letto "25 Essential Web Services for Designers", dovresti. Ha alcuni grandi servizi che è come ho scoperto su Browsercam.
Browsercam è fondamentalmente la stessa cosa di Browsershot ma è un servizio a pagamento ma offre funzionalità più approfondite e presumo risultati più rapidi, anche se non l'ho ancora usato.
Così il gioco è fatto. Diversi modi per convalidare e testare il tuo lavoro su Windows e Mac. Se stai inviando un modello a Theme Forest ora non hai scuse per errori di convalida o incompatibilità con il browser. La maggior parte dei modelli che recensisco sono respinti a causa di errori di convalida e problemi del browser che avrebbero dovuto essere risolti prima di essere inviati.
Se utilizzi o conosci uno strumento (o strumenti) per la convalida o il test del browser, faccelo sapere nei commenti.
Accentsconagua