SlideShare une entreprise Scribd logo
1  sur  74
Télécharger pour lire hors ligne
HTML5 en production
   Maintenant

   solutions pratiques
    de IE6 à nos jours



                    Jean-pierre VINCENT
Qui ça ?
        Jean-pierre VINCENT

braincracking.org (veille techno)
@theystolemynick

Je sers le Web et c'est ma joie :
       houra.fr, Yahoo!, Kelkoo
         Time of my Life.com
HTML5 en production
   Maintenant

   solutions pratiques
    de IE6 à nos jours



                    Jean-pierre VINCENT
contraintes et préjugés
contraintes et préjugés

50% de visiteurs avec IE 6-8
contraintes et préjugés

50% de visiteurs avec IE 6-8


HTML5 annoncé pour 2022
(Ian Hickson, éditeur HMTL5)
contraintes et préjugés

50% de visiteurs avec IE 6-8


HTML5 annoncé pour 2022
(Ian Hickson, éditeur HMTL5)

“I don't think it's ready for production yet“
(Philippe Le Hégaret, chef HTML5)
2022 ? pas peur
2022 ? pas peur
•CSS 2.1 : candidate recommandation
2022 ? pas peur
•CSS 2.1 : candidate recommandation

•Selector API 2 : Draft, mais utilisé
par 90% des développeurs grâce à
jQuery
2022 ? pas peur
●   CSS 2.1 : candidate recommandation

●Selector API 2 : Draft, mais utilisé
par 90% des développeurs grâce à
jQuery

●HTML4 : 1999, CSS: 1996
implémentations variées ...
2022 ? pas peur

Utilisation en production

          !==

 Recommandation W3
2022 ? pas peur

Utilisation en production

          ===

     Facilité d'accès
2022 ? pas peur

Utilisation en production

          ===

     Facilité d'accès
       + stabilité
quel HTML5 ?
Officiel :
•
quel HTML5 ?
Officiel :
• Balises
•
quel HTML5 ?
Officiel :
• Balises
• Microdata
•
quel HTML5 ?
Officiel :
• Balises
• Microdata
• Forms
•
quel HTML5 ?
Officiel :
• Balises
• Microdata
• Forms
• Multimédia
•
quel HTML5 ?
Officiel :
• Balises
• Microdata
• Forms
• Multimédia
• Canvas
•
quel HTML5 ?
Officiel :
• Balises
• Microdata
• Forms
• Multimédia
• Canvas
• Web Storage
•
quel HTML5 ?
Officiel :
• Balises
• Microdata
• Forms
• Multimédia
• Canvas
• Web Storage
• Drag & Drop
•
quel HTML5 ?
Officiel :      Associé :
• Balises       ●


• Microdata
• Forms
• Multimédia
• Canvas
• Web Storage
• Drag & Drop
• WebSockets
quel HTML5 ?
Officiel :       Associé :
• Balises       ● Geolocation


• Microdata     ●


• Forms
• Multimédia
• Canvas
• Web Storage
• Drag & Drop
• WebSockets
quel HTML5 ?
Officiel :       Associé :
• Balises       ● Geolocation


• Microdata     ● SVG


• Forms         ●


• Multimédia
• Canvas
• Web Storage
• Drag & Drop
• WebSockets
quel HTML5 ?
Officiel :       Associé :
• Balises       ● Geolocation


• Microdata     ● SVG


• Forms         ● Upload


• Multimédia
• Canvas
• Web Storage
• Drag & Drop
• WebSockets
quel HTML5 ?
Officiel :       Associé :
• Balises       ● Geolocation


• Microdata     ● SVG


• Forms         ● Upload


• Multimédia
• Canvas
• Web Storage    Buzz :
• Drag & Drop   ● CSS3 ...

• WebSockets
quel HTML5 ?
Officiel :       Associé :
• Balises       ● Geolocation


• Microdata     ● SVG


• Forms         ● Upload


• Multimédia
• Canvas
• Web Storage    Buzz :
• Drag & Drop   ● CSS3 ...

• WebSockets
Balises
Balises
●   Changer le doctype

            <!doctype html>

●   Testé en remplacement de
      ✓ XHTML strict
      ✓ HTML4.01 transitional

bit.ly/HTML5_fr          bit.ly/XHTML5_fr
Balises

✓ Site migré en HTML5
        Merci :)
