SlideShare une entreprise Scribd logo
1  sur  50
Télécharger pour lire hors ligne
L’informatique
vestimentaire
SMILE, EmoPulse
C’est un metteur en scène, un chef d’orchestre,
un organisateur : Il structure l’architecture et le contenu du
site web. Il doit déterminer l’ergonomie et la présentation
du site en fonction des objectifs fixés, du public ciblé et de
l’image qu’il est chargé de véhiculer au travers du projet.
Print vs Web
Design
HTML L’Hypertext Markup Language, est le format de données conçu
pour représenter les pages web. C’est un langage de balisage permettant
d’écrire de l’hypertexte généralement abrégé HTML permet également
de structurer sémantiquement et de mettre en forme le contenu des
pages, d’inclure des ressources multimédias dont des images, video...
1990 HTML
Réf: WIKIPEDIA
World Wide Web ou WWW, Tim Barners-Lee met en place les bases du
web (le protocole http, le langage Html...).
l’adresse de ce premier site web fut : http://info.cern.ch/hypertext/WWW/TheProject.htm
et vous pouvez toujours le consulter.
1991 Le premier site web
Réf: (une) histoire du design interactif Etienne Mineur
Le premier site web
1992 - DESIGN DES TABLEAUX EN HTML
1993 - 10 Millions d’internautes connectés
600 site web en ligne
1994 - World Wide Web Consortium
« Un seul web partout et pour tous »
W3C, est un organisme de standardisation, fondé en octobre 1994 chargé
de promouvoir la compatibilité des technologies du World Wide Web
Réf: WIKIPEDIA
1995 - 1996M74 Millions d’internautes
connectés - 650000 sites web en ligne
CSS est introduit par le W3C, améliore l’accessibilité du Web et rend le
code HTML sémantique, plutôt que de présentation.
1996 CSS Cascading Style Sheets
Feuilles de style en cascade
1999 CSS3M279 Millions d’internautes connectés -
2,2 millions sites web en ligne
CSS3 introduit de nouvelles fonctions et caractéristiques qui changent
le visage du web design.
1998 La naissance du géant Google
détient aujourd’hui de nombreux logiciels et sites web notables parmi
lesquels YouTube, le système d’exploitation pour téléphones mobiles
Android, ainsi que d’autres services tels que Google Earth, Google Maps
ou Google Play.
L’internaute devient, grâce aux outils mis à sa disposition, une personne
active sur la toile.
Le Web 2.0
le Web mobile prendre le dessus et plus de gens accéder à l’Internet via
leur téléphone portable que d’un ordinateur de bureau
2008 Le Web mobile
2010 HTML 5 M2 Milliards d’internautes
connectés - 240 millions sites web en ligne
HTML 5 et CSS3 sont en train de créer de meilleurs sites Web avec
l’enrichissement de l’expérience utilisateur.
2012 Responsive Web Design 2,4 Milliards
d’internautes connectés - 624 millions sites web en
ligne
L’utilisateur peut ainsi consulter le même site web à travers une large
gamme d’appareils (moniteurs d’ordinateur, smartphones, tablettes, TV,
etc.)
Les tendance du web d’aujourd’hui : le parallax scrolling, flat design,
video backgrounds, one page le material design et ...
2015 - 3,10 Milliards d’internautes connectés
822 240 nouveaux sites Internet sont mis en ligne
chaque jour.
Quelques chiffres
Screen shoot : Conférence Algeria 2.0 Septembre 2015 par Samir Bellik
Screen shoot : Conférence Algeria 2.0 Septembre 2015 par Samir Bellik
Atelier Web et Mobile Design partie I, introduction au web design, Ahmed BACHIR CHERIF ESBA 2015-2016

Contenu connexe

Tendances

A UI and UX training presentation
A UI and UX training presentationA UI and UX training presentation
A UI and UX training presentationaayush_jain_87
 
コンテンツで改善する UI デザインの極意
コンテンツで改善する UI デザインの極意コンテンツで改善する UI デザインの極意
コンテンツで改善する UI デザインの極意Yasuhisa Hasegawa
 
