SlideShare a Scribd company logo
1 of 14
Le Webdesign orienté Business
Par Khaled DJEBLOUN
Introduction
Le (Web)(design) c’est quoi ?
Web : Ou toile, est un
système hypertexte public
fonctionnant sur Internet et
qui permet de consulter,
avec un navigateur, des
pages mises en ligne dans
des sites. L’image de la toile
d'araignée vient des
hyperliens qui lient les pages
web entre elles.
Design : une discipline visant
à représenter concrètement,
une pensée, un concept ou
une intention en tenant
compte des contraintes
fonctionnelles, structurelles,
esthétiques, techniques et
productives.
+ =
Webdesign : désigne la
conception d'interface web
en tenant compte des
contraintes spécifiques du
support Internet en termes
d’ergonomie, d’utilisabilité
et d’accessibilité.
Le webdesigner
Le webdesigner n’est pas un :
• Intégrateur
• Développeur
• Infographe
• Webmaster
• Ergonome
• Et surtout pas un artiste !
Le webdesigner est un :
Designer ayant des notions en : Intégration, développement,
infographie , webmastering et aussi en ergonomie. Et toujours
pas un artiste :p
Objectifs
Attentes du Client
• Retour sur investissement (rentabilité)
• Fidélisation
• Economiser (temps et argent)
• Positionnement sur le marché
Webdesigner
• Utilisable donc fonctionnel
• Accessible
• Jolie !
• Respect de la charte graphique
Un business-webdesign
Design d’une interface web d’un site rentable
Fonctionnelle
Identifiable
Claire
Accessible
Comment s’y prendre ?
• Fonctionnelle : la conception centré utilisateur
est la base d’un site fonctionnelle
L’utilisateur est l’élément principal de votre site et il
doit pouvoir facilement atteindre ses objectifs voir
trouver l’information afin de pouvoir accomplir les
vôtres en terme commercials.
• Au moment de la conception, penser que la maquette va finir par être utiliser et
non simplement vue !
• Des tests utilisateurs ou des Brainstormings afin de prévoire les problèmes liés a
l’ergonomie.
Comment s’y prendre ?
• Accessible : Avec Plus de monde sur votre site,
ce dernier est rentable.
• 63% utilise Internet explorer, 28% Firefox et 9% : Chrome, safari, opera …
• 43 % utilise un écran 1024x768, 14% 1280x800, 11% 800x600, 32% le reste des
résolutions…
• 78% version 10 du flash player, 7% pour la 9, 2% non installé
• 11 % machine java non installé.
Source : Google analytics du site Joowala.com
Au moment de la conception faire en sorte que le site
soit accessible par le maximum d’utilisateurs ciblés.
Comment s’y prendre ?
• Identifiable : pas forcément beau mais avec
une identité
Un design web est dit identifiable si l’on prend
n’importe quel éléments de ce dernier on reconnaitra
son appartenance institutionnelle.
Pour se faire il faut suivre et savoir décliner une
charte graphique.
Un minimum de couleurs et de polices de caractère
est très souhaité.
Comment s’y prendre ?
• Claire : parler peu pour une meilleure
compréhension.
Pensez à hiérarchiser l’information est l’une des
règles de base d’une web conception.
Exemple : Ne pas commencer une page avec un <h5>
Quelques exemples
Coup de cœur …
www.apple.com
Quelques exemples
Coup de cœur …
www.cnn.com
Quelques exemples
Coup de cœur …
www.yahoo.fr
Conclusion
Un bon designer web est un designer capable de
répondre au besoin stratégique (marketing et
commercial) du client tout en tenant compte des
contraintes techniques (utilisabilité, fonctionnalité … )
et au respect de l’identité visuelle.
Faire beau c’est bien, vendre c’est mieux 
Fin
Merci pour votre attention.
Des questions ?
Par Khaled DJEBLOUN
Graphiste webdesigner

More Related Content

Similar to Le webdesign orienté Business