Balises
Balises
<div>
  <div>...</div>
</div>
<div>
  <div>...<span> ...
  <p>
  <div>...</div>
</div>
<div>...</div>
Balises
<header>
  <nav>...</nav>
</header>
<article>
  <header>...<time> ...
  <p>
  <footer>...</footer>
</article>
<footer>...</footer>
Balises
● Standard
● Facile à comprendre




=

● Bénéfices référencement (bientôt)
● Maintenable

● Accessibilité
Balises
<meter value=25 max=100>

<progress value=25 max=100>


<figure>
<figcaption>

<datalist>
Balises
Balises inconnues :

●   display:inline par défaut

article, nav ...{
  display: block
}
Balises
Balises inconnues :

●non stylable sur IE6-8
hack JS :

document.
  createElement('article');
</head>
       bit.ly/HTML5_shiv
Balises


               ✓ Production


 Si :
● Visiteurs IE sans javascript sacrifiables
Formulaires
Formulaires - types
● Datetime, month, time, week ...
● Number

● Search

● Range

● Color

● Tel
Formulaires - types
●   Code compréhensible

●   Utilisabilité, accessibilité

●   Navigateurs aident l'utilisateur
Formulaires - types
<input
  type=email />

●   Clavier approprié

●   Pré-remplissage

●   Interface
Formulaires - types
<input
  type=url />

●   Clavier approprié

●   Pré-remplissage
Formulaires - types
<input
  type=date />


●   Interface appropriée
Formulaires - types
 <input
    type=color />
● Interface appropriée
Formulaires - types

     Non reconnu
           =
      type=text
           =
    ✓ fonctionnalité
Formulaires - types
Faut il styler les formulaires ?
Formulaires - types
Faut il styler les formulaires ?
          Vieux débat
Formulaires - types
Faut il styler les formulaires ?


         Peut être :)
Formulaires - types


              ✓ Production


 Si :
● Widgets natifs acceptés
Forms - bilan
Nouveaux types :
Forms - bilan
Nouveaux types :
✓ OK pour la production
Forms - bilan
Nouveaux types :
✓ OK pour la production

Validation :
Forms - bilan
Nouveaux types :
✓ OK pour la production

Validation :
✓ OK pour création
Forms - bilan
Nouveaux types :
✓ OK pour la production

Validation :
✓ OK pour création
✓ OK pour enrichissement
Forms - bilan
Nouveaux types :
✓ OK pour la production

Validation :
✓ OK pour création
✓ OK pour enrichissement
  Modification : au cas par cas
Microdata
Microdata
 Balisage sémantique avec
vocabulaire personnalisé


 Concurrent de :
● Microformats

● RDFa
Microdata
Intérêt immédiat : Google




data-vocabulary.org/Review-aggregate/
Microdata
Google a défini plusieurs vocabulaires :

● Avis et notes
● Fil d'Ariane (breadcrumb)

● Evènements

● Personnes / Entreprises

● Produits

● Recettes de cuisine (!)
Microdata
<div>
   <h1>Dragon Age</h1>
   Avis rédigé par GameSpot le 3 Novembre.
  Note: 5 sur 5
</div>
Microdata
<div>
   <h1>Dragon Age</h1>
   Avis rédigé par GameSpot le 3 Novembre.
  Note: 5 sur 5
</div>
Microdata
<div itemscope>
   <h1>Dragon Age</h1>
   Avis rédigé par GameSpot le 3 Novembre.
  Note: 5 sur 5
</div>
Microdata
<div itemscope
itemtype="http://data-vocabulary.org/Review">
   <h1>Dragon Age</h1>
   Avis rédigé par GameSpot le 3 Novembre.
  Note: 5 sur 5
</div>
Microdata
<div itemscope
itemtype="http://data-vocabulary.org/Review">
   <h1 itemprop="itemreviewed">
      Dragon Age</h1>
   Avis rédigé par GameSpot le 3 Novembre.
  Note: 5 sur 5
</div>
Microdata
<div itemscope
itemtype="http://data-vocabulary.org/Review">
   <h1 itemprop="itemreviewed">
      Dragon Age</h1>
   Avis rédigé par
   <span itemprop="reviewer">GameSpot</span>
  le 3 Novembre.
  Note: 5 sur 5