UXデザインを速く! 軽く! そして根拠をもって、回せ! すばやいユーザー調査からつなげるアジャイルUX
UXデザインを速く! 軽く! そして根拠をもって、回せ! すばやいユーザー調査からつなげるアジャイルUXUXデザインを速く! 軽く! そして根拠をもって、回せ! すばやいユーザー調査からつなげるアジャイルUX
UXデザインを速く! 軽く! そして根拠をもって、回せ! すばやいユーザー調査からつなげるアジャイルUXYoshiki Hayama
 
Good Morning UX #3 : Les fondamentaux du design UX
Good Morning UX #3 : Les fondamentaux du design UXGood Morning UX #3 : Les fondamentaux du design UX
Good Morning UX #3 : Les fondamentaux du design UXNewflux UX/UI News
 
UX、デザイン思考、リーンスタートアップのためのオブザベーション(観察)入門:2014年7月5日 UXD/HCD ワイワイCAFE
UX、デザイン思考、リーンスタートアップのためのオブザベーション(観察)入門:2014年7月5日 UXD/HCD ワイワイCAFEUX、デザイン思考、リーンスタートアップのためのオブザベーション(観察)入門:2014年7月5日 UXD/HCD ワイワイCAFE
UX、デザイン思考、リーンスタートアップのためのオブザベーション(観察)入門:2014年7月5日 UXD/HCD ワイワイCAFEYoshiki Hayama
 
Design du logo et image de marque
Design du logo et image de marqueDesign du logo et image de marque
Design du logo et image de marqueGeoffrey Dorne
 
ワークショップのアイデア発想で「AIでユーザーに最適な情報を出します」とか言うな
ワークショップのアイデア発想で「AIでユーザーに最適な情報を出します」とか言うなワークショップのアイデア発想で「AIでユーザーに最適な情報を出します」とか言うな
ワークショップのアイデア発想で「AIでユーザーに最適な情報を出します」とか言うなYoshiki Hayama
 
ECDL Θεωρία Σημειώσεις 1/7
ECDL Θεωρία Σημειώσεις 1/7ECDL Θεωρία Σημειώσεις 1/7
ECDL Θεωρία Σημειώσεις 1/7Michael Ntallas
 
SIビジネスのデジタル・トランスフォーメーション
SIビジネスのデジタル・トランスフォーメーションSIビジネスのデジタル・トランスフォーメーション
SIビジネスのデジタル・トランスフォーメーションMasanori Saito
 
UX - User Experience Design and Principles
UX - User Experience Design and PrinciplesUX - User Experience Design and Principles
UX - User Experience Design and PrinciplesPeeyush Sahu CAPM®
 
L'UX design, qu'est-ce que c'est vraiment ?
L'UX design, qu'est-ce que c'est vraiment ?L'UX design, qu'est-ce que c'est vraiment ?
L'UX design, qu'est-ce que c'est vraiment ?Carole Laimay
 
Livre blanc Intelligence Artificielle et Communication
Livre blanc Intelligence Artificielle et CommunicationLivre blanc Intelligence Artificielle et Communication
Livre blanc Intelligence Artificielle et CommunicationGwnalleRouzioux
 
Webデザインのトーン&マナーを導き出す手法
Webデザインのトーン&マナーを導き出す手法Webデザインのトーン&マナーを導き出す手法
Webデザインのトーン&マナーを導き出す手法Katsumi Tazuke
 
Formation UX Design, introduction et tour d'horizon
Formation UX Design, introduction et tour d'horizonFormation UX Design, introduction et tour d'horizon
Formation UX Design, introduction et tour d'horizonHETIC
 
デザイナーがクライアントワークをうまく進める方法 先生:中野 由貴
デザイナーがクライアントワークをうまく進める方法 先生:中野 由貴デザイナーがクライアントワークをうまく進める方法 先生:中野 由貴
デザイナーがクライアントワークをうまく進める方法 先生:中野 由貴schoowebcampus
 
