Liens utiles

Cette section contient plusieurs sites que j'ai trouvés pour m'aider à programmer. C'est aussi une référence pour moi-même qui me permet de retrouver rapidement certains outils et sites utiles.

HTML / CSS

SitesDescriptions
HTML5 Boilerplate Propose une très bonne base HTML5/CSS/JS pour commencer un site Web. Idéal pour commencer à utiliser le HTML5! Supporte même les vieux navigateurs comme IE6.
How to Center in CSS Outil offrant une façon de centrer verticalement et/ou horizontalement du contenu en CSS. Il suffit de décrire notre situation (hauteur inconnue, etc.) et d'indiquer nos besoins en terme de support des navigateurs.
CSS Almanac Liste les différents sélecteurs et propriétés CSS. Ce site offre des exemples d'utilisation et indique le support des navigateurs.
CSS Reference Liste les différents sélecteurs et propriétés CSS avec des exemples d'utilisation.
Can I Use Ce site donne un tableau comparatif sur les différentes versions de navigateur indiquant le support des technologies (CSS3, HTML5 et bien plus). Site très complet pour vérifier si on peut utiliser, par exemple, les Box-shadow en CSS3 sur les navigateurs cibles qu'on veut supporter.
HTML5 Please Ce site indique un recommendation des composants HTML5/CSS3 selon le support des différentes navigateurs. Il fournit aussi certains fallbacks disponibles.
Skeleton Propose une base HTML/CSS de grille CSS en plus d'offrir une présentation minimale qui s'adapte à l'écran (Responsive Web Design). L'utilisation des @media queries est utilisée afin de présenter différemment la page selon la taille du navigateur. Prêt pour mobiles et tablettes.
Normalize.css Feuille de styles de base. Contrairement aux nombreux reset, Normalize.css se contente de "normaliser" l'affichage pour tous les navigateurs. Ceci évite de devoir styler tous les éléments HTML soi-même.
Responsive Grid System Une autre grille en CSS, mais cette fois, on peut plus facilement insérer son contenu dans les formats multiples de grilles. Contrairement aux autres systèmes de grille qui nous "oblige" à utiliser la largeur maximale de 12 colonnes par ligne, ce qui devient plus difficile de faire entrer 5 colonnes identiques. Ce système-ci est beaucoup plus souple et nous permet de créer des lignes de 2 à 12 colonnes comme on le désire, tout en ayant les mêmes dimensions. Voir l'exemple ici.
OpenWeb Pour apprendre le HTML et le CSS.
Progressive Internet Explorer (CSS3 PIE) Permet d'utiliser certains CSS3 dans Internet Explorer 6 à 8, comme les coins arrondis et les ombres. Ce que Firefox, Safari, Opera et Chrome supportent sans problème.
Stripe Generator Ce site génère un carreau rayé comme on le veut (sens, couleur, ombre, etc.) Ça facilite beaucoup la création d'image de fond de ce style.
Formstone Collection de composants pour front-end (CSS/JS)

Javascript

SitesDescriptions
jQuery jQuery est un excellent framework Javascript pour faciliter les effets visuels et le dynamisme des sites.
Modernizr C'est un script qui détecte si les fonctionnalités CSS3/HTML5 sont supportés dans le navigateur et permet de préparer un fallback dans le cas où ce n'est pas supporté.
Prefix Free Ce script permet d'utiliser les propriétés CSS sans leur préfixe. Il les ajoutera au besoin : webkit- moz- o- ms-
You might not need jQuery C'est un site offrant plusieurs bouts de code JavaScript qui pourraient éviter d'inclure la librairie JQuery dans un site. Ceci permet d'alléger de beaucoup le téléchargement de scripts si on n'a pas besoin de fonctionnalités plus poussées.
JQuery 4u C'est un blogue listant principalement des scripts JQuery intéressants. On y retrouve aussi beaucoup de tutoriels, du code et des articles.
CSS-Tricks C'est un blogue proposant des articles intéressants sur Javascript, CSS, HTML et PHP.

PHP

SitesDescriptions
The PHP Benchmark Benchmark de codes PHP afin d'avoir de meilleures pratiques pour optimiser ses applications.
PHP Freaks Articles, tutoriaux, références PHP/MySQL et scripts.
PHP.net Site officiel de PHP. Il contient toute la documentation sur PHP.
PHP Builder Articles et codes sources en PHP.
PHP Classes Des classes téléchargeables pour PHP.
PHP Snippets Plusieurs exemples de codes en PHP.

Référencement, optimisation, etc.

SitesDescriptions
Fontastic Fontastic offre un service de création de polices de caractères (fonts) personnalisables avec des icônes. L'utilisation d'icônes en fonts permettent l'utilisation d'images vectorielles sur lesquelles on peut ensuite appliquer n'importe quel style CSS.
Web Developer Checklist Ce site offre une liste de vérifications pour optimiser un site.
The Accessibility Cheatsheet Une liste de rappels et techniques pour rendre accessible votre site.
Browser Diet Un guide pour améliorer les performances.
Google - Informations pour webmasters Ce site donne l'information sur le référencement des sites Web par Google.
Google Analytics Setup and Configuration Tool Outil permettant de configurer Google Analytics : recherche, page 404, objectifs et événements.
Guide de Google Analytics Site expliquant plusieurs façons d'intégrer les fonctionnalités de Google Analytics.
Search Engine Tools Ce site donne l'information sur les "robots" des engins de recherches (robots.txt).
Pingdom Tools Cet outil donne une très bonne analyse des sites Web à scanner.

Mobiles

SitesDescriptions
Detect Mobile Browsers Detect Mobile Browsers offre des méthodes pour détecter si un site est vu sur un téléphone. Les scripts sont disponibles en PHP, JQuery, htaccess et plus.
Screensiz.es Une grande base de données sur la taille des différents écrans d'appareils mobiles.
Real Favicon Generator Créateur de favicon avec toutes les versions "nécessaires" pour cibler les appareils mobiles, tout en fournissant le code à insérer dans la page.

Autres

SitesDescriptions
RegExr v2.0 Un site permettant de créer et vérifier des expressions régulières dans une chaîne de caractères.
Ink Un outil de création de courriels responsive. Je m'en sert surtout l'outil d'inliner CSS avant d'envoyer des courriels.
Awesome SVG Plusieurs articles et démos regroupés afin d'apprendre à utiliser les SVG.
Webfont generator Création automatique de fonts dans tous les formats nécessaires pour le Web (woff, otf, etc.) et génère le code à utiliser.
Contrast Ratio Ce site permet de calculer le contraste des 2 couleurs ensembles. Si l'accessibilité de votre site Web vous tient à coeur. Il existe aussi cette application qui fait très bien le travail (PC et Mac)
Hello Color Ce site offre des exemples de couleurs aux contrastes élevés. Pratique si vous n'êtes pas graphiste (comme moi).
Placehold.it Création automatique d'images (place holder) pour débuter un site. Exemple
Dynamic Dummy Image Generator Un autre site de création automatique d'images.
Dummy Image Generator Un autre générateur d'images, mais cette fois, on choisi parmi une banque d'images celles qui nous intéresse en spécifiant les dimensions désirées.
modern.IE Vous permet de télécharger différentes versions d'Internet Explorer à utiliser dans une machine virtuelle, telle que VirtualBox. Idéal pour tester votre site dans de vieux IE ou sur une vieille version de Windows, par exemple.
OverAPI Collection de plusieurs Cheat Sheets (guides).
Open Source Web Design Design de sites Web gratuit.
Plain Pattern Interface pour faciliter la création d'image en pattern.