1. Les nouvelles fonctionnalités HTML5 principales
1. Lecture audio et vidéo locale;
2. Animation;
3. Informations géographiques;
4. Accélération matérielle;
5. Exécutez localement (même après l'interrompu la connexion Internet);
6. Stockage local;
7. Faites glisser et déposez les fichiers du bureau pour les télécharger au navigateur;
8. Marqueurs sémantiques;
2. État actuel de l'application HTML5
Aujourd'hui, les principaux navigateurs ont un support différent pour HTML5. Nous attendons avec impatience qu'ils deviennent cohérents en un ou deux ans. Vous pouvez penser que, comme c'est le cas, probablement peu de gens utilisent cette future norme maintenant. Ce n'est pas le cas. HTML5 a été largement utilisé maintenant. Comme William Gibson l'a dit, le futur Web est arrivé, mais il n'a pas encore été largement adopté.
Vous ne savez peut-être pas que la page d'accueil de Google utilise également HTML5, mais à l'heure actuelle, ils n'utilisent que HTML5 Doctype, et le reste de la page est toujours un ancien code, mais Google a largement adopté HTML5 dans leurs différentes applications. L'exemple le plus typique est Gmail. Le stockage hors ligne HTML5 permet aux utilisateurs d'utiliser Gmail même lorsqu'il est hors ligne. De plus, Google Docs utilise également un stockage hors ligne. Des applications similaires d'autres fabricants qui utilisent également un stockage hors ligne comprennent la suite de bureaux de Zoho et la plate-forme de blog de WordPress. Si vous êtes intéressé par le stockage hors ligne de HTML5, vous pouvez jeter un œil à l'article Mark Pilgrim's How to Add To Adprowing Offline Support à vos applications.
3. Lecteur de documents basé sur Scribd HTML5
L'image ci-dessus est le nouveau lecteur de document de Scribd, le tout basé sur les normes Web et ne pas utiliser de flash
En plus des vidéos, HTML5 peut remplacer Flash sous de nombreux aspects. Le site de partage de documents Scribd a récemment annoncé qu'ils utiliseraient HTML5 pour remplacer Flash pour implémenter les lecteurs de documents. Scribd est le meilleur exemple des fonctionnalités étonnantes que HTML5 peut atteindre en combinaison avec CSS. Ils utilisent également @ FONT-FACE pour implémenter des polices personnalisées. De plus, l'effet de transformation lors du tournage des pages est également complètement basé sur CSS3. La combinaison de ces outils Web standard permet à Scribd d'atteindre le HTML exagéré du flash à un HTML pur, sans sacrifier la fonctionnalité des documents dans la structure, les polices, les images embarquées, les couches, etc. Les derniers lecteurs de documents de Scribd prennent même en charge IE6, voici un exemple qui utilise un HTML pur pour sortir des formules complexes.
4. Videos HTML5 Canvas et HTML5
Invaders Classic Game basé sur des objets en toile HTML5
Bien que l'application de Canvas par Scribd soit superbe, nous pouvons trouver plus de sites de ce type. Canvas Demos propose une gamme d'applications sur la toile, de divers jeux en ligne aux applications arc-en-ciel qui extraient les couleurs des pages Web.
Les exemples les plus typiques sur les vidéos sont YouTube et Vimeo, qui fournissent tous deux des versions HTML5.
5. Positionnement d'informations géographiques HTML5
Cliquez sur le cercle au-dessus du méchant jaune dans la carte pour indiquer à Google Maps votre emplacement géographique
Une autre caractéristique de HTML5 est la fonction de géolocalisation. Certains navigateurs fournissent une API de géolocalisation, qui est également gérée par W3C et peut combiner HTML5 pour atteindre votre emplacement de géolocalisation actuel. Google Maps utilisant cette fonctionnalité, il y a un petit cercle sur Google Maps. Cliquez simplement pour indiquer à Google Maps où vous en êtes maintenant. Actuellement, l'API Geolocation n'est pas largement adoptée par de nombreux navigateurs de bureau (seul Chrome et Firefox 3.6+), mais le plugin Google Gears peut aider les anciens navigateurs à implémenter cette fonctionnalité.
Twitter utilise cela pour réaliser les messages géographiques des informations sur les informations. Lorsque le navigateur prend en charge l'API Geolocation, il utilisera automatiquement l'API. Sinon, Google Gears sera utilisé.
6. Plus de significations de HTML5
HTML5 a beaucoup plus de sens que ce qui précède. Sa plus grande importance réside dans le changement de la structure des documents Web. Avec l'aide de l'en-tête, du pied de page, de la section, de l'article, etc., nous pouvons implémenter des documents Web plus structurés et sémantiques. De cette façon, les moteurs de recherche peuvent facilement indexer les sites Web, et nous pouvons également rechercher des informations plus rapides et plus précises.
Il existe d'innombrables sites qui utilisent les nouvelles balises HTML5, et vous pouvez trouver un grand nombre de ces sites dans HTML5GALERY. Si vous souhaitez utiliser la nouvelle structure HTML5 maintenant, vous pourriez aussi bien jeter un œil à ce tutoriel HTML5.
De plus, avec l'aide de microdata, HTML5 peut également implémenter une structure sémantique plus puissante. Ce format de données standardisé (similaire aux microformats) permet à votre site de fournir non seulement des données, mais également de fournir des définitions de données. Les microdata sont d'une grande importance pour les navigateurs et les moteurs de recherche. Les moteurs de recherche peuvent utiliser des microdata pour découvrir des amis sur votre réseau, et les navigateurs peuvent se connecter à votre site d'amis de réseaux sociaux. Vous pouvez en faire l'expérience dans l'outil de test des riches extraits de Google.