eclaireur.net

WebDesign & Entrepreneur 2.0

"Les roses poussent parmi les épines." - Proverbe latin

Développer un site internet avec du responsive design

Qu'est-ce qui ce cache derrière ce nouveau mot à la mode, comment créer un site web qui propose ce genre de fonctionnalité ? Ce tutoriel explique les concepts et leurs limites, et vous guidera à travers les étapes de base pour créer un site qui s'adapte aux différentes tailles d'écrans.

Le responsive design est une manière de concevoir les sites internet afin qu'ils s'adaptent à tous les types d'écran. En effet au vue du nombre croissant d'appareils différents (tablettes, smartphone, ... ) et leurs écrans plus petits que les écrans d'ordinateurs, il devenait indispensable de palier à ce problème. Dans ces pages réactives les éléments (textes, graphiques...) deviennent réactifs et peuvent changer de taille en fonction de la taille d'écran en utilisant les feuilles de styles CSS (CSS3) et leurs media queries (on y reviendra dans l'article).

Voici quelques unes des différentes tailles d'écrans que nous sommes amenés à rencontrer:

  • 240 x 320 (petit téléphone)
  • 320 x 480 (iPhone)
  • 480 x 640 (petite tablette)
  • 768 x 1024 (iPad - Portrait)
  • 1024 x 768 (iPad - Paysage)

Exemple de site avec du responsive design

Développer un site internet avec du responsive design
voir une galerie de site développé avec du responsive design, un autre showcase

Pour ceux qui veulent en savoir plus sur les perspectives à envisager je vous invite à lire l'article de Fred Cavazza sur le sujet : Le responsive design à l’assaut des terminaux mobiles. Nous allons nous intéresser à son intégration.

Pré-requis

On oublie le code javascript pour une fois, en revanche il est nécessaire de le tester sur les nouvelles versions de navigateurs (IE9, Firefox 4, Chrome 11, Opera 11...). Les vieux navigateurs (ie6, ie7, ie8, safari 3.2...) ne supportent pas les CSS queries, je vous laisse regarder la liste des navigateurs à proscrire. ... lire la suite de cet article »

Tags: , , , , , , ,

Internet gratuit cela va bientôt être possible à Bordeaux !

Vous avez bien lu Bordeaux sera la première ville française à adopter le wifi de la société de télécommunications espagnole Gowex. Après Madrid, Buenos Aires, Naijing (en Chine) voici le tour de Bordeaux. Paris et d’autres villes françaises proposent jusqu’à présent uniquement un WIFI gratuit dans certains Parcs et lieux publics.

gowex-bordeaux-reseau

La municipalité de Bordeaux va équiper ses rues et bâtiments publics d’un réseau wifi complètement ouvert et gratuit. Les 250 000 habitants de Bordeaux (et les visiteurs de passage) pourront se connecter (après une brève inscription) sur le réseau Wifi de la ville à partir de leur smartphone, tablette ou ordinateur équipé afin de bénéficier d’un accès wifi gratuit.

Il y aura également un accès Premium pour les plus gourmands qui permettra une vitesse jusqu’à 6 Mbps. Il est clair que la France fait parti des pays dans le monde où l’on est le mieux loti pour le rapport qualité/prix de nos connexions internet (une des moins chère au monde). De plus habitant Bordeaux, je ne vous cache pas que j’ai eu ce matin une agréable surprise en apprenant cette nouvelle. Je vous ferai part de mes impressions lors de mes premières connexions… gratuites !

Tags: ,

Alexis Mons : Darwinisme – Mutez !

A l’occasion de la 7eme édition des Rencontres nationales eTourisme qui se déroulaient en Aquitaine (à Pau, Palais Beaumont), les 25 et 26 octobre dernier, plusieurs intervenants ont pu échanger sur les récentes innovations et stratégies touristiques liées avec le développement des usages du web et des technologies numériques.

Mais la vidéo qui a retenu mon attention sort du cadre du tourisme et traite d’internet dans sa globalité. Nous prenons de la hauteur (dixit Alexis Mons l’intervenant) par rapport au web et son usage. Je vous encourage à prendre 15 minutes de votre temps pour regarder cette vidéo qui est particulièrement enrichissante.

Tags: , , ,

Auteur

David Marchesson est freelance développeur web & webdesigner. Il va bientôt se lancer dans l'univers des entrepreneurs Web. Il adore le net, les bonnes idées et parler de lui à la 3eme personne. Ce site sera sa balise dans cette vie digitale.

Suivez ce blog

Si ce blog vous plait, abonnez-vous. Ce flux RSS permet de recevoir en utilisant un lecteur les dernières nouvelles de ce site.

Recevez les billets par email

Vos réactions

  • Franck Quintana: Sur le fond, très bonne nouvelle ! D’autres villes feraient bien de s’en inspirer.
  • Franck Quintana: « connection & raquo; s’écrit « connexion &r aquo; en...
  • Maunel: Interessant, j’avais un peu de mal avec la notion de framework css mais après avoir jeté un oeil ça...
  • pako69: Bonjour, Merci pour cette astuce, en revanche depuis les mises à jour récentes de Mail, le chemin...
  • Jean Louis DARRIÈRE: Bonsoir. J’ai particulièrement aimé votre démonstration mais je dois faire une erreur...
  • Marina: les plugins Jerom’s ne sont pas compatibles avec la dernière version de wordpress….dommage!

Partenaires

Dropbox, 2go d'espace de stockage gratuitDeveloppeur Freelance web developpement webdesigner
Fermer
E-mail It

Haut de page