SlideShare une entreprise Scribd logo
Laurent Mottet - www.nakatomi-formation.be
Création d’un site Web

                         Les différentes étapes pour
                            la création d’un site web



                                               Laurent Mottet
                                               Nakatomi-formation.be
Définition du projet




                                                                                                                        Laurent Mottet - www.nakatomi-formation.be
Création d’un site Web

                                                             Définition du projet



                                                                                     Détermination
                                 Découverte des besoins      « Enquêtes               du budget

                                                                                    Comptabilisation
                                Identification du personas   « Enquêtes
                                                                                      des heures


                                                                                        Définition
                                 Définition des objectifs
                                                                                        des délais

                                                                                        Création
                                     Référencement                                     des équipes

                                                                                    Création d’outils
                                                                                      collaboratifs      « Formations


                                     Rapport d’audit                                  Réalisation du
                                                                                    cahier des charges
Développement de la structure du site.




                                                                                                                Laurent Mottet - www.nakatomi-formation.be
Création d’un site Web

                                                    Structure du site



                                                        Niveau
                                                                        « référencement
                                                      du contenu

                                                       Récolte
                                                     des contenus

                                                       Planning
                                     Validation »
                                                     de la livraison

                                                                                 Niveau
                                                                                 du site

                                                                              Arborescence    « référencement


                                                                               Présentation   « Validation
Développement de la structure du site.




                                                                                                                           Laurent Mottet - www.nakatomi-formation.be
Création d’un site Web

                                                                     Planning
                                                    Validation »
                                                                   de la livraison

                                                                                            Niveau
                                                                                            du site

                                                                                          Arborescence   « référencement


                                                                                          Présentation   « Validation


                                                                      Niveau
                                                                     des pages

                                                                     Wireframe       « référencement


                         Légende :
                         
                          Validation »   Présentation
                         Wireframe : plan filaire
Développement graphique et ergonomique




                                                                                                                    Laurent Mottet - www.nakatomi-formation.be
Création d’un site Web

                                                          Structure du site
                                                      Développement graphique



                                                            Trendboard


                                       Validation »         Présentation


                                                             Définition
                                                            de la charte

                                                              Création
             Maquette
                                  « Positionnement
                                                          du projet de page       fonctionnelle

                                       Validation »         Présentation        Tests fonctionnels   « Validation



                                                            Déclinaisons
                                                          du projet de page
Développement graphique et ergonomique




                                                                                                          Laurent Mottet - www.nakatomi-formation.be
Création d’un site Web


                                   Validation »     Présentation      Tests fonctionnels   « Validation



                                                    Déclinaisons
                                                  du projet de page

                                                     Création
                                                  du modèle html


                                                     Validation


                                                      Définition
                                                     de la charte
Développement technique




                                                                                                                    Laurent Mottet - www.nakatomi-formation.be
Création d’un site Web

                                                          Développement technique



                                                               Installation
                                                                 du CMS

                                          Création des
          Création
          Installation
                                          applications         des modèles       des modules CMS

                                                                Validation
                                                                technique

                                                               Mise en page
                                                               du contenu

                                         Encodage des 
           Création
       Encodage par
     Encodage par
                         Validation »
                                        pages techniques      de la navigation      l’agence          le client

                                        • 404
                                                                                                     Formation
                                        • plan de site
                                        • ...
Développement technique




                                                                                                                                         Laurent Mottet - www.nakatomi-formation.be
Création d’un site Web
                                                            Mise en page
                                                            du contenu

                                         Encodage des 
        Création
        Encodage par
     Encodage par
                         Validation »
                                        pages techniques   de la navigation       l’agence          le client

                                        • 404
                                                                                                    Formation
                                        • plan de site
                                        • ...

                                                                                 Traitement
                                                                                 des médias




                                                               Encodage 
       Encodage des
        Encodage
                                                                                                                          « Validation
                                                           d’un contenu type     applications        des pages

                                                           • home-page
        • catalogue
       • historique
                                                           • contact           • galerie photos   • conditions de vente


                                                                 Test
Développement technique




                                                                                                 Laurent Mottet - www.nakatomi-formation.be
Création d’un site Web

                                                              Test




                                                          Mise en ligne   « Validation

                                                          Installation
                                                                          « Formation
                                                              GA


                                                         Référencement

                                                           Validation
                                                           du livrable

                                                                                    Suivi
                         Légende :
                       Facturation           avec le client
                         
                         GA : Google Analytics
                         CMS : Gestionnaire de contenu
Laurent Mottet - www.nakatomi-formation.be
Création d’un site Web

                         Contact	
                                
                         	          www.nakatomi-formation.be




                                                        Laurent Mottet
                                                                      
                                                laurent@nakatomi.be
                                                twitter.com/nakatomi

Contenu connexe

En vedette

En vedette (6)

Audit de site web
Audit de site webAudit de site web
Audit de site web
 
Architecture de site web
Architecture de site webArchitecture de site web
Architecture de site web
 
Typographie pour le Web
Typographie pour le WebTypographie pour le Web
Typographie pour le Web
 
Initiation au CSS
Initiation au CSSInitiation au CSS
Initiation au CSS
 
060 arborescence
060   arborescence060   arborescence
060 arborescence
 
Les tendances du webdesign
Les tendances du webdesignLes tendances du webdesign
Les tendances du webdesign
 

Plus de Laurent Mottet

Ergonomie web - les couleurs du e-commerce
Ergonomie web  - les couleurs du e-commerceErgonomie web  - les couleurs du e-commerce
Ergonomie web - les couleurs du e-commerce
Laurent Mottet
 
Ergonomie e-commerce - Fiche produit
Ergonomie e-commerce - Fiche produitErgonomie e-commerce - Fiche produit
Ergonomie e-commerce - Fiche produit
Laurent Mottet
 
Ergonomie e-commerce - Les clés d’entrée pour une fiche produit
Ergonomie e-commerce - Les clés d’entrée pour une fiche produitErgonomie e-commerce - Les clés d’entrée pour une fiche produit
Ergonomie e-commerce - Les clés d’entrée pour une fiche produit
Laurent Mottet
 
Ergonomie e-commerce - Tunnel de conversion
Ergonomie e-commerce - Tunnel de conversionErgonomie e-commerce - Tunnel de conversion
Ergonomie e-commerce - Tunnel de conversion
Laurent Mottet
 
Formation Ergonomie web : le wireframing
Formation Ergonomie web : le wireframingFormation Ergonomie web : le wireframing
Formation Ergonomie web : le wireframing
Laurent Mottet
 
The Features In Adobe Fireworks
The Features In Adobe FireworksThe Features In Adobe Fireworks
The Features In Adobe Fireworks
Laurent Mottet
 
Creating buttons in Adobe Fireworks
Creating buttons in Adobe FireworksCreating buttons in Adobe Fireworks
Creating buttons in Adobe Fireworks
Laurent Mottet
 
The image optimization Adobe Fireworks - 2
The image optimization Adobe Fireworks - 2The image optimization Adobe Fireworks - 2
The image optimization Adobe Fireworks - 2
Laurent Mottet
 
Workspace in Adobe Fireworks
Workspace in Adobe FireworksWorkspace in Adobe Fireworks
Workspace in Adobe Fireworks
Laurent Mottet
 
The image optimization Adobe Fireworks - 1
The image optimization Adobe Fireworks - 1The image optimization Adobe Fireworks - 1
The image optimization Adobe Fireworks - 1
Laurent Mottet
 
Symbol script in Adobe Fireworks
Symbol script in Adobe FireworksSymbol script in Adobe Fireworks
Symbol script in Adobe Fireworks
Laurent Mottet
 

Plus de Laurent Mottet (20)

Formation Mailchimp - Les bases
Formation Mailchimp - Les basesFormation Mailchimp - Les bases
Formation Mailchimp - Les bases
 
Perles construction Créer sa page Facebook
Perles construction Créer sa page Facebook Perles construction Créer sa page Facebook
Perles construction Créer sa page Facebook
 
Ergonomie web : la typographie
Ergonomie web : la typographieErgonomie web : la typographie
Ergonomie web : la typographie
 
MailChimp : comment partager son compte avec des autres utilisateurs?
MailChimp : comment partager son compte avec des autres utilisateurs?MailChimp : comment partager son compte avec des autres utilisateurs?
MailChimp : comment partager son compte avec des autres utilisateurs?
 
Ergonomie web - les couleurs du e-commerce
Ergonomie web  - les couleurs du e-commerceErgonomie web  - les couleurs du e-commerce
Ergonomie web - les couleurs du e-commerce
 
Ergonomie e-commerce - Fiche produit
Ergonomie e-commerce - Fiche produitErgonomie e-commerce - Fiche produit
Ergonomie e-commerce - Fiche produit
 
Ergonomie e-commerce - Les clés d’entrée pour une fiche produit
Ergonomie e-commerce - Les clés d’entrée pour une fiche produitErgonomie e-commerce - Les clés d’entrée pour une fiche produit
Ergonomie e-commerce - Les clés d’entrée pour une fiche produit
 
Ergonomie e-commerce - Tunnel de conversion
Ergonomie e-commerce - Tunnel de conversionErgonomie e-commerce - Tunnel de conversion
Ergonomie e-commerce - Tunnel de conversion
 
Formation Ergonomie web : le wireframing
Formation Ergonomie web : le wireframingFormation Ergonomie web : le wireframing
Formation Ergonomie web : le wireframing
 
Creer et envoyer une newsletter avec Mailchimp
Creer et envoyer une newsletter avec MailchimpCreer et envoyer une newsletter avec Mailchimp
Creer et envoyer une newsletter avec Mailchimp
 
Concevoir une newsletter, une infolettre
Concevoir une newsletter, une infolettreConcevoir une newsletter, une infolettre
Concevoir une newsletter, une infolettre
 
Conception d'une newsletter
Conception d'une newsletterConception d'une newsletter
Conception d'une newsletter
 
Formation référencement - Technique d'indexation d'une page web
Formation référencement - Technique d'indexation d'une page webFormation référencement - Technique d'indexation d'une page web
Formation référencement - Technique d'indexation d'une page web
 
Formation référencement - la recherche des mots-clés pour le SEO
Formation référencement - la recherche des mots-clés pour le SEOFormation référencement - la recherche des mots-clés pour le SEO
Formation référencement - la recherche des mots-clés pour le SEO
 
The Features In Adobe Fireworks
The Features In Adobe FireworksThe Features In Adobe Fireworks
The Features In Adobe Fireworks
 
Creating buttons in Adobe Fireworks
Creating buttons in Adobe FireworksCreating buttons in Adobe Fireworks
Creating buttons in Adobe Fireworks
 
The image optimization Adobe Fireworks - 2
The image optimization Adobe Fireworks - 2The image optimization Adobe Fireworks - 2
The image optimization Adobe Fireworks - 2
 
Workspace in Adobe Fireworks
Workspace in Adobe FireworksWorkspace in Adobe Fireworks
Workspace in Adobe Fireworks
 
The image optimization Adobe Fireworks - 1
The image optimization Adobe Fireworks - 1The image optimization Adobe Fireworks - 1
The image optimization Adobe Fireworks - 1
 
Symbol script in Adobe Fireworks
Symbol script in Adobe FireworksSymbol script in Adobe Fireworks
Symbol script in Adobe Fireworks
 

Dernier

Decret-n°19-10-du-23-janvier-2019-reglementant-lexportation-des-déchets-spéci...
Decret-n°19-10-du-23-janvier-2019-reglementant-lexportation-des-déchets-spéci...Decret-n°19-10-du-23-janvier-2019-reglementant-lexportation-des-déchets-spéci...
Decret-n°19-10-du-23-janvier-2019-reglementant-lexportation-des-déchets-spéci...
zidani2
 

Dernier (12)

Gestion des flux de trésorerie dans les entreprises
Gestion des flux de trésorerie dans les entreprisesGestion des flux de trésorerie dans les entreprises
Gestion des flux de trésorerie dans les entreprises
 
MARTYRS DE TURQUIE – une histoire de persécution chrétienne en Anatolie.pptx
MARTYRS DE TURQUIE – une histoire de persécution chrétienne en Anatolie.pptxMARTYRS DE TURQUIE – une histoire de persécution chrétienne en Anatolie.pptx
MARTYRS DE TURQUIE – une histoire de persécution chrétienne en Anatolie.pptx
 
Présentation Webinaire Cohésion - Concevoir et mettre en place une CMDB, comm...
Présentation Webinaire Cohésion - Concevoir et mettre en place une CMDB, comm...Présentation Webinaire Cohésion - Concevoir et mettre en place une CMDB, comm...
Présentation Webinaire Cohésion - Concevoir et mettre en place une CMDB, comm...
 
Decret-n°19-10-du-23-janvier-2019-reglementant-lexportation-des-déchets-spéci...
Decret-n°19-10-du-23-janvier-2019-reglementant-lexportation-des-déchets-spéci...Decret-n°19-10-du-23-janvier-2019-reglementant-lexportation-des-déchets-spéci...
Decret-n°19-10-du-23-janvier-2019-reglementant-lexportation-des-déchets-spéci...
 
EL KATRY Reem: Proposition de Programme Artistique et Exposition pour les Écoles
EL KATRY Reem: Proposition de Programme Artistique et Exposition pour les ÉcolesEL KATRY Reem: Proposition de Programme Artistique et Exposition pour les Écoles
EL KATRY Reem: Proposition de Programme Artistique et Exposition pour les Écoles
 
PLANNING HEBDO ET CR LYCEE COUDON 21 MAI2024
PLANNING HEBDO ET CR LYCEE COUDON 21 MAI2024PLANNING HEBDO ET CR LYCEE COUDON 21 MAI2024
PLANNING HEBDO ET CR LYCEE COUDON 21 MAI2024
 