</div>
Microdata
<div itemscope
itemtype="http://data-vocabulary.org/Review">
   <h1 itemprop="itemreviewed">
      Dragon Age</h1>
   Avis rédigé par
   <span itemprop="reviewer">GameSpot</span>
  le <time>3 Novembre</time>.
  Note: 5 sur 5
</div>
Microdata
<div itemscope
itemtype="http://data-vocabulary.org/Review">
   <h1 itemprop="itemreviewed">
      Dragon Age</h1>
   Avis rédigé par
   <span itemprop="reviewer">GameSpot</span>
  le <time datetime="2009-11-03">
      3 Novembre</time>.
  Note: 5 sur 5
</div>
Microdata
<div itemscope
itemtype="http://data-vocabulary.org/Review">
   <h1 itemprop="itemreviewed">
      Dragon Age</h1>
   Avis rédigé par
   <span itemprop="reviewer">GameSpot</span>
  le <time datetime="2009-11-03"
           itemprop="dtreviewed">
      3 Novembre</time>.
  Note: 5 sur 5
</div>
Microdata
<div itemscope
itemtype="http://data-vocabulary.org/Review">
   <h1 itemprop="itemreviewed">
      Dragon Age</h1>
   Avis rédigé par
   <span itemprop="reviewer">GameSpot</span>
  le <time datetime="2009-11-03"
           itemprop="dtreviewed">
      3 Novembre</time>.
 Note:<span itemprop="rating">5</span> sur 5
</div>
Microdata
<div itemscope
itemtype="http://data-vocabulary.org/Review">
   <h1 itemprop="itemreviewed">
      Dragon Age</h1>
   Avis rédigé par
   <span itemprop="reviewer">GameSpot</span>
  le <time datetime="2009-11-03"
           itemprop="dtreviewed">
      3 Novembre</time>.
 Note:<span itemprop="rating">5</span> sur 5
</div>
           bit.ly/data-google
Microdata


✓ Utilisable en production
</semantique>

<script src=HTML5/API >

Contenu connexe

Tendances

Comment réussir une migration de site web en seo ?
Comment réussir une migration de site web en seo ?Comment réussir une migration de site web en seo ?
Comment réussir une migration de site web en seo ?Patrick Valibus
 
Magento et SEO : le combo parfait pour développer son e-commerce
Magento et SEO : le combo parfait pour développer son e-commerceMagento et SEO : le combo parfait pour développer son e-commerce
Magento et SEO : le combo parfait pour développer son e-commercePatrick Valibus
 
HTML5 - Sémantique, structure et nouveaux éléments
HTML5 - Sémantique, structure et nouveaux élémentsHTML5 - Sémantique, structure et nouveaux éléments
HTML5 - Sémantique, structure et nouveaux élémentsRémy Savard
 
HTML5, le web de demain - BNSA
HTML5, le web de demain - BNSAHTML5, le web de demain - BNSA
HTML5, le web de demain - BNSABNSA - Aquitaine
 
10 conseils pour booster les performances de votre site sous WordPress
10 conseils pour booster les performances de votre site sous WordPress10 conseils pour booster les performances de votre site sous WordPress
10 conseils pour booster les performances de votre site sous WordPressAurélien Denis
 
Web performance - appliquer les règles de base
Web performance - appliquer les règles de baseWeb performance - appliquer les règles de base
Web performance - appliquer les règles de baseJonathan Buttigieg
 
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 html5 css3 java script
Formation html5 css3 java scriptFormation html5 css3 java script
Formation html5 css3 java scriptArrow Group
 
ENIB 2013-2014 - CAI Web #3: J’ai besoin d’une appli web rapidement
ENIB 2013-2014 - CAI Web #3: J’ai besoin d’une appli web rapidementENIB 2013-2014 - CAI Web #3: J’ai besoin d’une appli web rapidement
ENIB 2013-2014 - CAI Web #3: J’ai besoin d’une appli web rapidementHoracio Gonzalez
 
ENIB 2015 2016 - CAI Web S02E01- Côté Navigateur 2/3 - HTML5 / CSS3 / Twitter...
ENIB 2015 2016 - CAI Web S02E01- Côté Navigateur 2/3 - HTML5 / CSS3 / Twitter...ENIB 2015 2016 - CAI Web S02E01- Côté Navigateur 2/3 - HTML5 / CSS3 / Twitter...
ENIB 2015 2016 - CAI Web S02E01- Côté Navigateur 2/3 - HTML5 / CSS3 / Twitter...Horacio Gonzalez
 