HTML5mtl - 2012-02-22 - Responsive Web Design
HTML5mtl - 2012-02-22 - Responsive Web DesignHTML5mtl - 2012-02-22 - Responsive Web Design
HTML5mtl - 2012-02-22 - Responsive Web DesignFrédéric Harper
 
Web { Design Project } Management
Web { Design Project } ManagementWeb { Design Project } Management
Web { Design Project } ManagementDavid Roessli
 
HTML 5, CSS 3 au service du web | Semaine du web Alger (Algérie)
HTML 5, CSS 3 au service du web | Semaine du web Alger (Algérie)HTML 5, CSS 3 au service du web | Semaine du web Alger (Algérie)
HTML 5, CSS 3 au service du web | Semaine du web Alger (Algérie)Khaled Djebloun
 
Formation : "Concevoir et promouvoir votre site internet" V3
Formation : "Concevoir et promouvoir votre site internet" V3Formation : "Concevoir et promouvoir votre site internet" V3
Formation : "Concevoir et promouvoir votre site internet" V3Synerg'hetic
 
Ayez les clés pour bâtir votre site internet et communiquer avec votre agence
Ayez les clés pour bâtir votre site internet et communiquer avec votre agenceAyez les clés pour bâtir votre site internet et communiquer avec votre agence
Ayez les clés pour bâtir votre site internet et communiquer avec votre agenceDestination Brocéliande
 
Développement d'un site web pour la promotion de pme 2012 araq-sud - 7 févr...
Développement d'un site web pour la promotion de pme 2012   araq-sud - 7 févr...Développement d'un site web pour la promotion de pme 2012   araq-sud - 7 févr...
Développement d'un site web pour la promotion de pme 2012 araq-sud - 7 févr...MXO | agence totale
 
Développement d'un site web pour la promotion de pme 2012 mentor cld vallée...
Développement d'un site web pour la promotion de pme 2012   mentor cld vallée...Développement d'un site web pour la promotion de pme 2012   mentor cld vallée...
Développement d'un site web pour la promotion de pme 2012 mentor cld vallée...MXO | agence totale
 
2015 cours-projet web-infonum-part2
2015 cours-projet web-infonum-part22015 cours-projet web-infonum-part2
2015 cours-projet web-infonum-part2Eric Giraudin
 
Penser et concevoir son site web en 2015
Penser et concevoir son site web en 2015Penser et concevoir son site web en 2015
Penser et concevoir son site web en 2015SADC d'Abitibi-Ouest
 
RWD - Back to Basics par Ruben Pieraerts
RWD - Back to Basics par Ruben PieraertsRWD - Back to Basics par Ruben Pieraerts
RWD - Back to Basics par Ruben PieraertsLa FeWeb
 
Responsive Web Design : back to basics
Responsive Web Design : back to basicsResponsive Web Design : back to basics
Responsive Web Design : back to basicsAlinoa
 
Webdesign sites web et mobiles-methodes-realisation-outils
Webdesign sites web et mobiles-methodes-realisation-outilsWebdesign sites web et mobiles-methodes-realisation-outils
Webdesign sites web et mobiles-methodes-realisation-outilsOlivier Dommange
 
Atelier ENP - 23 mai 2012
Atelier ENP -  23 mai 2012Atelier ENP -  23 mai 2012
Atelier ENP - 23 mai 2012CCI Yonne
 
Créer un site internet efficace aujourd'hui !
Créer un site internet efficace aujourd'hui !Créer un site internet efficace aujourd'hui !
Créer un site internet efficace aujourd'hui !Odomia
 
Mobile & Responsive Design: Rendez votre marque mobile
Mobile & Responsive Design: Rendez votre marque mobileMobile & Responsive Design: Rendez votre marque mobile
Mobile & Responsive Design: Rendez votre marque mobileWSI France
 

Similar to Le webdesign orienté Business (20)

