Skip to content

Instantly share code, notes, and snippets.

@sunny
Created August 26, 2011 10:43
Show Gist options
  • Save sunny/1173173 to your computer and use it in GitHub Desktop.
Save sunny/1173173 to your computer and use it in GitHub Desktop.
Checklist de projet Web
En amont
- Hébergeur :
- Informations techniques pour se connecter à l'hébergeur :
- Contraintes de langage de programmation, de CMS, de formats, d'applications :
- Contraintes de langage de programmation sur l'hébergeur :
- Contraintes de navigateurs (IE6, Smartphones, tablettes, …) :
- Qui va mettre à jour le site :
- Niveau technique de ceux qui vont mettre à jour le site :
- Contenus qui vont être mis à jour (textes, menus, arborescence, …) :
- Langues :
- Besoin d'HTTPS :
- Outil de statistiques à utiliser (Google Analytics, …) :
Début du projet
- L'arborescence est posée
- Les noms de domaines sont enregistrés
- Les noms de domaines pointent au bon endroit
- On a les certificats HTTPS
- On a un environnement de staging
- Les adresses email sont créées
- On a le code et les informations du système de paiement en ligne
- On a les accès à l'hébergement
- L'hébergement est suffisant en place et performances
- On connaît le nombre de rôles d'administrateurs
- On connaît les noms et emails des futurs administrateurs
- On a une adresse email de contact principal
- On a les méthodes de calcul de chaque calculatrice ou simulateur
- On a les codes de l'outil de statistiques
- Comptes et clef d'APIs créées (Bourse, Twitter, Facebook, Google Maps, …)
- On a les vidéos au plus gros format possible
- On a les droits sur les images
Design
- Les liens hypertextes sont évidents
- Il n'y a pas trop de polices différentes
- Les polices utilisées sont libres ou achetées avec une licence permettant l'utilisation de font-face
- Le texte n'est pas sous 9px
- Tester si le contraste est suffisant (http://colororacle.cartography.ch)
- Les informations critiques ne sont pas uniquement mises en avant grâce à la couleur
- Les liens décrivent la page liée (pas de "cliquer ici")
- On sait si le design est fixe, fluide ou responsive
Fonctionnalités
- Plan du site
- Moteur de recherche
- Il y a un outil de statistiques
- Les téléchargements et liens externes sont trackés dans les statistiques (cf. Entouraje.js)
- S'adapte sur des petits écrans
- Est utilisable sur IE6
- Est utilisable sur smartphone
- Affiche des messages d'erreurs de configuration de base de données
- Feuille de style d'impression
- Google Webmaster Tools (et/ou Yahoo! Site Explorer) installé
- Sitemap XML
- Redirection de toutes les anciennes URLs
- Robots.txt
- Favicône
- Pages sensibles protégées (index of, administration, ...)
- Des alertes sont en place si le site ne réponds plus
- Erreur 404 personnalisée
- Fils de syndication (RSS et Atom)
- Envoyer une page à un ami par email
- Documentation pour les contributeurs
Accessibilité
- Les liens de saut vers le contenu sont visibles
- Tester que le site est accessible au clavier
- Tester que les liens et formulaires ont une séquence de tabs logiques
- Toutes les images ont un contenu alternatif approprié
- L'HTML est sémantique, sépare la présentation de la structure
- La hiérarchie des titres et sections est claire (balises h1 à h6, mais aussi article, section, nav, header, footer, hgroup)
- La langue du document est indiquée sur la balise <html>
- Les tables utilisent des <th>
- Fonctionne bien si on augmente la taille dans le navigateur deux fois
- Les vidéos ont des transcripts et sous-titres
- En CSS toute couleur de fond a une couleur de texte
Utilisabilité
- Les liens visités apparaissent clairement
- Les formulaires ont des labels cliquables
- Les formulaires ont des messages d'erreurs évidents
- Les champs de formulaires requis sont clairement marqués
- Tests utilisateurs faits
- On a une vision claire d'où on se trouve dans l'arborescence sur chaque page (fil d'ariane, menu en surbrillance, …)
SEO
- Les titres des pages reflète le contenu et contient les bons mots clés
- Meta descriptions sur les pages importantes
- Pas de pages en doublon (www et sans, `/` et `/index.php`, etc.)
- Les URLs sont simples et contiennent des mots clefs
Performances
- Le site est testé avec YSlow (compression, expiration, peu de reqûetes HTTP, sprites, JS dans le pied, CDN…)
- Les images à peu de couleurs sont en png-8 et les autres en jpg
- Les images sont compactées sans méta données (smush.it)
- JavaScript et CSS au format compact en production
- Dans l'HTML peu de commentaires et de JavaScript et CSS inline
- Éviter les redirections
- Attributs de hauteur et largeur à toutes les images
- Cookies plus légers possibles
Code
- Le projet est sous versionnement de fichiers
- Doctype correct
- Charset UTF-8 en header et en meta
- Bien structuré
- Bien commenté
- Pas de fichiers inutiles
- Adresses, liste de gens, événements ont des microformats
- Tests unitaires
Sécurité
- Toutes les requêtes sont protégées des injections SQL
- Tout texte affiché est protégé des injections HTML
- Les informations personnelles ne sont pas dans les cookies
- Vérifier les erreurs courantes PHP (http://aymanh.com/checklist-for-securing-php-configuration) ou Rails (http://rubythis.blogspot.com/2006/11/rails-security-checklist.html)
- Le site est facile à mettre à jour
Avant mise en ligne
- Le plan du site reflète bien l'ensemble
- Moteur de recherche pertinant
- Le texte est relu
- Aucun lien mort interne et externe
- Valide HTML
- Valide CSS
- Valide JS
- Accessibilité testée http://wave.webaim.org/
- Pas d'erreurs JS
- Fonctionne avec ou sans www
- Tester sous Internet Explorer (6, 7, 8), Firefox (Windows, Mac), Safari, Chrome
- Tester soux Lynx
- Tester à différentes résolutions
- Tester tous les formulaires
- L'hébergeur est prévenu du lancement
- On a une backup des contenus précédents
- Script de déploiement fonctionne
- Le site est utilisable sans Flash
- Le site est utilisable sans images
- Le site est utilisable sans JavaScript
- Le site est utilisable sans CSS, images, JavaScript et plugins
- Erreurs verbeuses désactivées en production
Mise en ligne
- Aucun lien mort interne
- Redirections des anciennes URLs fonctionnent
- Vérifier performances de production avec YSlow
- Site ajouté à des galeries
- Nos copains sont prévenus
Après mise en ligne
- Les statistiques fonctionnent
- Le site est nettoyé
- Vérifier la position et le format des résultats dans Google, Yahoo!, Bing
- 404 vérifiées dans Google Webmaster Tools
- Statistiques vérifiées et pas de problème particulier de pages qui remontent trop
- On est prévenu des trous de sécurité des outils utilisés
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment