SlideShare une entreprise Scribd logo
WST#1 : Mythes et réalités des
projets Web
Sébastien Huillet
Directeur Tribu and Co
Agence Web depuis 2006
1. Cahier des charges
2. Choix du socle applicatif
3. Méthodologie
4. Les étapes de la conception graphique
5. Construction du site
6. Recette et transfert de compétences
7. Hébergement et maintenance
8. Référencement et suivi du site
Les étapes indispensables
Les obligations d'une agence Web
● Conseil et transparence
● Conformité des développements
● Mise à disposition des sources et des droits d'exploitation
● Transfert de compétences
Cahier des charges, le minimum du minimum
● Objectifs et public cible
● Arborescence détaillée
● Liste des fonctionnalités
● Sites référents
● Eléments graphiques
Les livrables, la garantie d'un projet sous contrôle
● Le contrat / le planning
● Les spécifications fonctionnelles
● Les sources graphiques
● Les sources logicielles
● PV de recette
● Manuel d'administration
Choix du socle applicatif
CMS ?
● Autonomie totale
● Pérennité de la solution
● Fonctionnalités natives
● Possibilités d'évolutions
Choix du socle applicatif
Or not CMS ?
● Solution sur-mesure
● Contenu modifiable clairement identifié
● Performances, sécurité, robustesse
Bien choisir un CMS
● Critères objectifs : communauté, réputation
(récompenses et références), politique de mise à jour,
spectre fonctionnel, courbe d'apprentissage.
● Critères subjectifs: L'interface d'administration, les
outils promotionnels (site, vidéos...), les conseils du
beau-frère.
Choix du CMS pour un site « corporate »
● Wordpress
● Joomla
● Drupal
● Typo3
● Et plein d'autres : Ez Publish, Modx, simpleCMS...
Choix du CMS pour un site e-commerce
● Prestashop
● Joomla / virtuemart
● Magento
● Os-commerce
● Et quelques autres : Zen cart, tt_products...
Méthodologie dans la réalisation d'un projet Web
Agile, scrum, sprint et flex
● Intéractivité
● Réactivité
● Adaptativité
● Effet tunnel
● Temps mort
● Delta des développements
Les outils de gestion de projet
● Stylo / bloc-note ou excel
● Sur document plutôt qu'à l’intérieur d'un mail
● Trello, Marqueed, dropbox...
Les étapes dans la réalisation d'un projet Web
● Lancement / spécifications
● Design et ergonomie
● Construction du site
● Recette interne
● Formation
● Réception
Lancement du projet
● Définition des équipes
● Mise en place d'un échéancier
● Mise en place des outils de suivi
● Liste des éléments à fournir par le client
● Installation du logiciel CMS
Les étapes de la création graphique
Ergonomie
● Principes fondamentaux : Bastien et Scapin
● Bon sens et veille internet
● Tests utilisateurs
Boites grises et maquettes filaires
● Répertorier les éléments du site
● Spécifier l'agencement des blocs
● Couverture fonctionnelle Front-end
Les étapes de la création graphique
Design
● Page d'accueil
● Page intérieure type
● Pages spécifiques
Web responsive, mobile first et autres joyeusetés
Construction du site
● Déclinaison des maquettes au format Web
● Mise en place de l'arborescence
● Intégration du contenu classique
● Développement des fonctionnalités
● Tests unitaires et validation client
Déclinaison des maquettes au format Web
● PSD 2 HTML, une étape essentielle
● Balisage sémantique
● Respecter l'accessibilité
● Avoir du style
● Utiliser les technologies récentes
● Une approche non-destructive
Intégration du contenu
● Mise en place d'un contenu type mis à disposition.
● Spécifier les styles généraux (Hn, listes, tableaux...)
● Respecter l'accessibilité
● Mettre en place les bonnes pratiques du référenceur
Développement des fonctionnalités
● Spécifications et maquettes filaires
● Adaptation des fonctionnalités natives
● Développer sans toucher au noyau
● Tests unitaires et validation client
Recettes et transfert de compétences
Recette interne à l'agence
● Respect de l'accessibilité
● Tests multi-plateformes
● Vérification des contenus
Transfert de compétences
Formation et livrables
● Minimum 1 jour de formation
● Manuel utilisateur
● Fiches pratiques
● Bonnes pratiques SEO et accessilbilté
● Les bons réflexes
Recette Client
Tests Front-end & Back-end
Tester la qualité du site
● Google Page speed
● Validateur W3C
● Barre Web developer
Tester le référencement et l'accessibilité du site
Maintenance et hébergement
Maintenance
● Garantie / assistance
● Mise à jour du système
● Mise à jour du contenu
Hébergement
● Dédié / Mutualisé
● Ovh vs Agence Web
Attention à votre
nom de domaine
Référencement SEO / SEA
Le référencement c'est du temps...
● Optimisation du site, optimisation des campagnes
● Mise à jour des contenus
● Création de publications, CP, annuaires...
● Suivi des évolutions
Et le temps...
● C'est de l'argent
● Ou moins de temps pour faire autre chose
Merci de votre participation !
Merci à benoît pour ces clip-arts magnifiques