HTML5mtl - 2012-02-22 - Responsive Web Design
HTML5mtl - 2012-02-22 - Responsive Web DesignHTML5mtl - 2012-02-22 - Responsive Web Design
HTML5mtl - 2012-02-22 - Responsive Web Design
 
Web { Design Project } Management
Web { Design Project } ManagementWeb { Design Project } Management
Web { Design Project } Management
 
HTML 5, CSS 3 au service du web | Semaine du web Alger (Algérie)
HTML 5, CSS 3 au service du web | Semaine du web Alger (Algérie)HTML 5, CSS 3 au service du web | Semaine du web Alger (Algérie)
HTML 5, CSS 3 au service du web | Semaine du web Alger (Algérie)
 
Formation : "Concevoir et promouvoir votre site internet" V3
Formation : "Concevoir et promouvoir votre site internet" V3Formation : "Concevoir et promouvoir votre site internet" V3
Formation : "Concevoir et promouvoir votre site internet" V3
 
Ayez les clés pour bâtir votre site internet et communiquer avec votre agence
Ayez les clés pour bâtir votre site internet et communiquer avec votre agenceAyez les clés pour bâtir votre site internet et communiquer avec votre agence
Ayez les clés pour bâtir votre site internet et communiquer avec votre agence
 
Développement d'un site web pour la promotion de pme 2012 araq-sud - 7 févr...
Développement d'un site web pour la promotion de pme 2012   araq-sud - 7 févr...Développement d'un site web pour la promotion de pme 2012   araq-sud - 7 févr...
Développement d'un site web pour la promotion de pme 2012 araq-sud - 7 févr...
 
Développement d'un site web pour la promotion de pme 2012 mentor cld vallée...
Développement d'un site web pour la promotion de pme 2012   mentor cld vallée...Développement d'un site web pour la promotion de pme 2012   mentor cld vallée...
Développement d'un site web pour la promotion de pme 2012 mentor cld vallée...
 
2015 cours-projet web-infonum-part2
2015 cours-projet web-infonum-part22015 cours-projet web-infonum-part2
2015 cours-projet web-infonum-part2
 
Atelier 3 : Création ou refonte de site
Atelier 3 : Création ou refonte de siteAtelier 3 : Création ou refonte de site
Atelier 3 : Création ou refonte de site
 
Penser et concevoir son site web en 2015
Penser et concevoir son site web en 2015Penser et concevoir son site web en 2015
Penser et concevoir son site web en 2015
 
RWD - Back to Basics par Ruben Pieraerts
RWD - Back to Basics par Ruben PieraertsRWD - Back to Basics par Ruben Pieraerts
RWD - Back to Basics par Ruben Pieraerts
 
Responsive Web Design : back to basics
Responsive Web Design : back to basicsResponsive Web Design : back to basics
Responsive Web Design : back to basics
 
Comment optimiser la Création ou la refonte de son site internet ?
Comment optimiser la Création ou la refonte de son site internet ?Comment optimiser la Création ou la refonte de son site internet ?
Comment optimiser la Création ou la refonte de son site internet ?
 
Design Trends
Design TrendsDesign Trends
Design Trends
 
Webdesign
WebdesignWebdesign
Webdesign
 
Webdesign sites web et mobiles-methodes-realisation-outils
Webdesign sites web et mobiles-methodes-realisation-outilsWebdesign sites web et mobiles-methodes-realisation-outils
Webdesign sites web et mobiles-methodes-realisation-outils
 
Atelier ENP - 23 mai 2012
Atelier ENP -  23 mai 2012Atelier ENP -  23 mai 2012
Atelier ENP - 23 mai 2012
 
Créer un site internet efficace aujourd'hui !
Créer un site internet efficace aujourd'hui !Créer un site internet efficace aujourd'hui !
Créer un site internet efficace aujourd'hui !
 
Tirer profit du web en 2011
Tirer profit du web en 2011Tirer profit du web en 2011
Tirer profit du web en 2011
 