Da IHC ao UX: Uma história de ressignificação para o mercado / Webinar BR-CH...
Da IHC ao UX: Uma história de ressignificação  para o mercado / Webinar BR-CH...Da IHC ao UX: Uma história de ressignificação  para o mercado / Webinar BR-CH...
Da IHC ao UX: Uma história de ressignificação para o mercado / Webinar BR-CH...Rafael Burity
 
もしプロダクトマネージャー・プロダクトチームにUXリサーチのメンターがついたら <レクイエム>
もしプロダクトマネージャー・プロダクトチームにUXリサーチのメンターがついたら <レクイエム>もしプロダクトマネージャー・プロダクトチームにUXリサーチのメンターがついたら <レクイエム>
もしプロダクトマネージャー・プロダクトチームにUXリサーチのメンターがついたら <レクイエム>Yoshiki Hayama
 

Tendances (20)

A UI and UX training presentation
A UI and UX training presentationA UI and UX training presentation
A UI and UX training presentation
 
コンテンツで改善する UI デザインの極意
コンテンツで改善する UI デザインの極意コンテンツで改善する UI デザインの極意
コンテンツで改善する UI デザインの極意
 
UXデザインを速く! 軽く! そして根拠をもって、回せ! すばやいユーザー調査からつなげるアジャイルUX
UXデザインを速く! 軽く! そして根拠をもって、回せ! すばやいユーザー調査からつなげるアジャイルUXUXデザインを速く! 軽く! そして根拠をもって、回せ! すばやいユーザー調査からつなげるアジャイルUX
UXデザインを速く! 軽く! そして根拠をもって、回せ! すばやいユーザー調査からつなげるアジャイルUX
 
Good Morning UX #3 : Les fondamentaux du design UX
Good Morning UX #3 : Les fondamentaux du design UXGood Morning UX #3 : Les fondamentaux du design UX
Good Morning UX #3 : Les fondamentaux du design UX
 
C’est quoi l’UX -
C’est quoi l’UX -C’est quoi l’UX -
C’est quoi l’UX -
 
UX、デザイン思考、リーンスタートアップのためのオブザベーション(観察)入門:2014年7月5日 UXD/HCD ワイワイCAFE
UX、デザイン思考、リーンスタートアップのためのオブザベーション(観察)入門:2014年7月5日 UXD/HCD ワイワイCAFEUX、デザイン思考、リーンスタートアップのためのオブザベーション(観察)入門:2014年7月5日 UXD/HCD ワイワイCAFE
UX、デザイン思考、リーンスタートアップのためのオブザベーション(観察)入門:2014年7月5日 UXD/HCD ワイワイCAFE
 
Design du logo et image de marque
Design du logo et image de marqueDesign du logo et image de marque
Design du logo et image de marque
 
ワークショップのアイデア発想で「AIでユーザーに最適な情報を出します」とか言うな
ワークショップのアイデア発想で「AIでユーザーに最適な情報を出します」とか言うなワークショップのアイデア発想で「AIでユーザーに最適な情報を出します」とか言うな
ワークショップのアイデア発想で「AIでユーザーに最適な情報を出します」とか言うな
 
ECDL Θεωρία Σημειώσεις 1/7
ECDL Θεωρία Σημειώσεις 1/7ECDL Θεωρία Σημειώσεις 1/7
ECDL Θεωρία Σημειώσεις 1/7
 
SIビジネスのデジタル・トランスフォーメーション
SIビジネスのデジタル・トランスフォーメーションSIビジネスのデジタル・トランスフォーメーション
SIビジネスのデジタル・トランスフォーメーション
 
UX - User Experience Design and Principles
UX - User Experience Design and PrinciplesUX - User Experience Design and Principles
UX - User Experience Design and Principles
 
L'UX design, qu'est-ce que c'est vraiment ?
L'UX design, qu'est-ce que c'est vraiment ?L'UX design, qu'est-ce que c'est vraiment ?
L'UX design, qu'est-ce que c'est vraiment ?
 