Contenu connexe

Tendances

Java Server Faces - Beyond
Java Server Faces - BeyondJava Server Faces - Beyond
Java Server Faces - Beyond
Mamadou Lamine Ba
 
Twitter Bootstrap par Antoine Guédès et Cédric Dussart
Twitter Bootstrap par Antoine Guédès et Cédric DussartTwitter Bootstrap par Antoine Guédès et Cédric Dussart
Twitter Bootstrap par Antoine Guédès et Cédric Dussart
La FeWeb
 
Soutenance Elhadj Bah | Diplôme d'ingénieur de conception en Informatique | E...
Soutenance Elhadj Bah | Diplôme d'ingénieur de conception en Informatique | E...Soutenance Elhadj Bah | Diplôme d'ingénieur de conception en Informatique | E...
Soutenance Elhadj Bah | Diplôme d'ingénieur de conception en Informatique | E...
Elhadj Mamadou Aliou BAH
 
Soutenance de stage messerlin
Soutenance de stage messerlinSoutenance de stage messerlin
Soutenance de stage messerlinGaut' Xp
 
Certification mcsd web application développeur .net mcsd
Certification mcsd web application   développeur .net mcsdCertification mcsd web application   développeur .net mcsd
Certification mcsd web application développeur .net mcsd
EGILIA Learning
 
Human talks-bootstrap
Human talks-bootstrapHuman talks-bootstrap
Human talks-bootstrap
Mathieu Le Gac
 
Introduction à Zend Framework
Introduction à Zend FrameworkIntroduction à Zend Framework
Introduction à Zend Framework
Gauthier Delamarre
 
Présentation de Kirby CMS
Présentation de Kirby CMSPrésentation de Kirby CMS
Présentation de Kirby CMS
Gilles Vauvarin
 
Mise en place du Chattoon en PHP
Mise en place du Chattoon en PHPMise en place du Chattoon en PHP
Mise en place du Chattoon en PHP
Armel Diamesso
 
Les performances Web mobile
Les performances Web mobileLes performances Web mobile
Les performances Web mobile
Jean-Pierre Vincent
 
Zend Framework 2.0 - Le gestionnaire de modules
Zend Framework 2.0 - Le gestionnaire de modulesZend Framework 2.0 - Le gestionnaire de modules
Zend Framework 2.0 - Le gestionnaire de modules
Vincent Blanchon
 
Présentation du stage echatibi sofian
Présentation du stage echatibi sofianPrésentation du stage echatibi sofian
Présentation du stage echatibi sofian
Sofiane Echatibi
 
Migration de technologie J2EE vers PHP à M6Web
Migration de technologie J2EE vers PHP à M6WebMigration de technologie J2EE vers PHP à M6Web
Migration de technologie J2EE vers PHP à M6Web
Olivier NOEL
 

Tendances (13)

Java Server Faces - Beyond
Java Server Faces - BeyondJava Server Faces - Beyond
Java Server Faces - Beyond
 
Twitter Bootstrap par Antoine Guédès et Cédric Dussart
Twitter Bootstrap par Antoine Guédès et Cédric DussartTwitter Bootstrap par Antoine Guédès et Cédric Dussart
Twitter Bootstrap par Antoine Guédès et Cédric Dussart
 
Soutenance Elhadj Bah | Diplôme d'ingénieur de conception en Informatique | E...
Soutenance Elhadj Bah | Diplôme d'ingénieur de conception en Informatique | E...Soutenance Elhadj Bah | Diplôme d'ingénieur de conception en Informatique | E...
Soutenance Elhadj Bah | Diplôme d'ingénieur de conception en Informatique | E...
 
Soutenance de stage messerlin
Soutenance de stage messerlinSoutenance de stage messerlin
Soutenance de stage messerlin
 
Certification mcsd web application développeur .net mcsd
Certification mcsd web application   développeur .net mcsdCertification mcsd web application   développeur .net mcsd
Certification mcsd web application développeur .net mcsd
 
Human talks-bootstrap
Human talks-bootstrapHuman talks-bootstrap
Human talks-bootstrap
 
Introduction à Zend Framework
Introduction à Zend FrameworkIntroduction à Zend Framework
Introduction à Zend Framework
 
Présentation de Kirby CMS
Présentation de Kirby CMSPrésentation de Kirby CMS
Présentation de Kirby CMS
 
Mise en place du Chattoon en PHP
Mise en place du Chattoon en PHPMise en place du Chattoon en PHP
Mise en place du Chattoon en PHP
 
Les performances Web mobile
Les performances Web mobileLes performances Web mobile
Les performances Web mobile
 
Zend Framework 2.0 - Le gestionnaire de modules
Zend Framework 2.0 - Le gestionnaire de modulesZend Framework 2.0 - Le gestionnaire de modules
Zend Framework 2.0 - Le gestionnaire de modules
 
Présentation du stage echatibi sofian
Présentation du stage echatibi sofianPrésentation du stage echatibi sofian
Présentation du stage echatibi sofian
 
Migration de technologie J2EE vers PHP à M6Web
Migration de technologie J2EE vers PHP à M6WebMigration de technologie J2EE vers PHP à M6Web
Migration de technologie J2EE vers PHP à M6Web
 

Similaire à Mythes et réalités des projets Web (Webschool tours)

"Réussir son projet web... ou pas !" - Webschool Tours, 09/2015
"Réussir son projet web... ou pas !" - Webschool Tours, 09/2015"Réussir son projet web... ou pas !" - Webschool Tours, 09/2015
"Réussir son projet web... ou pas !" - Webschool Tours, 09/2015
webschooltours
 
Saas Libre
Saas LibreSaas Libre
Saas Libre
grolland
 
Accéder au développement Dot.Net et Asp.Net
Accéder au développement Dot.Net et Asp.NetAccéder au développement Dot.Net et Asp.Net
Accéder au développement Dot.Net et Asp.Net
Frédéric Vandenbriele
 
Realiser un-site-internet-chef-de-projet-web
Realiser un-site-internet-chef-de-projet-webRealiser un-site-internet-chef-de-projet-web
Realiser un-site-internet-chef-de-projet-web
Jean-Baptiste Plantin
 
Les étapes clés d'un projet web
Les étapes clés d'un projet webLes étapes clés d'un projet web
Les étapes clés d'un projet web
Communauté de communes du Pays de Lunel
 
Comment récupérer un projet Web pourri ... et réussir à travailler dessus.
Comment récupérer un projet Web pourri ... et réussir à travailler dessus.Comment récupérer un projet Web pourri ... et réussir à travailler dessus.
Comment récupérer un projet Web pourri ... et réussir à travailler dessus.
Guillaume RICHARD
 
Methodologie projet
Methodologie projet Methodologie projet
Methodologie projet
Benjamin ACHAB
 
Solutions Web « prêtes à porter » avec WordPress
Solutions Web « prêtes à porter » avec WordPressSolutions Web « prêtes à porter » avec WordPress
Solutions Web « prêtes à porter » avec WordPress
Stéphane Plante
 
Vol WAX 2024 - la chaîne de valeur propulsée par le Platform Engineering chez...
Vol WAX 2024 - la chaîne de valeur propulsée par le Platform Engineering chez...Vol WAX 2024 - la chaîne de valeur propulsée par le Platform Engineering chez...
Vol WAX 2024 - la chaîne de valeur propulsée par le Platform Engineering chez...
Frederic Leger
 
