Création et montage HTML / CSS d'un thème E-Commerce
ERROR
00:00
00:00

TUTO Création et montage HTML / CSS d'un thème E-Commerce

Damien Gallez
20,00€

Téléchargement & visionnage illimité

Satisfait ou remboursé

Paiement 100% sécurisé

Nous allons apprendre à créer un thème de site qui pourra être intégré directement dans votre CMS Wordpress. Vous avez l'intention de vendre vos produits, vos créations sur Internet ? Ce tuto est fait pour vous !
Première partie avec Photoshop.

Dans cette première partie, nous allons créer la charte graphique de notre thème sous Photoshop. Nous allons structurer au mieux notre site Internet, placer tous les repères de découpe, les marges etc. afin de faciliter son intégration en HTML5 et CSS3. À travers ce tuto, je vais vous apprendre à bien organiser votre espace de travail, ranger vos calques dans des dossiers (header, contenu, footer...).
Nous définirons un code couleur qui sera utilisé sur toutes les pages du site. Nous ne déclinerons pas les autres pages, car il sera très facile de modifier leur contenu via Wordpress.
Deuxième partie avec Dreamweaver.

Dans cette deuxième partie, nous allons monter en HTML5 et CSS3 la maquette graphique Photoshop sous Dreamweaver. Nous apprendrons plein de petites astuces pour dynamiser et animer notre site Internet grâce au CSS3. Notre menu sera toujours apparent grâce au Javascript (pratique quand l'internaute scroll vers le bas, son panier sera toujours visible !).
Nous déclinerons ici, la page blog, afin d'avoir à l'arrivée, une page d'accueil (qui nous servira de modèle pour les autres pages du site) et une page blog pour nos articles.
Le reste des pages et la boutique seront directement créés dans un prochain tuto centré essentiellement sur Wordpress.

Note : vous pouvez suivre cette formation même si vous n'avez pas l'intention de créer une boutique en ligne. Vous pourrez remplacer la partie e-commerce par une autre page.
Bon tuto :)

Qu’allez-vous apprendre dans ce cours ?

Plan de cours
Leçon 1
Création de la maquette sous Photoshop
Leçon 2
Maquette Photoshop Suite
Leçon 3
Partie 1
Leçon 4
Partie 2
Leçon 5
Partie 3
Leçon 6
Partie 4
Leçon 7
Partie 5

Plan détaillé du cours

Leçon 1Création de la maquette sous Photoshop
27m47s
Leçon 2Maquette Photoshop Suite
24m21s
Leçon 3Partie 1
23m13s
Leçon 4Partie 2
23m07s
Leçon 5Partie 3
22m36s
Leçon 6Partie 4
25m54s
Leçon 7Partie 5
22m02s
Leçon 8Partie 6
30m38s

Aperçus

Avis des apprenants

Détail des avis
295
Apprenants
11
Commentaires
5/5
Note moyenne
5/5
9
4/5
0
3/5
0
2/5
0
1/5
0
Membre-7190-7560
Membre-7190-7560
Publié le 26/10/2016
Tutoriel très bien expliqué et facile à suivre pour faire son propre thème.
Redouane Guechoud
Redouane Guechoud
Publié le 02/07/2016
On progresse bien avec ce formateur. On a toujours droit à des chartes graphiques au top, ce qui différencie Damien Gallez d'autres formateurs, aussi bons que lui, mais qui font l'impasse sur la beauté du site. Pleinement satisfait du résultat.
Samih Bounouar
Samih Bounouar
Publié le 01/07/2016
Belle progression à travers ce tuto. Au top !

Vos questions sur le cours

Avec quelles versions de logiciels ce tuto est-il compatible ?

Photoshop CC, Dreamweaver CC

Attendez ! 🤗

Accédez à plus de 1351 tutos gratuits

Notre politique de protection des données