Livre blanc Intelligence Artificielle et Communication
Livre blanc Intelligence Artificielle et CommunicationLivre blanc Intelligence Artificielle et Communication
Livre blanc Intelligence Artificielle et Communication
 
Ux & ui
Ux & uiUx & ui
Ux & ui
 
Webデザインのトーン&マナーを導き出す手法
Webデザインのトーン&マナーを導き出す手法Webデザインのトーン&マナーを導き出す手法
Webデザインのトーン&マナーを導き出す手法
 
Formation UX Design, introduction et tour d'horizon
Formation UX Design, introduction et tour d'horizonFormation UX Design, introduction et tour d'horizon
Formation UX Design, introduction et tour d'horizon
 
デザイナーがクライアントワークをうまく進める方法 先生:中野 由貴
デザイナーがクライアントワークをうまく進める方法 先生:中野 由貴デザイナーがクライアントワークをうまく進める方法 先生:中野 由貴
デザイナーがクライアントワークをうまく進める方法 先生:中野 由貴
 
Da IHC ao UX: Uma história de ressignificação para o mercado / Webinar BR-CH...
Da IHC ao UX: Uma história de ressignificação  para o mercado / Webinar BR-CH...Da IHC ao UX: Uma história de ressignificação  para o mercado / Webinar BR-CH...
Da IHC ao UX: Uma história de ressignificação para o mercado / Webinar BR-CH...
 
UX/UI design
UX/UI designUX/UI design
UX/UI design
 
もしプロダクトマネージャー・プロダクトチームにUXリサーチのメンターがついたら <レクイエム>
もしプロダクトマネージャー・プロダクトチームにUXリサーチのメンターがついたら <レクイエム>もしプロダクトマネージャー・プロダクトチームにUXリサーチのメンターがついたら <レクイエム>
もしプロダクトマネージャー・プロダクトチームにUXリサーチのメンターがついたら <レクイエム>
 

En vedette

Repères historiques 4 dnb
Repères historiques 4 dnbRepères historiques 4 dnb
Repères historiques 4 dnbJeff Laroumagne
 
Résultats enquête de satisfaction Repères décembre 2012
Résultats enquête de satisfaction Repères décembre 2012Résultats enquête de satisfaction Repères décembre 2012
Résultats enquête de satisfaction Repères décembre 2012François Abiven
 
IV Seminario - Fortaleciendo las Capacidades del Concejal Chaqueño
IV Seminario - Fortaleciendo las Capacidades del Concejal ChaqueñoIV Seminario - Fortaleciendo las Capacidades del Concejal Chaqueño
IV Seminario - Fortaleciendo las Capacidades del Concejal ChaqueñoFundación CiGob
 
Tots els prínceps blaus, microconte per treballar
Tots els prínceps blaus, microconte per treballarTots els prínceps blaus, microconte per treballar
Tots els prínceps blaus, microconte per treballarRoser Guiteras
 
Assaig de càntic en el temple
Assaig de càntic en el templeAssaig de càntic en el temple
Assaig de càntic en el templeRoser Guiteras
 
Reperes le quali en ligne, opportunités et challenge pour le qualitativiste...
Reperes   le quali en ligne, opportunités et challenge pour le qualitativiste...Reperes   le quali en ligne, opportunités et challenge pour le qualitativiste...
Reperes le quali en ligne, opportunités et challenge pour le qualitativiste...François Abiven
 
Part Miner Presentation2007v74190
Part Miner Presentation2007v74190Part Miner Presentation2007v74190
Part Miner Presentation2007v74190sharepartminer
 
IBM Paris Bluemix Meetup #12 - Ecole 42 - 9 décembre 2015
IBM Paris Bluemix Meetup #12 - Ecole 42 - 9 décembre 2015IBM Paris Bluemix Meetup #12 - Ecole 42 - 9 décembre 2015
IBM Paris Bluemix Meetup #12 - Ecole 42 - 9 décembre 2015IBM France Lab
 
