Le site d'Apple est passé en HTML5.
Je viens de le découvrir ainsi que des tas de blogs et de sites en HTML5 via 101besthtml5sites.com, une galerie où devraient figurer the best HTML5 sites including tutorials and demos. Celui d'Apple est juste à côté de mon blog d'ailleurs (à l'initiative de Keith, l'un de ses animateurs). Mais est-ce pour autant un site HTML5 ? Non.
• • •Vous allez dire que je ne suis pas bon joueur mais, cette visite de blogs et de sites dits en « HTML5 », m'a désespéré. Dans leur grande majorité ils n'ont d'HTML5 que le doctype. Ils sont bourrés de div, et, qui plus est, n'utilisent pas les nouvelles balises HTML5.
Okey : oui, j'encourage la refonte d'un site en HTML5 en y allant par paliers. Moderato en intégrant les balises dont la définition est maintenant certaine et en adaptant les feuilles de style existantes, puis de monter allegro quand tous les navigateurs modernes reconnaîtront toutes les propriétés CSS3 ou HTML5. Bien sûr on peut pallier les problèmes d'interprétation par l'ajout de scripts qui vont, soit faire reconnaître le codage HTML5 par les navigateurs, soit leur inculquer les propriétés des CSS3, mais avant d'envisager de leur apprendre la modernité, il faudrait un temps soit peu s'y mettre soi-même, non ? Et c'est là où je veux en venir. Tout gentil qu'ils peuvent l'être, l'équipe de 101besthtml5sites.com a l'ambition de gagner du pognon en exploitant le filon HTML5. Ce sont des ricains so, « they're only in it for the money ». HTML5, c'est l'engouement du moment. Jobs et Adobe ont bien contribué à faire comprendre au public consommateur que tout cela, eh bien, c'est une affaire de gros sous. Oui : HTML5 c'est un enjeu énorme pour un paquet d'acteurs : pour ceux qui produisent en utilisant son code bien sûr, mais tous ces marchands autour qui vont chercher à vous vendre des T-Shirts ou des mugs flammés au logo... qui reste à inventer. Plus sérieusement ce sont ces vendeurs de logiciels ou ces sites MFA qui font leur beurre des visiteurs attirés par la nouveauté HTML5. « Les meilleurs sites HTML5 avec des tutoriels et des démos » dixit « 101besthtml5sites.com ». C'est d'ailleurs dans cette catégorie « tutorials » que le Débloque-notes a été classé d'ailleurs. C'est une indication sur le sérieux de la sélection n'est -ce pas ? « 101besthtml5sites.com » va chercher le meilleur pour l'associer au pire et fourre tout ça dans un site qui n'est même pas en HTML5. Le comble !
Le meilleur ? Je l'ai dit : le meileur site HTML5 et CSS3 au monde c'est celui de Kroc Camen que l'on trouve quand même dans leurs galeries. Dans la rubrique Business en plus : quand on lit son blog (il y a un manifeste dans un coin à ne pas louper), quand on regarde son balisage, le chef d'œuvre que constitue sa CSS, on est à genoux et on prie : Syntaxe ! Priez pour moi !
Mais son site traîne dans le fond du classement alors qu'il devrait être en première place sur le podium. Il a un note minable de 3.3 (sur une échelle de 5 alors qu'il devrait être à 10/12 !). Pire encore, si vous effectuez une recherche sur camen, son prénom, le résultat vous renverra vers une page qui n'existe pas.
Il y a un problème : dans leur grande majorité les sites et blogues présentés n'ont d'HTML5 que le doctype. Ils sont bourrés de div, et, qui plus est, n'utilisent pas les nouvelles balises HTML5. Si on considère le peu de respect au code de la majorité des sites présents dans cette galerie positionnée tout de même dans le « Top of the notch HML5 websites » on se dit qu'il y a tromperie sur la marchandise.
C'est le cas d'Apple (Apple !) : des header certes, mais pas de footer ; des section mais pas d'article ; pas de figure, pas de balise mark. Que du HTML5 à minima somme toute que je vous laisse découvrir en cliquant sur le lien contenu dans l'image.

Commentaires :
(pardon pour écrire en Anglais, mais comme tu sais bien, mon Français est... ptui. :D)
You know, the Apple site is a very public site which needs to work in a wide variety of browsers and any number of [old] system platforms. While it's nice to see them *try* to move parts of their website towards HTML5, it's a bit too early to demand that it should be completely HTML5-ized, yet.
I do agree however that it's sad to see sites that claim to use HTML5 but haven't really done much more than change the doctype.
Thanks for the link to 101besthtml5sites though - I should submit one or two of my own... ;)
Salut!
Your french is ptui? It just needs some improvements.
Apple's website not completely HTML5-ized due to 'vintage' browsers?
Why didn't they use modernizr.js and html5.js scripts?
(BTW this big insurance company, GMF, makes it:
www.epargnegmf.fr)
I'm pretty sure they're on the way to make it full HTML5 and CSS3 compliant.
C'mon c'mon Apple dare HTML5!
I'm also trying... (Swedish design studio's website in HTML5 - current pages served by GetSimple, there's a portfolio and sNews-powered blog coming as well)
And, in the name of fairness, we could compare to the other big software/browser maker: Microsoft Internet Internet Explorer 8 home page - they really have some work to do... :D
There were sections headers footers. There were using Cufon to print the corporate font... and more.
And now they rolled back to good ol'HTML. Weirdo.
They might have had some trouble with IE6 clients: in this browser it was very very slow.
I know you don't like IE as almost half of the human kind: but Mickeysoft knows he has to go HTML5. Next IE will speak modern code.
BTW, is it for this reason your HTML5 secret blog doesn't load its @font-face 'Forelle' in my IE8? ;-)
And no, I can't see any reason for you not to see Forelle... hm, the resources are referenced from the server and the files are in place, and you should get the .eot file, so... don't know exactly what's going on.
Here's the stylesheet rule for it:
@font-face {font-family: 'Forelle';
src: url('http://domain-name/webfonts/Forelle-fontfacekit/Forelle.eot');
src: local('Forelle Regular'), local('Forelle-Regular'), url('http://domain-name/webfonts/Forelle-fontfacekit/Forelle.ttf') format('truetype');
}
I just tried it on one of my Macs that doesn't have Forelle installed and I see it well, but I don't have IE8 anywhere so I can't really see what's happening. Sorry.
As for IE, the only thing I dislike about it, which is partly due to its age, is its relative lack of (or will to) standards support. But that's just me, people should use what they like. However, we've heard Micro$quat claim a number of times that the next IE will "follow standards", just to find that, oops, it missed the mark a bit. :D
@font-face {font-family: 'Forelle';
src: url('fonts/Forelle.eot');
src: local('Forelle'), local('Forelle'), url('fonts/Forelle.ttf') format('truetype')
}
/* */
.forelle{font-family: Forelle}
Path is relative to my subdomain root.
Tested on line and offline. It works.
Mickeysoft just became a follower. Pretty soon they gonna be dead. But it's gonna take about 20 damn years to bury the company.
Thanks!
PS. The small changes here are a definite improvement - the site looks great on my old Powerbook (G3) as well as a newer iMac. Félicitations!
Eh eh... you made it Fred.
Now ball-ball.net is IE8 and @font-face compliant.
Thanks dude. But the inspecteur is still an amateur.