Enib cours c.a.i. web - séance #1 - html5 css3-js - 1
Enib   cours c.a.i. web - séance #1 - html5 css3-js - 1Enib   cours c.a.i. web - séance #1 - html5 css3-js - 1
Enib cours c.a.i. web - séance #1 - html5 css3-js - 1Horacio Gonzalez
 
[Scrum Day 2011] Outillage Agile dans un environnement Microsoft
[Scrum Day 2011] Outillage Agile dans un environnement Microsoft[Scrum Day 2011] Outillage Agile dans un environnement Microsoft
[Scrum Day 2011] Outillage Agile dans un environnement MicrosoftChristophe HERAL
 
Customer Show case : Mise en place d’une solution de gestion de projet avec l...
Customer Show case : Mise en place d’une solution de gestion de projet avec l...Customer Show case : Mise en place d’une solution de gestion de projet avec l...
Customer Show case : Mise en place d’une solution de gestion de projet avec l...
Microsoft Ideas
 
Exemple de mise en place d'une solution EPM 2013
Exemple de mise en place d'une solution EPM 2013Exemple de mise en place d'une solution EPM 2013
Exemple de mise en place d'une solution EPM 2013
Charbel Abdo
 
Drupal un projet comme les autres ? Drupalcamp Paris 2013
Drupal un projet comme les autres ? Drupalcamp Paris 2013Drupal un projet comme les autres ? Drupalcamp Paris 2013
Drupal un projet comme les autres ? Drupalcamp Paris 2013
Artusamak
 
RA et CCDS - Séance 1.pptx
RA et CCDS - Séance 1.pptxRA et CCDS - Séance 1.pptx
RA et CCDS - Séance 1.pptx
testuser715939
 
Klee Group Présentation Urbanisation DIRISI
Klee Group Présentation Urbanisation DIRISIKlee Group Présentation Urbanisation DIRISI
Klee Group Présentation Urbanisation DIRISI
Samuel Mingot
 
inext café #03 - Automatiser ses processus métier avec SharePoint et Nintex
inext café #03 - Automatiser ses processus métier avec SharePoint et Nintexinext café #03 - Automatiser ses processus métier avec SharePoint et Nintex
inext café #03 - Automatiser ses processus métier avec SharePoint et Nintex
Alexandre David
 
Esg lesson 4
Esg lesson 4Esg lesson 4
Esg lesson 4
Alban Oujagir
 
Enib cours c.a.i. web - séance #6 : autour de la webapp
Enib   cours c.a.i. web - séance #6 : autour de la webappEnib   cours c.a.i. web - séance #6 : autour de la webapp
Enib cours c.a.i. web - séance #6 : autour de la webappHoracio Gonzalez
 

Similaire à Mythes et réalités des projets Web (Webschool tours) (20)

"Réussir son projet web... ou pas !" - Webschool Tours, 09/2015
"Réussir son projet web... ou pas !" - Webschool Tours, 09/2015"Réussir son projet web... ou pas !" - Webschool Tours, 09/2015
"Réussir son projet web... ou pas !" - Webschool Tours, 09/2015
 
Saas Libre
Saas LibreSaas Libre
Saas Libre
 
Accéder au développement Dot.Net et Asp.Net
Accéder au développement Dot.Net et Asp.NetAccéder au développement Dot.Net et Asp.Net
Accéder au développement Dot.Net et Asp.Net
 
Realiser un-site-internet-chef-de-projet-web
Realiser un-site-internet-chef-de-projet-webRealiser un-site-internet-chef-de-projet-web
Realiser un-site-internet-chef-de-projet-web
 
Les étapes clés d'un projet web
Les étapes clés d'un projet webLes étapes clés d'un projet web
Les étapes clés d'un projet web
 
Comment récupérer un projet Web pourri ... et réussir à travailler dessus.
Comment récupérer un projet Web pourri ... et réussir à travailler dessus.Comment récupérer un projet Web pourri ... et réussir à travailler dessus.
Comment récupérer un projet Web pourri ... et réussir à travailler dessus.
 
Methodologie projet
Methodologie projet Methodologie projet
Methodologie projet
 
Solutions Web « prêtes à porter » avec WordPress
Solutions Web « prêtes à porter » avec WordPressSolutions Web « prêtes à porter » avec WordPress
Solutions Web « prêtes à porter » avec WordPress
 