Le meilleur pour votre site WordPress
Le meilleur pour votre site WordPressLe meilleur pour votre site WordPress
Le meilleur pour votre site WordPressAurélien Denis
 
64 conneries que font les référenceurs avec WordPress
64 conneries que font les référenceurs avec WordPress64 conneries que font les référenceurs avec WordPress
64 conneries que font les référenceurs avec WordPressAurélien Denis
 
Accélérez le développement de vos interfaces web
Accélérez le développement de vos interfaces webAccélérez le développement de vos interfaces web
Accélérez le développement de vos interfaces webGrégoire Larreur de Farcy
 
Bien débuter dans la conception d'un thème WordPress
Bien débuter dans la conception d'un thème WordPressBien débuter dans la conception d'un thème WordPress
Bien débuter dans la conception d'un thème WordPressAurélien Denis
 
Codedarmor 2012 - 06/03 - HTML5, CSS3 et Javascript
Codedarmor 2012 - 06/03 - HTML5, CSS3 et JavascriptCodedarmor 2012 - 06/03 - HTML5, CSS3 et Javascript
Codedarmor 2012 - 06/03 - HTML5, CSS3 et Javascriptcodedarmor
 
Optimiser son référencement WordPress - QueDuWeb 2016
Optimiser son référencement WordPress - QueDuWeb 2016Optimiser son référencement WordPress - QueDuWeb 2016
Optimiser son référencement WordPress - QueDuWeb 2016Daniel Roch - SeoMix
 
Wordpress et SEO - Campus Made in Blog 2014 Montréal
Wordpress et SEO - Campus Made in Blog 2014 MontréalWordpress et SEO - Campus Made in Blog 2014 Montréal
Wordpress et SEO - Campus Made in Blog 2014 MontréalMade in
 
ENIB 2015-2016 - CAI Web - S01E01- Côté navigateur 2/3 - HTML5, CSS3, Twitte...
ENIB 2015-2016 - CAI Web -  S01E01- Côté navigateur 2/3 - HTML5, CSS3, Twitte...ENIB 2015-2016 - CAI Web -  S01E01- Côté navigateur 2/3 - HTML5, CSS3, Twitte...
ENIB 2015-2016 - CAI Web - S01E01- Côté navigateur 2/3 - HTML5, CSS3, Twitte...Horacio Gonzalez
 
Wordpress et referencement naturel - WordCamp Paris 2013, Daniel Roch
Wordpress et referencement naturel - WordCamp Paris 2013, Daniel RochWordpress et referencement naturel - WordCamp Paris 2013, Daniel Roch
Wordpress et referencement naturel - WordCamp Paris 2013, Daniel RochDaniel Roch - SeoMix
 

Tendances (20)

Comment réussir une migration de site web en seo ?
Comment réussir une migration de site web en seo ?Comment réussir une migration de site web en seo ?
Comment réussir une migration de site web en seo ?
 
Magento et SEO : le combo parfait pour développer son e-commerce
Magento et SEO : le combo parfait pour développer son e-commerceMagento et SEO : le combo parfait pour développer son e-commerce
Magento et SEO : le combo parfait pour développer son e-commerce
 
HTML5 - Sémantique, structure et nouveaux éléments
HTML5 - Sémantique, structure et nouveaux élémentsHTML5 - Sémantique, structure et nouveaux éléments
HTML5 - Sémantique, structure et nouveaux éléments
 
HTML5, le web de demain - BNSA
HTML5, le web de demain - BNSAHTML5, le web de demain - BNSA
HTML5, le web de demain - BNSA
 
10 conseils pour booster les performances de votre site sous WordPress
10 conseils pour booster les performances de votre site sous WordPress10 conseils pour booster les performances de votre site sous WordPress
10 conseils pour booster les performances de votre site sous WordPress
 
Web performance - appliquer les règles de base
Web performance - appliquer les règles de baseWeb performance - appliquer les règles de base
Web performance - appliquer les règles de base
 
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 html5 css3 java script
Formation html5 css3 java scriptFormation html5 css3 java script
Formation html5 css3 java script
 