Plaquette cours spéciaux 144
Plaquette cours spéciaux 144Plaquette cours spéciaux 144
Plaquette cours spéciaux 144Lidyasam
 
Concurso De Ciencia Y TecnologíA
Concurso De Ciencia Y TecnologíAConcurso De Ciencia Y TecnologíA
Concurso De Ciencia Y TecnologíABlanca Bautista
 
Apprenez à plaire à Google pour bien positionner votre entreprise en ligne
Apprenez à plaire à Google pour bien positionner votre entreprise en ligneApprenez à plaire à Google pour bien positionner votre entreprise en ligne
Apprenez à plaire à Google pour bien positionner votre entreprise en lignepolenumerique33
 

En vedette (20)

Taller de Consumer Insights - Febrero 2009
Taller de Consumer Insights - Febrero 2009Taller de Consumer Insights - Febrero 2009
Taller de Consumer Insights - Febrero 2009
 
Slidecast
SlidecastSlidecast
Slidecast
 
Repères historiques 4 dnb
Repères historiques 4 dnbRepères historiques 4 dnb
Repères historiques 4 dnb
 
Résultats enquête de satisfaction Repères décembre 2012
Résultats enquête de satisfaction Repères décembre 2012Résultats enquête de satisfaction Repères décembre 2012
Résultats enquête de satisfaction Repères décembre 2012
 
IV Seminario - Fortaleciendo las Capacidades del Concejal Chaqueño
IV Seminario - Fortaleciendo las Capacidades del Concejal ChaqueñoIV Seminario - Fortaleciendo las Capacidades del Concejal Chaqueño
IV Seminario - Fortaleciendo las Capacidades del Concejal Chaqueño
 
Tots els prínceps blaus, microconte per treballar
Tots els prínceps blaus, microconte per treballarTots els prínceps blaus, microconte per treballar
Tots els prínceps blaus, microconte per treballar
 
Assaig de càntic en el temple
Assaig de càntic en el templeAssaig de càntic en el temple
Assaig de càntic en el temple
 
Tarea 3
Tarea 3Tarea 3
Tarea 3
 
Energia
EnergiaEnergia
Energia
 
tafe transcripts
tafe transcriptstafe transcripts
tafe transcripts
 
Reperes le quali en ligne, opportunités et challenge pour le qualitativiste...
Reperes   le quali en ligne, opportunités et challenge pour le qualitativiste...Reperes   le quali en ligne, opportunités et challenge pour le qualitativiste...
Reperes le quali en ligne, opportunités et challenge pour le qualitativiste...
 
Unidad2 internet
Unidad2 internetUnidad2 internet
Unidad2 internet
 
Materias1
Materias1Materias1
Materias1
 
Part Miner Presentation2007v74190
Part Miner Presentation2007v74190Part Miner Presentation2007v74190
Part Miner Presentation2007v74190
 
Smi2012
Smi2012Smi2012
Smi2012
 
IBM Paris Bluemix Meetup #12 - Ecole 42 - 9 décembre 2015
IBM Paris Bluemix Meetup #12 - Ecole 42 - 9 décembre 2015IBM Paris Bluemix Meetup #12 - Ecole 42 - 9 décembre 2015
IBM Paris Bluemix Meetup #12 - Ecole 42 - 9 décembre 2015
 
Plaquette cours spéciaux 144
Plaquette cours spéciaux 144Plaquette cours spéciaux 144
Plaquette cours spéciaux 144
 
Concurso De Ciencia Y TecnologíA
Concurso De Ciencia Y TecnologíAConcurso De Ciencia Y TecnologíA
Concurso De Ciencia Y TecnologíA
 
Quotes
Quotes Quotes
Quotes
 
Apprenez à plaire à Google pour bien positionner votre entreprise en ligne
Apprenez à plaire à Google pour bien positionner votre entreprise en ligneApprenez à plaire à Google pour bien positionner votre entreprise en ligne
Apprenez à plaire à Google pour bien positionner votre entreprise en ligne
 