Vol WAX 2024 - la chaîne de valeur propulsée par le Platform Engineering chez...
Vol WAX 2024 - la chaîne de valeur propulsée par le Platform Engineering chez...Vol WAX 2024 - la chaîne de valeur propulsée par le Platform Engineering chez...
Vol WAX 2024 - la chaîne de valeur propulsée par le Platform Engineering chez...
 
Enib cours c.a.i. web - séance #1 - html5 css3-js - 1
Enib   cours c.a.i. web - séance #1 - html5 css3-js - 1Enib   cours c.a.i. web - séance #1 - html5 css3-js - 1
Enib cours c.a.i. web - séance #1 - html5 css3-js - 1
 
[Scrum Day 2011] Outillage Agile dans un environnement Microsoft
[Scrum Day 2011] Outillage Agile dans un environnement Microsoft[Scrum Day 2011] Outillage Agile dans un environnement Microsoft
[Scrum Day 2011] Outillage Agile dans un environnement Microsoft
 
Customer Show case : Mise en place d’une solution de gestion de projet avec l...
Customer Show case : Mise en place d’une solution de gestion de projet avec l...Customer Show case : Mise en place d’une solution de gestion de projet avec l...
Customer Show case : Mise en place d’une solution de gestion de projet avec l...
 
Exemple de mise en place d'une solution EPM 2013
Exemple de mise en place d'une solution EPM 2013Exemple de mise en place d'une solution EPM 2013
Exemple de mise en place d'une solution EPM 2013
 
Drupal un projet comme les autres ? Drupalcamp Paris 2013
Drupal un projet comme les autres ? Drupalcamp Paris 2013Drupal un projet comme les autres ? Drupalcamp Paris 2013
Drupal un projet comme les autres ? Drupalcamp Paris 2013
 
RA et CCDS - Séance 1.pptx
RA et CCDS - Séance 1.pptxRA et CCDS - Séance 1.pptx
RA et CCDS - Séance 1.pptx
 
Klee Group Présentation Urbanisation DIRISI
Klee Group Présentation Urbanisation DIRISIKlee Group Présentation Urbanisation DIRISI
Klee Group Présentation Urbanisation DIRISI
 
inext café #03 - Automatiser ses processus métier avec SharePoint et Nintex
inext café #03 - Automatiser ses processus métier avec SharePoint et Nintexinext café #03 - Automatiser ses processus métier avec SharePoint et Nintex
inext café #03 - Automatiser ses processus métier avec SharePoint et Nintex
 
Esg lesson 4
Esg lesson 4Esg lesson 4
Esg lesson 4
 
Esg lesson 4
Esg lesson 4Esg lesson 4
Esg lesson 4
 
Enib cours c.a.i. web - séance #6 : autour de la webapp
Enib   cours c.a.i. web - séance #6 : autour de la webappEnib   cours c.a.i. web - séance #6 : autour de la webapp
Enib cours c.a.i. web - séance #6 : autour de la webapp
 

Dernier

COURS D'ADMINISTRATION RESEAU SOUS WINDOWS
COURS D'ADMINISTRATION RESEAU  SOUS WINDOWSCOURS D'ADMINISTRATION RESEAU  SOUS WINDOWS
COURS D'ADMINISTRATION RESEAU SOUS WINDOWS
AlbertSmithTambwe
 
De l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
De l'IA comme plagiat à la rédaction d'une « charte IA » à l'universitéDe l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
De l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
Université de Franche-Comté
 
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
Laurent Speyser
 
Le support de présentation des Signaux 2024
Le support de présentation des Signaux 2024Le support de présentation des Signaux 2024
Le support de présentation des Signaux 2024
UNITECBordeaux
 
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
OCTO Technology
 
PRESENTATION DE L'ACTIVE DIRECTORY SOUS WINDOWS SERVEUR.pptx
PRESENTATION DE L'ACTIVE DIRECTORY SOUS WINDOWS SERVEUR.pptxPRESENTATION DE L'ACTIVE DIRECTORY SOUS WINDOWS SERVEUR.pptx
PRESENTATION DE L'ACTIVE DIRECTORY SOUS WINDOWS SERVEUR.pptx
AlbertSmithTambwe
 