ENIB 2013-2014 - CAI Web #3: J’ai besoin d’une appli web rapidement
ENIB 2013-2014 - CAI Web #3: J’ai besoin d’une appli web rapidementENIB 2013-2014 - CAI Web #3: J’ai besoin d’une appli web rapidement
ENIB 2013-2014 - CAI Web #3: J’ai besoin d’une appli web rapidement
 
ENIB 2015 2016 - CAI Web S02E01- Côté Navigateur 2/3 - HTML5 / CSS3 / Twitter...
ENIB 2015 2016 - CAI Web S02E01- Côté Navigateur 2/3 - HTML5 / CSS3 / Twitter...ENIB 2015 2016 - CAI Web S02E01- Côté Navigateur 2/3 - HTML5 / CSS3 / Twitter...
ENIB 2015 2016 - CAI Web S02E01- Côté Navigateur 2/3 - HTML5 / CSS3 / Twitter...
 
Le meilleur pour votre site WordPress
Le meilleur pour votre site WordPressLe meilleur pour votre site WordPress
Le meilleur pour votre site WordPress
 
64 conneries que font les référenceurs avec WordPress
64 conneries que font les référenceurs avec WordPress64 conneries que font les référenceurs avec WordPress
64 conneries que font les référenceurs avec WordPress
 
Accélérez le développement de vos interfaces web
Accélérez le développement de vos interfaces webAccélérez le développement de vos interfaces web
Accélérez le développement de vos interfaces web
 
Bien débuter dans la conception d'un thème WordPress
Bien débuter dans la conception d'un thème WordPressBien débuter dans la conception d'un thème WordPress
Bien débuter dans la conception d'un thème WordPress
 
Codedarmor 2012 - 06/03 - HTML5, CSS3 et Javascript
Codedarmor 2012 - 06/03 - HTML5, CSS3 et JavascriptCodedarmor 2012 - 06/03 - HTML5, CSS3 et Javascript
Codedarmor 2012 - 06/03 - HTML5, CSS3 et Javascript
 
Optimiser son référencement WordPress - QueDuWeb 2016
Optimiser son référencement WordPress - QueDuWeb 2016Optimiser son référencement WordPress - QueDuWeb 2016
Optimiser son référencement WordPress - QueDuWeb 2016
 
Wordpress et SEO - Campus Made in Blog 2014 Montréal
Wordpress et SEO - Campus Made in Blog 2014 MontréalWordpress et SEO - Campus Made in Blog 2014 Montréal
Wordpress et SEO - Campus Made in Blog 2014 Montréal
 
ENIB 2015-2016 - CAI Web - S01E01- Côté navigateur 2/3 - HTML5, CSS3, Twitte...
ENIB 2015-2016 - CAI Web -  S01E01- Côté navigateur 2/3 - HTML5, CSS3, Twitte...ENIB 2015-2016 - CAI Web -  S01E01- Côté navigateur 2/3 - HTML5, CSS3, Twitte...
ENIB 2015-2016 - CAI Web - S01E01- Côté navigateur 2/3 - HTML5, CSS3, Twitte...
 
Wordpress et referencement naturel - WordCamp Paris 2013, Daniel Roch
Wordpress et referencement naturel - WordCamp Paris 2013, Daniel RochWordpress et referencement naturel - WordCamp Paris 2013, Daniel Roch
Wordpress et referencement naturel - WordCamp Paris 2013, Daniel Roch
 
WordPress et SEO - SEOCampus 2013
WordPress et SEO - SEOCampus 2013WordPress et SEO - SEOCampus 2013
WordPress et SEO - SEOCampus 2013
 

Similaire à HTML5 maintenant partie 1 : la sémantique

L'histoire d'html5 pour les développeurs windows phone 8
L'histoire d'html5 pour les développeurs windows phone 8L'histoire d'html5 pour les développeurs windows phone 8
L'histoire d'html5 pour les développeurs windows phone 8davrous
 
Les dernières avancées HTML5 & CSS3 en action !
Les dernières avancées HTML5 & CSS3 en action !Les dernières avancées HTML5 & CSS3 en action !
Les dernières avancées HTML5 & CSS3 en action !Microsoft Technet France
 
Les dernières avancées html5 & css3 en action !
Les dernières avancées html5 & css3 en action !Les dernières avancées html5 & css3 en action !
Les dernières avancées html5 & css3 en action !davrous
 
Introduction au développement windows 8 modern ui avec html5 et javascript
Introduction au développement windows 8 modern ui avec html5 et javascriptIntroduction au développement windows 8 modern ui avec html5 et javascript
Introduction au développement windows 8 modern ui avec html5 et javascriptdavrous
 
