Créer un site internet responsive webdesign en HTML5
ERROR
00:00
00:00

TUTO Créer un site internet responsive webdesign en HTML5

Benoît Philibert
16,00€

Téléchargement & visionnage illimité

Satisfait ou remboursé

Paiement 100% sécurisé

Dans ce tuto Dreamweaver et HTML5, de plus de 3h nous allons voir comment réaliser un site internet en responsive webdesign. Le responsive webdesign permet au site internet d'être correctement visualiser sur différents supports mobiles comme l'iPhone ou l'iPad ou tout autre type d'écran. À l'aide des media queries nous transformeront littéralement les versions "smartphones" du site internet pour adapter de la meilleure des façons l'utilisation finale de l'internaute.
Nous allons aussi nous efforcer de créer la structure du site en HTML5 valide W3C pour un projet "tourné vers l'avenir" et "dans l'air du temps".

Les points suivant seront développés :

  • HTML5 (header, nav, article, section, footer, hgroup)
  • CSS2 & CSS3
  • Image resizing (propriété box-sizing en CSS3)
  • Appliquer une image en background cover (background-size en CSS3)
  • Réaliser une transition de couleur sur du texte (transition en CSS3)
  • Réaliser une partie contact avec vérification de champs (placeholder, required,... en HTML5)
  • Les médias queries (screen, min et max-width)
  • Les polices texte en em (et non pixel)
  • Les tailles en pourcentage (%)
  • Créer un menu en select pour les versions smartphones (jQuery)

Ce tutoriel demande un niveau intermédiaire en HTML et CSS pour suivre sans encombres celui-ci. Les fichiers sources sont fournis.

Qu’allez-vous apprendre dans ce cours ?

Plan de cours
Leçon 1
Interface partie 1
Leçon 2
Interface partie 2
Leçon 3
Mediaqueries

Plan détaillé du cours

Leçon 1Interface partie 1
1h06m
Leçon 2Interface partie 2
1h13m
Leçon 3Mediaqueries
52m57s

Aperçus

Avis des apprenants

Détail des avis
1 141
Apprenants
53
Commentaires
4,6/5
Note moyenne
5/5
34
4/5
8
3/5
3
2/5
1
1/5
1
Massimo Dell'Utri
Massimo Dell'Utri
Publié le 22/05/2020
Je n'ai pas vu le temps passer, ce tuto est juste génial! J'ai vraiment appris les nouveautés de HTML 5, je vais maintenant les appliquer sur mon site existant, ce qui ne sera pas une mince affaire, mais grâce à ce tuto, je sais quelle direction prendre. Merci!!!
Benoît Philibert
Merci beaucoup :)
Jean-François Leroi
Jean-François Leroi
Publié le 15/09/2016
Super tuto... bravo ! Juste un problème de centrage sur ma tablette samsung retina style... ca tape à gauche... vraiment super, merci.
Benoît Philibert
Merci pour votre retour! À bientôt ;)
Romaric Lidy
Romaric Lidy
Publié le 30/06/2016
Merci Benoit, c'est toujours bon ce que tu fais !
Benoît Philibert
Merci Joe c'est gentil ;)

Vos questions sur le cours

Avec quelle version de logiciel ce tuto est-il compatible ?

Dreamweaver CS6, Dreamweaver CS4, Dreamweaver CS5

Quel est le niveau requis pour suivre ce tuto ?

intermédiaire

Attendez ! 🤗

Accédez à plus de 1351 tutos gratuits

Notre politique de protection des données