Le Comptoir OCTO - Équipes infra et prod, ne ratez pas l'embarquement pour l'...
Le Comptoir OCTO - Équipes infra et prod, ne ratez pas l'embarquement pour l'...Le Comptoir OCTO - Équipes infra et prod, ne ratez pas l'embarquement pour l'...
Le Comptoir OCTO - Équipes infra et prod, ne ratez pas l'embarquement pour l'...
OCTO Technology
 
Les écrans informatiques au fil du temps.pptx
Les écrans informatiques au fil du temps.pptxLes écrans informatiques au fil du temps.pptx
Les écrans informatiques au fil du temps.pptx
abderrahimbourimi
 
OCTO TALKS : 4 Tech Trends du Software Engineering.pdf
OCTO TALKS : 4 Tech Trends du Software Engineering.pdfOCTO TALKS : 4 Tech Trends du Software Engineering.pdf
OCTO TALKS : 4 Tech Trends du Software Engineering.pdf
OCTO Technology
 

Dernier (9)

COURS D'ADMINISTRATION RESEAU SOUS WINDOWS
COURS D'ADMINISTRATION RESEAU  SOUS WINDOWSCOURS D'ADMINISTRATION RESEAU  SOUS WINDOWS
COURS D'ADMINISTRATION RESEAU SOUS WINDOWS
 
De l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
De l'IA comme plagiat à la rédaction d'une « charte IA » à l'universitéDe l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
De l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
 
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
 
Le support de présentation des Signaux 2024
Le support de présentation des Signaux 2024Le support de présentation des Signaux 2024
Le support de présentation des Signaux 2024
 
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
 
PRESENTATION DE L'ACTIVE DIRECTORY SOUS WINDOWS SERVEUR.pptx
PRESENTATION DE L'ACTIVE DIRECTORY SOUS WINDOWS SERVEUR.pptxPRESENTATION DE L'ACTIVE DIRECTORY SOUS WINDOWS SERVEUR.pptx
PRESENTATION DE L'ACTIVE DIRECTORY SOUS WINDOWS SERVEUR.pptx
 
Le Comptoir OCTO - Équipes infra et prod, ne ratez pas l'embarquement pour l'...
Le Comptoir OCTO - Équipes infra et prod, ne ratez pas l'embarquement pour l'...Le Comptoir OCTO - Équipes infra et prod, ne ratez pas l'embarquement pour l'...
Le Comptoir OCTO - Équipes infra et prod, ne ratez pas l'embarquement pour l'...
 
Les écrans informatiques au fil du temps.pptx
Les écrans informatiques au fil du temps.pptxLes écrans informatiques au fil du temps.pptx
Les écrans informatiques au fil du temps.pptx
 
OCTO TALKS : 4 Tech Trends du Software Engineering.pdf
OCTO TALKS : 4 Tech Trends du Software Engineering.pdfOCTO TALKS : 4 Tech Trends du Software Engineering.pdf
OCTO TALKS : 4 Tech Trends du Software Engineering.pdf
 