Introduction au développement Windows 8 ModernUI avec HTML5 et JavaScript
Introduction au développement Windows 8 ModernUI avec HTML5 et JavaScriptIntroduction au développement Windows 8 ModernUI avec HTML5 et JavaScript
Introduction au développement Windows 8 ModernUI avec HTML5 et JavaScriptMicrosoft
 
Développement Web - HTML5, CSS3, APIs Web
Développement Web - HTML5, CSS3, APIs WebDéveloppement Web - HTML5, CSS3, APIs Web
Développement Web - HTML5, CSS3, APIs WebYoann Gotthilf
 
Enib cours c.a.i. web - séance #1 - html5 css3-js - 2
Enib   cours c.a.i. web - séance #1 - html5 css3-js - 2Enib   cours c.a.i. web - séance #1 - html5 css3-js - 2
Enib cours c.a.i. web - séance #1 - html5 css3-js - 2Horacio Gonzalez
 
ISCOM::HTML/CSS::session1 (20140930)
ISCOM::HTML/CSS::session1 (20140930)ISCOM::HTML/CSS::session1 (20140930)
ISCOM::HTML/CSS::session1 (20140930)Nicolas Aguenot
 
Responsive design - Twitter Bootstrap [FR]
Responsive design - Twitter Bootstrap [FR]Responsive design - Twitter Bootstrap [FR]
Responsive design - Twitter Bootstrap [FR]Jean-Noël Aubry
 
Webinar HTML5 Microsoft Intel
Webinar HTML5 Microsoft IntelWebinar HTML5 Microsoft Intel
Webinar HTML5 Microsoft Inteldavrous
 
CSS3 - Possibilite creatives
CSS3 - Possibilite creativesCSS3 - Possibilite creatives
CSS3 - Possibilite creativesRémy Savard
 
Confoo - 2012-02-27 au 2012-02-28 - HTML5 workshop
Confoo - 2012-02-27 au 2012-02-28 - HTML5 workshopConfoo - 2012-02-27 au 2012-02-28 - HTML5 workshop
Confoo - 2012-02-27 au 2012-02-28 - HTML5 workshopFrédéric Harper
 
HTML5 W3C Conference Euratechnologie
HTML5 W3C Conference EuratechnologieHTML5 W3C Conference Euratechnologie
HTML5 W3C Conference Euratechnologiewyggio
 
Internationalisation du Front
Internationalisation du FrontInternationalisation du Front
Internationalisation du FrontYannick Croissant
 
La boîte à outils de développements dans Firefox
La boîte à outils de développements dans FirefoxLa boîte à outils de développements dans Firefox
La boîte à outils de développements dans FirefoxChristophe Villeneuve
 
agoraCMS - WordPress, thèmes et plugins : mode d'emploi
agoraCMS - WordPress, thèmes et plugins : mode d'emploiagoraCMS - WordPress, thèmes et plugins : mode d'emploi
agoraCMS - WordPress, thèmes et plugins : mode d'emploiLionel Pointet
 
ENIB 2016 2017 - CAI Web S02E01- Côté navigateur 2/3 - HTML5, CSS3, Twitter B...
ENIB 2016 2017 - CAI Web S02E01- Côté navigateur 2/3 - HTML5, CSS3, Twitter B...ENIB 2016 2017 - CAI Web S02E01- Côté navigateur 2/3 - HTML5, CSS3, Twitter B...
ENIB 2016 2017 - CAI Web S02E01- Côté navigateur 2/3 - HTML5, CSS3, Twitter B...Horacio Gonzalez
 

Similaire à HTML5 maintenant partie 1 : la sémantique (20)

Nouveaux apis
Nouveaux apisNouveaux apis
Nouveaux apis
 
L'histoire d'html5 pour les développeurs windows phone 8
L'histoire d'html5 pour les développeurs windows phone 8L'histoire d'html5 pour les développeurs windows phone 8
L'histoire d'html5 pour les développeurs windows phone 8
 
Les dernières avancées HTML5 & CSS3 en action !
Les dernières avancées HTML5 & CSS3 en action !Les dernières avancées HTML5 & CSS3 en action !
Les dernières avancées HTML5 & CSS3 en action !
 