Similaire à Atelier Web et Mobile Design partie I, introduction au web design, Ahmed BACHIR CHERIF ESBA 2015-2016

Webdesign Passe, Present et... Present Part1
Webdesign Passe, Present et... Present Part1Webdesign Passe, Present et... Present Part1
Webdesign Passe, Present et... Present Part1bduverneuil
 
Webdesign Passe Present et Present Part2
Webdesign Passe Present et Present Part2Webdesign Passe Present et Present Part2
Webdesign Passe Present et Present Part2bduverneuil
 
Web 2.0 : Quelles applications ?
Web 2.0 : Quelles applications ?Web 2.0 : Quelles applications ?
Web 2.0 : Quelles applications ?Jean-François Ruiz
 
HTML5, How to rethink your web strategy - Version FR
HTML5, How to rethink your web strategy - Version FRHTML5, How to rethink your web strategy - Version FR
HTML5, How to rethink your web strategy - Version FRFabernovel
 
Communication digitale
Communication digitaleCommunication digitale
Communication digitaleChris Gaillard
 
HTML5, le web de demain - BNSA
HTML5, le web de demain - BNSAHTML5, le web de demain - BNSA
HTML5, le web de demain - BNSABNSA - Aquitaine
 
MobiliteaTime #5 : Responsive & Adaptive Design
MobiliteaTime #5 : Responsive & Adaptive Design MobiliteaTime #5 : Responsive & Adaptive Design
MobiliteaTime #5 : Responsive & Adaptive Design USERADGENTS
 
Rapport de mini projet de programation web
Rapport de mini projet de programation webRapport de mini projet de programation web
Rapport de mini projet de programation webMOHAMMED MOURADI
 
Webdesign Passe Present et... Present Part3
Webdesign Passe Present et... Present Part3Webdesign Passe Present et... Present Part3
Webdesign Passe Present et... Present Part3bduverneuil
 
Web 2.0 GTI780 & MTI780 ETS A09
Web 2.0  GTI780 & MTI780  ETS  A09Web 2.0  GTI780 & MTI780  ETS  A09
Web 2.0 GTI780 & MTI780 ETS A09Claude Coulombe
 
Les interfaces web de demain
Les interfaces web de demainLes interfaces web de demain
Les interfaces web de demainLaurent Leborgne
 
resume-theorique-m104-0401-61d5b38b21f67 (1).pptx
resume-theorique-m104-0401-61d5b38b21f67 (1).pptxresume-theorique-m104-0401-61d5b38b21f67 (1).pptx
resume-theorique-m104-0401-61d5b38b21f67 (1).pptxFootballLovers9
 
Presentation EPMI Web 2.0 David Boisseleau
Presentation EPMI Web 2.0 David BoisseleauPresentation EPMI Web 2.0 David Boisseleau
Presentation EPMI Web 2.0 David Boisseleaudboisseleau
 
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
 

Similaire à Atelier Web et Mobile Design partie I, introduction au web design, Ahmed BACHIR CHERIF ESBA 2015-2016 (20)

Webdesign Passe, Present et... Present Part1
Webdesign Passe, Present et... Present Part1Webdesign Passe, Present et... Present Part1
Webdesign Passe, Present et... Present Part1
 
Webdesign
WebdesignWebdesign
Webdesign
 
Webdesign Passe Present et Present Part2
Webdesign Passe Present et Present Part2Webdesign Passe Present et Present Part2
Webdesign Passe Present et Present Part2
 
Web 2.0 : Quelles applications ?
Web 2.0 : Quelles applications ?Web 2.0 : Quelles applications ?
Web 2.0 : Quelles applications ?
 
HTML5, How to rethink your web strategy - Version FR
HTML5, How to rethink your web strategy - Version FRHTML5, How to rethink your web strategy - Version FR
HTML5, How to rethink your web strategy - Version FR
 
Communication digitale
Communication digitaleCommunication digitale
Communication digitale
 