Mobile & Responsive Design: Rendez votre marque mobile
Mobile & Responsive Design: Rendez votre marque mobileMobile & Responsive Design: Rendez votre marque mobile
Mobile & Responsive Design: Rendez votre marque mobile
 

Le webdesign orienté Business

  • 1. Le Webdesign orienté Business Par Khaled DJEBLOUN
  • 2. Introduction Le (Web)(design) c’est quoi ? Web : Ou toile, est un système hypertexte public fonctionnant sur Internet et qui permet de consulter, avec un navigateur, des pages mises en ligne dans des sites. L’image de la toile d'araignée vient des hyperliens qui lient les pages web entre elles. Design : une discipline visant à représenter concrètement, une pensée, un concept ou une intention en tenant compte des contraintes fonctionnelles, structurelles, esthétiques, techniques et productives. + = Webdesign : désigne la conception d'interface web en tenant compte des contraintes spécifiques du support Internet en termes d’ergonomie, d’utilisabilité et d’accessibilité.
  • 3. Le webdesigner Le webdesigner n’est pas un : • Intégrateur • Développeur • Infographe • Webmaster • Ergonome • Et surtout pas un artiste ! Le webdesigner est un : Designer ayant des notions en : Intégration, développement, infographie , webmastering et aussi en ergonomie. Et toujours pas un artiste :p
  • 4. Objectifs Attentes du Client • Retour sur investissement (rentabilité) • Fidélisation • Economiser (temps et argent) • Positionnement sur le marché Webdesigner • Utilisable donc fonctionnel • Accessible • Jolie ! • Respect de la charte graphique
  • 5. Un business-webdesign Design d’une interface web d’un site rentable Fonctionnelle Identifiable Claire Accessible
  • 6. Comment s’y prendre ? • Fonctionnelle : la conception centré utilisateur est la base d’un site fonctionnelle L’utilisateur est l’élément principal de votre site et il doit pouvoir facilement atteindre ses objectifs voir trouver l’information afin de pouvoir accomplir les vôtres en terme commercials. • Au moment de la conception, penser que la maquette va finir par être utiliser et non simplement vue ! • Des tests utilisateurs ou des Brainstormings afin de prévoire les problèmes liés a l’ergonomie.
  • 7. Comment s’y prendre ? • Accessible : Avec Plus de monde sur votre site, ce dernier est rentable. • 63% utilise Internet explorer, 28% Firefox et 9% : Chrome, safari, opera … • 43 % utilise un écran 1024x768, 14% 1280x800, 11% 800x600, 32% le reste des résolutions… • 78% version 10 du flash player, 7% pour la 9, 2% non installé • 11 % machine java non installé. Source : Google analytics du site Joowala.com Au moment de la conception faire en sorte que le site soit accessible par le maximum d’utilisateurs ciblés.
  • 8. Comment s’y prendre ? • Identifiable : pas forcément beau mais avec une identité Un design web est dit identifiable si l’on prend n’importe quel éléments de ce dernier on reconnaitra son appartenance institutionnelle. Pour se faire il faut suivre et savoir décliner une charte graphique. Un minimum de couleurs et de polices de caractère est très souhaité.
  • 9. Comment s’y prendre ? • Claire : parler peu pour une meilleure compréhension. Pensez à hiérarchiser l’information est l’une des règles de base d’une web conception. Exemple : Ne pas commencer une page avec un <h5>
  • 10. Quelques exemples Coup de cœur … www.apple.com
  • 11. Quelques exemples Coup de cœur … www.cnn.com
  • 12. Quelques exemples Coup de cœur … www.yahoo.fr
  • 13. Conclusion Un bon designer web est un designer capable de répondre au besoin stratégique (marketing et commercial) du client tout en tenant compte des contraintes techniques (utilisabilité, fonctionnalité … ) et au respect de l’identité visuelle. Faire beau c’est bien, vendre c’est mieux 
  • 14. Fin Merci pour votre attention. Des questions ? Par Khaled DJEBLOUN Graphiste webdesigner