Les dernières avancées html5 & css3 en action !
Les dernières avancées html5 & css3 en action !Les dernières avancées html5 & css3 en action !
Les dernières avancées html5 & css3 en action !
 
Introduction au développement windows 8 modern ui avec html5 et javascript
Introduction au développement windows 8 modern ui avec html5 et javascriptIntroduction au développement windows 8 modern ui avec html5 et javascript
Introduction au développement windows 8 modern ui avec html5 et javascript
 
Introduction au développement Windows 8 ModernUI avec HTML5 et JavaScript
Introduction au développement Windows 8 ModernUI avec HTML5 et JavaScriptIntroduction au développement Windows 8 ModernUI avec HTML5 et JavaScript
Introduction au développement Windows 8 ModernUI avec HTML5 et JavaScript
 
Développement Web - HTML5, CSS3, APIs Web
Développement Web - HTML5, CSS3, APIs WebDéveloppement Web - HTML5, CSS3, APIs Web
Développement Web - HTML5, CSS3, APIs Web
 
Enib cours c.a.i. web - séance #1 - html5 css3-js - 2
Enib   cours c.a.i. web - séance #1 - html5 css3-js - 2Enib   cours c.a.i. web - séance #1 - html5 css3-js - 2
Enib cours c.a.i. web - séance #1 - html5 css3-js - 2
 
ISCOM::HTML/CSS::session1 (20140930)
ISCOM::HTML/CSS::session1 (20140930)ISCOM::HTML/CSS::session1 (20140930)
ISCOM::HTML/CSS::session1 (20140930)
 
Responsive design - Twitter Bootstrap [FR]
Responsive design - Twitter Bootstrap [FR]Responsive design - Twitter Bootstrap [FR]
Responsive design - Twitter Bootstrap [FR]
 
Webinar HTML5 Microsoft Intel
Webinar HTML5 Microsoft IntelWebinar HTML5 Microsoft Intel
Webinar HTML5 Microsoft Intel
 
CSS3 - Possibilite creatives
CSS3 - Possibilite creativesCSS3 - Possibilite creatives
CSS3 - Possibilite creatives
 
HTML5
HTML5HTML5
HTML5
 
Confoo - 2012-02-27 au 2012-02-28 - HTML5 workshop
Confoo - 2012-02-27 au 2012-02-28 - HTML5 workshopConfoo - 2012-02-27 au 2012-02-28 - HTML5 workshop
Confoo - 2012-02-27 au 2012-02-28 - HTML5 workshop
 
HTML5 W3C Conference Euratechnologie
HTML5 W3C Conference EuratechnologieHTML5 W3C Conference Euratechnologie
HTML5 W3C Conference Euratechnologie
 
Accessibilite web wcag rgaa
Accessibilite web wcag rgaaAccessibilite web wcag rgaa
Accessibilite web wcag rgaa
 
Internationalisation du Front
Internationalisation du FrontInternationalisation du Front
Internationalisation du Front
 
La boîte à outils de développements dans Firefox
La boîte à outils de développements dans FirefoxLa boîte à outils de développements dans Firefox
La boîte à outils de développements dans Firefox
 
agoraCMS - WordPress, thèmes et plugins : mode d'emploi
agoraCMS - WordPress, thèmes et plugins : mode d'emploiagoraCMS - WordPress, thèmes et plugins : mode d'emploi
agoraCMS - WordPress, thèmes et plugins : mode d'emploi
 
ENIB 2016 2017 - CAI Web S02E01- Côté navigateur 2/3 - HTML5, CSS3, Twitter B...
ENIB 2016 2017 - CAI Web S02E01- Côté navigateur 2/3 - HTML5, CSS3, Twitter B...ENIB 2016 2017 - CAI Web S02E01- Côté navigateur 2/3 - HTML5, CSS3, Twitter B...
ENIB 2016 2017 - CAI Web S02E01- Côté navigateur 2/3 - HTML5, CSS3, Twitter B...
 

Plus de Jean-Pierre Vincent

Mesurer la performance : onload, pages
Mesurer la performance : onload, pagesMesurer la performance : onload, pages
Mesurer la performance : onload, pagesJean-Pierre Vincent
 
Les Performance de rendu sur mobile
Les Performance de rendu sur mobileLes Performance de rendu sur mobile
Les Performance de rendu sur mobileJean-Pierre Vincent
 