Système National de Santé au- Maroc-(2017)."pdf"
Système National de Santé au- Maroc-(2017)."pdf"Système National de Santé au- Maroc-(2017)."pdf"
Système National de Santé au- Maroc-(2017)."pdf"
 
Fiche - Accompagnement du travail coopératif au sein d’une équipe d’enseignan...
Fiche - Accompagnement du travail coopératif au sein d’une équipe d’enseignan...Fiche - Accompagnement du travail coopératif au sein d’une équipe d’enseignan...
Fiche - Accompagnement du travail coopératif au sein d’une équipe d’enseignan...
 
Comment enseigner la langue française en Colombie?
Comment enseigner la langue française en Colombie?Comment enseigner la langue française en Colombie?
Comment enseigner la langue française en Colombie?
 
Webinaire Technologia | DAX : nouvelles fonctions
Webinaire Technologia | DAX : nouvelles fonctionsWebinaire Technologia | DAX : nouvelles fonctions
Webinaire Technologia | DAX : nouvelles fonctions
 
Quitter la nuit. pptx
Quitter        la             nuit.   pptxQuitter        la             nuit.   pptx
Quitter la nuit. pptx
 
Présentation sur les Risques Électriques et Leur Prévention en Algérie
Présentation sur les Risques Électriques et Leur Prévention en AlgériePrésentation sur les Risques Électriques et Leur Prévention en Algérie
Présentation sur les Risques Électriques et Leur Prévention en Algérie
 

Ergonomie web : Les étapes pour la création d'un site web

  • 1. Laurent Mottet - www.nakatomi-formation.be Création d’un site Web Les différentes étapes pour la création d’un site web Laurent Mottet Nakatomi-formation.be
  • 2. Définition du projet Laurent Mottet - www.nakatomi-formation.be Création d’un site Web Définition du projet Détermination Découverte des besoins « Enquêtes du budget Comptabilisation Identification du personas « Enquêtes des heures Définition Définition des objectifs des délais Création Référencement des équipes Création d’outils collaboratifs « Formations Rapport d’audit Réalisation du cahier des charges
  • 3. Développement de la structure du site. Laurent Mottet - www.nakatomi-formation.be Création d’un site Web Structure du site Niveau « référencement du contenu Récolte des contenus Planning Validation » de la livraison Niveau du site Arborescence « référencement Présentation « Validation
  • 4. Développement de la structure du site. Laurent Mottet - www.nakatomi-formation.be Création d’un site Web Planning Validation » de la livraison Niveau du site Arborescence « référencement Présentation « Validation Niveau des pages Wireframe « référencement Légende : Validation » Présentation Wireframe : plan filaire
  • 5. Développement graphique et ergonomique Laurent Mottet - www.nakatomi-formation.be Création d’un site Web Structure du site Développement graphique Trendboard Validation » Présentation Définition de la charte Création Maquette « Positionnement du projet de page fonctionnelle Validation » Présentation Tests fonctionnels « Validation Déclinaisons du projet de page
  • 6. Développement graphique et ergonomique Laurent Mottet - www.nakatomi-formation.be Création d’un site Web Validation » Présentation Tests fonctionnels « Validation Déclinaisons du projet de page Création du modèle html Validation Définition de la charte
  • 7. Développement technique Laurent Mottet - www.nakatomi-formation.be Création d’un site Web Développement technique Installation du CMS Création des Création Installation applications des modèles des modules CMS Validation technique Mise en page du contenu Encodage des Création Encodage par Encodage par Validation » pages techniques de la navigation l’agence le client • 404 Formation • plan de site • ...
  • 8. Développement technique Laurent Mottet - www.nakatomi-formation.be Création d’un site Web Mise en page du contenu Encodage des Création Encodage par Encodage par Validation » pages techniques de la navigation l’agence le client • 404 Formation • plan de site • ... Traitement des médias Encodage Encodage des Encodage « Validation d’un contenu type applications des pages • home-page • catalogue • historique • contact • galerie photos • conditions de vente Test
  • 9. Développement technique Laurent Mottet - www.nakatomi-formation.be Création d’un site Web Test Mise en ligne « Validation Installation « Formation GA Référencement Validation du livrable Suivi Légende : Facturation avec le client GA : Google Analytics CMS : Gestionnaire de contenu
  • 10. Laurent Mottet - www.nakatomi-formation.be Création d’un site Web Contact www.nakatomi-formation.be Laurent Mottet laurent@nakatomi.be twitter.com/nakatomi