La notion de Responsive Web Design (conception de sites web adaptatifs) regroupe différents principes et technologies mais il indique globalement qu'un site est conçu pour s'adapter aux différentes tailles d'écran et aux différents terminaux permettant d'afficher le site (navigateur, tablette, mobile, télé connectée, ...)
Source : http://fr.wikipedia.org/wiki/Responsive_Web_Design
Insérez ce code dans le header de votre page pour rediriger vers un site spécifique
Dans la page HTML
Dans le fichier CSS :
Tutoriel vidéo : comment utiliser les media queries dans vos fichiers CSS pour adapter vos designs aux différents médias qui peuvent être utilisé pour naviguer sur votre site.
Comprendre le Viewport dans le Web mobile
Le Viewport désigne schématiquement la surface de la fenêtre du navigateur. Cependant, la notion de viewport sur un appareil mobile est différente de celle sur un écran de bureau : sur mobile, le navigateur ne dispose pas de "fenêtre" réelle, ni de barres de défilement car tout est prévu pour naviguer de manière tactile.
La suite sur Alsacréations...
En complément, ce tuto vidéo d'Elephorm
The responsinator
Un émulateur de smartphones ou de tablettes.
En fait, cela permet juste de voir le rendu
d'un site internet dans
différentes
configurations d'écran.
NB : iPad et iPhone acceptent les animations flash.
Adaptive Images
Deliver small images to small devices
Une méthode pour retailler les images afin qu'elles s'adaptent à l'écran.
jQuery mobile
Une librairie, presque un framework, pour construire vos sites pour les mobiles.
Responsive Nav : un menu responsive
Responsive Webdesign : 30 exemples de sites web adaptables
Le site du BonCoin dédié aux mobiles
Le boncoin.fr a fait le choix de 2 sites séparés, l'un pour être vu sur un ordinateur et l'autre sur mobile, accompagnés de 2 applications : l'une pour Android et l'autre pour IPhone.