Performances web - quoi de neuf ?
Performances web - quoi de neuf ?Performances web - quoi de neuf ?
Performances web - quoi de neuf ?Jean-Pierre Vincent
 
Accélération des pages Web : les bases en exemple
Accélération des pages Web : les bases en exempleAccélération des pages Web : les bases en exemple
Accélération des pages Web : les bases en exempleJean-Pierre Vincent
 
Techniques accélération des pages web #kiwiparty
Techniques accélération des pages web #kiwipartyTechniques accélération des pages web #kiwiparty
Techniques accélération des pages web #kiwipartyJean-Pierre Vincent
 
Techniques d'accélération des pages web
Techniques d'accélération des pages webTechniques d'accélération des pages web
Techniques d'accélération des pages webJean-Pierre Vincent
 
Le monitoring de la performance front
Le monitoring de la performance frontLe monitoring de la performance front
Le monitoring de la performance frontJean-Pierre Vincent
 
Function oop - bonnes pratiques ms tech days
Function   oop - bonnes pratiques ms tech daysFunction   oop - bonnes pratiques ms tech days
Function oop - bonnes pratiques ms tech daysJean-Pierre Vincent
 
Fondamentaux portée - contexte - function ms tech days
Fondamentaux   portée - contexte - function ms tech daysFondamentaux   portée - contexte - function ms tech days
Fondamentaux portée - contexte - function ms tech daysJean-Pierre Vincent
 
Retours sur le concours Webperf 2010
Retours sur le concours Webperf 2010Retours sur le concours Webperf 2010
Retours sur le concours Webperf 2010Jean-Pierre Vincent
 
Javascript : fondamentaux et OOP
Javascript : fondamentaux et OOPJavascript : fondamentaux et OOP
Javascript : fondamentaux et OOPJean-Pierre Vincent
 
Télés connectées et développement Web
Télés connectées et développement WebTélés connectées et développement Web
Télés connectées et développement WebJean-Pierre Vincent
 

Plus de Jean-Pierre Vincent (15)

Mesurer la performance : onload, pages
Mesurer la performance : onload, pagesMesurer la performance : onload, pages
Mesurer la performance : onload, pages
 
Les Performance de rendu sur mobile
Les Performance de rendu sur mobileLes Performance de rendu sur mobile
Les Performance de rendu sur mobile
 
La performance sur mobile
La performance sur mobileLa performance sur mobile
La performance sur mobile
 
Performances web - quoi de neuf ?
Performances web - quoi de neuf ?Performances web - quoi de neuf ?
Performances web - quoi de neuf ?
 
Accélération des pages Web : les bases en exemple
Accélération des pages Web : les bases en exempleAccélération des pages Web : les bases en exemple
Accélération des pages Web : les bases en exemple
 
Introduction à la webperf
Introduction à la webperfIntroduction à la webperf
Introduction à la webperf
 
Techniques accélération des pages web #kiwiparty
Techniques accélération des pages web #kiwipartyTechniques accélération des pages web #kiwiparty
Techniques accélération des pages web #kiwiparty
 
Techniques d'accélération des pages web
Techniques d'accélération des pages webTechniques d'accélération des pages web
Techniques d'accélération des pages web
 
Le monitoring de la performance front
Le monitoring de la performance frontLe monitoring de la performance front
Le monitoring de la performance front
 
Les performances Web mobile
Les performances Web mobileLes performances Web mobile
Les performances Web mobile
 
Function oop - bonnes pratiques ms tech days
Function   oop - bonnes pratiques ms tech daysFunction   oop - bonnes pratiques ms tech days
Function oop - bonnes pratiques ms tech days
 
Fondamentaux portée - contexte - function ms tech days
Fondamentaux   portée - contexte - function ms tech daysFondamentaux   portée - contexte - function ms tech days
Fondamentaux portée - contexte - function ms tech days
 
Retours sur le concours Webperf 2010
Retours sur le concours Webperf 2010Retours sur le concours Webperf 2010
Retours sur le concours Webperf 2010
 
Javascript : fondamentaux et OOP
Javascript : fondamentaux et OOPJavascript : fondamentaux et OOP
Javascript : fondamentaux et OOP
 
Télés connectées et développement Web
Télés connectées et développement WebTélés connectées et développement Web
Télés connectées et développement Web
 

HTML5 maintenant partie 1 : la sémantique