Mythes et réalités des projets Web (Webschool tours)

  • 1. WST#1 : Mythes et réalités des projets Web
  • 2. Sébastien Huillet Directeur Tribu and Co Agence Web depuis 2006
  • 3. 1. Cahier des charges 2. Choix du socle applicatif 3. Méthodologie 4. Les étapes de la conception graphique 5. Construction du site 6. Recette et transfert de compétences 7. Hébergement et maintenance 8. Référencement et suivi du site Les étapes indispensables
  • 4. Les obligations d'une agence Web ● Conseil et transparence ● Conformité des développements ● Mise à disposition des sources et des droits d'exploitation ● Transfert de compétences
  • 5. Cahier des charges, le minimum du minimum ● Objectifs et public cible ● Arborescence détaillée ● Liste des fonctionnalités ● Sites référents ● Eléments graphiques
  • 6. Les livrables, la garantie d'un projet sous contrôle ● Le contrat / le planning ● Les spécifications fonctionnelles ● Les sources graphiques ● Les sources logicielles ● PV de recette ● Manuel d'administration
  • 7. Choix du socle applicatif CMS ? ● Autonomie totale ● Pérennité de la solution ● Fonctionnalités natives ● Possibilités d'évolutions
  • 8. Choix du socle applicatif Or not CMS ? ● Solution sur-mesure ● Contenu modifiable clairement identifié ● Performances, sécurité, robustesse
  • 9. Bien choisir un CMS ● Critères objectifs : communauté, réputation (récompenses et références), politique de mise à jour, spectre fonctionnel, courbe d'apprentissage. ● Critères subjectifs: L'interface d'administration, les outils promotionnels (site, vidéos...), les conseils du beau-frère.
  • 10. Choix du CMS pour un site « corporate » ● Wordpress ● Joomla ● Drupal ● Typo3 ● Et plein d'autres : Ez Publish, Modx, simpleCMS...
  • 11. Choix du CMS pour un site e-commerce ● Prestashop ● Joomla / virtuemart ● Magento ● Os-commerce ● Et quelques autres : Zen cart, tt_products...
  • 12. Méthodologie dans la réalisation d'un projet Web Agile, scrum, sprint et flex ● Intéractivité ● Réactivité ● Adaptativité ● Effet tunnel ● Temps mort ● Delta des développements
  • 13. Les outils de gestion de projet ● Stylo / bloc-note ou excel ● Sur document plutôt qu'à l’intérieur d'un mail ● Trello, Marqueed, dropbox...
  • 14. Les étapes dans la réalisation d'un projet Web ● Lancement / spécifications ● Design et ergonomie ● Construction du site ● Recette interne ● Formation ● Réception
  • 15. Lancement du projet ● Définition des équipes ● Mise en place d'un échéancier ● Mise en place des outils de suivi ● Liste des éléments à fournir par le client ● Installation du logiciel CMS
  • 16. Les étapes de la création graphique Ergonomie ● Principes fondamentaux : Bastien et Scapin ● Bon sens et veille internet ● Tests utilisateurs Boites grises et maquettes filaires ● Répertorier les éléments du site ● Spécifier l'agencement des blocs ● Couverture fonctionnelle Front-end
  • 17. Les étapes de la création graphique Design ● Page d'accueil ● Page intérieure type ● Pages spécifiques Web responsive, mobile first et autres joyeusetés
  • 18. Construction du site ● Déclinaison des maquettes au format Web ● Mise en place de l'arborescence ● Intégration du contenu classique ● Développement des fonctionnalités ● Tests unitaires et validation client
  • 19. Déclinaison des maquettes au format Web ● PSD 2 HTML, une étape essentielle ● Balisage sémantique ● Respecter l'accessibilité ● Avoir du style ● Utiliser les technologies récentes ● Une approche non-destructive
  • 20. Intégration du contenu ● Mise en place d'un contenu type mis à disposition. ● Spécifier les styles généraux (Hn, listes, tableaux...) ● Respecter l'accessibilité ● Mettre en place les bonnes pratiques du référenceur
  • 21. Développement des fonctionnalités ● Spécifications et maquettes filaires ● Adaptation des fonctionnalités natives ● Développer sans toucher au noyau ● Tests unitaires et validation client
  • 22. Recettes et transfert de compétences Recette interne à l'agence ● Respect de l'accessibilité ● Tests multi-plateformes ● Vérification des contenus
  • 23. Transfert de compétences Formation et livrables ● Minimum 1 jour de formation ● Manuel utilisateur ● Fiches pratiques ● Bonnes pratiques SEO et accessilbilté ● Les bons réflexes
  • 24. Recette Client Tests Front-end & Back-end Tester la qualité du site ● Google Page speed ● Validateur W3C ● Barre Web developer Tester le référencement et l'accessibilité du site
  • 25. Maintenance et hébergement Maintenance ● Garantie / assistance ● Mise à jour du système ● Mise à jour du contenu Hébergement ● Dédié / Mutualisé ● Ovh vs Agence Web Attention à votre nom de domaine
  • 26. Référencement SEO / SEA Le référencement c'est du temps... ● Optimisation du site, optimisation des campagnes ● Mise à jour des contenus ● Création de publications, CP, annuaires... ● Suivi des évolutions Et le temps... ● C'est de l'argent ● Ou moins de temps pour faire autre chose
  • 27. Merci de votre participation ! Merci à benoît pour ces clip-arts magnifiques