Salon Use IT Lyon
Salon Use IT LyonSalon Use IT Lyon
Salon Use IT Lyon
 
HTML5, le web de demain - BNSA
HTML5, le web de demain - BNSAHTML5, le web de demain - BNSA
HTML5, le web de demain - BNSA
 
Découverte des outils Web 2.0
Découverte des outils Web 2.0Découverte des outils Web 2.0
Découverte des outils Web 2.0
 
MobiliteaTime #5 : Responsive & Adaptive Design
MobiliteaTime #5 : Responsive & Adaptive Design MobiliteaTime #5 : Responsive & Adaptive Design
MobiliteaTime #5 : Responsive & Adaptive Design
 
Rapport de mini projet de programation web
Rapport de mini projet de programation webRapport de mini projet de programation web
Rapport de mini projet de programation web
 
Web2.0
Web2.0Web2.0
Web2.0
 
Webdesign Passe Present et... Present Part3
Webdesign Passe Present et... Present Part3Webdesign Passe Present et... Present Part3
Webdesign Passe Present et... Present Part3
 
Web 2.0 GTI780 & MTI780 ETS A09
Web 2.0  GTI780 & MTI780  ETS  A09Web 2.0  GTI780 & MTI780  ETS  A09
Web 2.0 GTI780 & MTI780 ETS A09
 
Les interfaces web de demain
Les interfaces web de demainLes interfaces web de demain
Les interfaces web de demain
 
Web 2.O
Web 2.OWeb 2.O
Web 2.O
 
resume-theorique-m104-0401-61d5b38b21f67 (1).pptx
resume-theorique-m104-0401-61d5b38b21f67 (1).pptxresume-theorique-m104-0401-61d5b38b21f67 (1).pptx
resume-theorique-m104-0401-61d5b38b21f67 (1).pptx
 
Front end Hero Presentation
Front end Hero PresentationFront end Hero Presentation
Front end Hero Presentation
 
Presentation EPMI Web 2.0 David Boisseleau
Presentation EPMI Web 2.0 David BoisseleauPresentation EPMI Web 2.0 David Boisseleau
Presentation EPMI Web 2.0 David Boisseleau
 
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
 

Plus de Ahmed BACHIR CHERIF

Think your brand Hutl prize competition Algeria ENSH Blida
Think your brand Hutl prize competition Algeria ENSH BlidaThink your brand Hutl prize competition Algeria ENSH Blida
Think your brand Hutl prize competition Algeria ENSH BlidaAhmed BACHIR CHERIF
 
Atelier Web et Mobile Design partie I, introduction au web design, Outils du ...
Atelier Web et Mobile Design partie I, introduction au web design, Outils du ...Atelier Web et Mobile Design partie I, introduction au web design, Outils du ...
Atelier Web et Mobile Design partie I, introduction au web design, Outils du ...Ahmed BACHIR CHERIF
 
Atelier web et mobile design partie i introduction au web design ahmed bachir...
Atelier web et mobile design partie i introduction au web design ahmed bachir...Atelier web et mobile design partie i introduction au web design ahmed bachir...
Atelier web et mobile design partie i introduction au web design ahmed bachir...Ahmed BACHIR CHERIF
 

Plus de Ahmed BACHIR CHERIF (6)

UX Design for Startup
UX Design for StartupUX Design for Startup
UX Design for Startup
 
Quand l'art Innove
Quand l'art InnoveQuand l'art Innove
Quand l'art Innove
 
Think your brand Hutl prize competition Algeria ENSH Blida
Think your brand Hutl prize competition Algeria ENSH BlidaThink your brand Hutl prize competition Algeria ENSH Blida
Think your brand Hutl prize competition Algeria ENSH Blida
 
Introduction au logo design
Introduction au logo designIntroduction au logo design
Introduction au logo design
 
Atelier Web et Mobile Design partie I, introduction au web design, Outils du ...
Atelier Web et Mobile Design partie I, introduction au web design, Outils du ...Atelier Web et Mobile Design partie I, introduction au web design, Outils du ...
Atelier Web et Mobile Design partie I, introduction au web design, Outils du ...
 
