Using the right tools can save a lot of time. Here’s a list of tools, code snippets, libraries, references and websites I actively use in my projects. Note that this list constantly evolves as new techniques and standards emerge.

Last updated: Oct 1st, 2016

Boilerplate

Normalize.css
Makes browsers render all elements more consistently and in line with modern standards. It precisely targets only the styles that need normalizing.

Code Snippet: Resetting Tags

body, div, h1, h2, h3, h4, h5, h6, p, blockquote, pre, dl, dt, dd, ol,  ul, li, fieldset, form, label, legend, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section {
	margin: 0;
	padding: 0;
	border: 0;
}

Code Snippet: Resetting Images

figure img,
figure object,
figure embed,
figure video {
	max-width: 100%;
	display: block;
}

img {
	border: 0;
	-ms-interpolation-mode: bicubic;
	/* http://css-tricks.com/ie-fix-bicubic-scaling-for-images/ */
}

HTML5 Shiv
Allows to style unknown elements in IE 7 and 8, such as <section> and <header>.

Respond.js
Forces IE7 and 8 to understand media queries.

Hide Adress Bar
Script to hide adress bar on iOS and Android when user scrolls.

 HTML5 Features

Can I Use ?
Search CSS3 properties and HTML5 elements for current support in browsers.

HTML5 Please
Same as Can I Use, but with a clear indication to use or not use a given property or element, natively, with fallback, or with polyfill.

Typography Related

Google Web Fonts
Google’s free fonts repository.

Fonts Squirrel
Another free fonts repository.

Pearsonified’s Typography Calculator
Calculates ideal typography based on font size, line-height, width and character-per-line.

Responsive Design Related

Responsive Wireframes
Presents different layout types and their responsive equivalents.

This is Responsive
A collection of patterns and modules for responsive designs

Zurb’s Responsive Tables
JS and CSS solution to build responsive tables

Responsivepx & QuirkTools Screenfly
Tools to test a site’s responsiveness

Image Related

Picturefill
One of the leading solutions for supporting responsive images, as well as HD/Retina images.

Adaptive Images
Server Side solution to display images according to user’s screen size.

Image Optim
Tool to optimizes image size.

Performance Related

WebPageTest
Very complete tool to test a website performance offering plenty of test cases: desktop, tablet, mobile, WiFi, 3G, location based, etc.

Google PageSpeed
A Chrome extension to analyse the performance of a website, providing useful information about what to do to improve it.

Workflow Related

Vagrantbox.es
List of base boxes for vagrant.

Varying Vagrant Vagrants
Vagrant configuration focused on WordPress development.

Trellis
A LEMP stack for local WordPress development and deployment.

NPM
The most used package manager for NodeJS and front-end development.

Gulp
A task runner for Node and front-end projects.

Webpack
A module bundler, mostly used in recent frameworks like React or Angular2.