$ 22.00

Tuto Intégration d'un blog responsive avec Bootstrap avec Bootstrap, Dreamweaver, CSS, HTML

$ 22.00

  • Une formation vidéo de 2h14m
  • Téléchargement immédiat et visionnage illimité
  • Satisfait ou remboursé
  • Fichiers sources inclus
  • Découvrez pourquoi vous former avec Tuto.com
Pack Créer un blog responsive
Retrouvez cette formation dans le bundle :

Pack Créer un blog responsive

-12% de réduction

voir les détails du bundle


Voici la suite du tuto Créer le template d'un blog responsive avec Photoshop où nous allons apprendre à intégrer un template Photoshop de site Web à l'aide du framework Bootstrap ce qui vous permettra d'obtenir un blog responsive, c'est à dire qui s'adapte à la taille de l'écran sur lequel il est consulté. Depuis le 21 avril 2015, Google sanctionne en effet les sites qui ne s'adaptent pas aux résolutions d'écrans. Il est donc primordial, voire vital, d'adapter votre blog. Cette formation vous explique comment !

Programme de ce tuto Intégration d'un Blog Responsive avec Bootstrap

Voici les notions qui seront abordées dans cette formation en vidéo :

  • Convertir une police de caractère non standard en otf, woff, eot, svg...
  • Déclarer une police de caractère non standard avec @font-face
  • Créer un menu minifié sur tous les types d'écrans
  • Créer des transitions avec CSS3
  • Gérer la transparence des d'images
  • Animer des boutons au rollover (changement de couleur de fond, rotation des icônes liées aux réseaux sociaux...)
  • Utilisation du last-child
  • Utilisation des balises HTML5 (header, nav, aside, footer...)
  • Utilisation des rôles afin d'ajouter du contexte aux éléments de la sémantique
  • Utilisation des media queries pour diminuer le logo en fonction de la résolution
  • Afficher / Masquer des éléments en fonction du terminal (écrans / tablettes / mobiles...)

L'utilisation de Dreamweaver n'est pas obligatoire pour suivre ce tuto. Vous pouvez utiliser votre propre éditeur HTML.
Pour plus d'informations concernant ce cours, je vous invite à visionner l'extrait vidéo. Les fichiers sources sont fournis avec le tuto.

Bon tutoriel et à bientôt pour la suite qui portera sur l'intégration avec WordPress.

Table des matières de cette formation Bootstrap, Dreamweaver, CSS, HTML (durée : 2h14m)

    • Intégration du Header - Logo & navigation 00:29:08
    • Intégration du contenu - Article / Effets / Boutons de navigation 00:39:53
    • Intégration de la sidebar et de ses modules 00:35:55
    • Intégration du footer 00:04:55
    • Déclinaison de la single 00:24:34



Formateur : Damien Gallez

Damien Gallez a publié 98 tutoriels et obtenu une note moyenne de 4,7/5 sur 29 117 tutoriels vendus. Damien Gallez est un formateur certifié tuto.com. Voir les autres formations de Damien Gallez

5,0
note moyenne

7
avis laissés
5 étoiles
7
4 étoiles
0
3 étoiles
0
2 étoiles
0
1 étoile
0
  • 5
    avis de redouane711 laissé le 02/07/2016
    Très bon tuto, une fois de plus. Le formateur est énergique et nous guide tout au long, pour obtenir un résultat pro qui convaincra les plus chipoteurs parmi vos connaissances.

  • 5
    avis de membre-1984 laissé le 28/09/2015
    Exactement ce que je recherchais! Merci, ça simplifie beaucoup ma vision de Bootstrap!

  • 5
    avis de davidcorreia laissé le 17/06/2015
    Excellent comme toujours avec Damien !!! J'ai particulièrement apprécié les détails donnés au sujet des classes de la navbar

  • Avec quelles versions de logiciels ce tuto est-il compatible ?
    Bootstrap 3.3.4, Dreamweaver CC
  • Quel est le niveau requis pour suivre ce tuto ?
    intermédiaire
  • Est-ce que vous allez mettre la suite pour l'intégration WordPress svp ?
    Bonjour oui l'intégration avec Wordpress est prévue dans pas longtemps
accédez à plus de 1559 tuto gratuits


non, je ne veux pas me former gratuitement