Atelier web et mobile design partie i introduction au web design ahmed bachir...
Atelier web et mobile design partie i introduction au web design ahmed bachir...Atelier web et mobile design partie i introduction au web design ahmed bachir...
Atelier web et mobile design partie i introduction au web design ahmed bachir...
 

Atelier Web et Mobile Design partie I, introduction au web design, Ahmed BACHIR CHERIF ESBA 2015-2016

  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 20.
  • 21.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29. C’est un metteur en scène, un chef d’orchestre, un organisateur : Il structure l’architecture et le contenu du site web. Il doit déterminer l’ergonomie et la présentation du site en fonction des objectifs fixés, du public ciblé et de l’image qu’il est chargé de véhiculer au travers du projet.
  • 31. HTML L’Hypertext Markup Language, est le format de données conçu pour représenter les pages web. C’est un langage de balisage permettant d’écrire de l’hypertexte généralement abrégé HTML permet également de structurer sémantiquement et de mettre en forme le contenu des pages, d’inclure des ressources multimédias dont des images, video... 1990 HTML Réf: WIKIPEDIA
  • 32. World Wide Web ou WWW, Tim Barners-Lee met en place les bases du web (le protocole http, le langage Html...). l’adresse de ce premier site web fut : http://info.cern.ch/hypertext/WWW/TheProject.htm et vous pouvez toujours le consulter. 1991 Le premier site web Réf: (une) histoire du design interactif Etienne Mineur
  • 34. 1992 - DESIGN DES TABLEAUX EN HTML
  • 35. 1993 - 10 Millions d’internautes connectés 600 site web en ligne
  • 36. 1994 - World Wide Web Consortium « Un seul web partout et pour tous » W3C, est un organisme de standardisation, fondé en octobre 1994 chargé de promouvoir la compatibilité des technologies du World Wide Web Réf: WIKIPEDIA
  • 37. 1995 - 1996M74 Millions d’internautes connectés - 650000 sites web en ligne
  • 38. CSS est introduit par le W3C, améliore l’accessibilité du Web et rend le code HTML sémantique, plutôt que de présentation. 1996 CSS Cascading Style Sheets Feuilles de style en cascade
  • 39. 1999 CSS3M279 Millions d’internautes connectés - 2,2 millions sites web en ligne CSS3 introduit de nouvelles fonctions et caractéristiques qui changent le visage du web design.
  • 40. 1998 La naissance du géant Google détient aujourd’hui de nombreux logiciels et sites web notables parmi lesquels YouTube, le système d’exploitation pour téléphones mobiles Android, ainsi que d’autres services tels que Google Earth, Google Maps ou Google Play.
  • 41. L’internaute devient, grâce aux outils mis à sa disposition, une personne active sur la toile. Le Web 2.0
  • 42. le Web mobile prendre le dessus et plus de gens accéder à l’Internet via leur téléphone portable que d’un ordinateur de bureau 2008 Le Web mobile
  • 43. 2010 HTML 5 M2 Milliards d’internautes connectés - 240 millions sites web en ligne HTML 5 et CSS3 sont en train de créer de meilleurs sites Web avec l’enrichissement de l’expérience utilisateur.
  • 44. 2012 Responsive Web Design 2,4 Milliards d’internautes connectés - 624 millions sites web en ligne L’utilisateur peut ainsi consulter le même site web à travers une large gamme d’appareils (moniteurs d’ordinateur, smartphones, tablettes, TV, etc.)
  • 45. Les tendance du web d’aujourd’hui : le parallax scrolling, flat design, video backgrounds, one page le material design et ... 2015 - 3,10 Milliards d’internautes connectés 822 240 nouveaux sites Internet sont mis en ligne chaque jour.
  • 47.
  • 48. Screen shoot : Conférence Algeria 2.0 Septembre 2015 par Samir Bellik
  • 49. Screen shoot : Conférence Algeria 2.0 Septembre 2015 par Samir Bellik