background preloader

Compabilité

Facebook Twitter

HTML5 Please - Use the new and shiny responsibly. Making your app real-time is a huge boost and WebSockets give you the ability to add bi-directional communication over a persistent connection to your application to increase interactivity and user engagement. web-socket-js is a natural polyfill for the JavaScript WebSocket API transferring data through Flash Sockets when WebSockets aren't available. To use native WebSockets in Firefox, the prefixed MozWebSocket should be used. However, Firefox 11 will support the IETF standard without the prefix. The protocol backing the Web Socket API has become an IETF standard, but Safari has not yet implemented the new version.

To support Safari, the WebSocket server needs to support both -76 and the RFC6455 versions, or you can use Flash or Java sockets (if available). The -76 version has a possible security problem for users behind buggy transparent proxies. The same security problem exists with Flash sockets and Java sockets. Can I use... Support tables for HTML5, CSS3, etc. Polyfills & Shims - AfterDreams. Derrière ces noms barbares, se cachent deux concepts indispensables lorsqu’on va commencer à développer en HTML5.

En effet lorsqu’on développe en HTML5, certains navigateurs ne vont pas comprendre les nouveautés, les avancées technologiques que ces langages visent. Par exemple, lorsqu’on développe un site avec les Media Queries, il faudrait que ces navigateurs les comprennent d’abord, si c’est pas le cas, on va faire appel à un petit bout de code, une sorte de librairie qui va permettre au navigateur de comprendre ce qu’on est en train de lui dire. On appelle ces librairies des Polyfills c’est à dire que ça va venir remplacer une fonctionnalité, la suppléer sur tout un ensemble de navigateurs. Explorons ensemble les Polyfills les plus répandus dans le Web. Respond.js C’est un script Javascript à inclure dans vos pages HTML qui va permettre à tous les navigateurs de comprendre les Media Queries. Modernizr Modernizr lui est le couteau suisse quand on souhaite développer en HTML5 & CSS3. HTML5 Shiv. Internet Explorer compatibility and version usage[edit] Prior to version 9 of Internet Explorer there was little to no support for HTML5 elements and other HTML5 features.[2] Internet Explorer commands a large percentage of the usage share of web browsers.

Within the Internet Explorer percentage, most of its current usage as of February 2013 comes from version 9, with version 8 holding the second-highest and version 7 the third-highest value.[3] With its high usage percentage, it is important to ensure that web pages function correctly in Internet Explorer. HTML5Shiv allows versions of Internet Explorer prior to version 9 to recognize the HTML5 tags and allows them to be styled using CSS. Usage Example[edit] Using HTML5 Shiv on an HTML5 web page is simple; you may do so with or without installation of the library. Below is an example of how to conditionally include HTML5 Shiv only for Internet Explorer browsers less-than version 9. See also[edit] Modernizr External links[edit] References[edit] HTML5 Boilerplate: The web's most popular front-end template.

Commentaires conditionnels Explorer. Les commentaires conditionnels sont un mécanisme propre à Internet Explorer Windows, qui permettent d'inclure dans une page (X)HTML, de manière valide, du code qui ne sera lu et interprété que par Internet Explorer, ou par l'une ou l'autre de ses versions. Techniquement, il s'agit de simples commentaires HTML, qui seront compris comme tels par la plupart des navigateurs. Cependant, le contenu de ces commentaires a une syntaxe spéciale, qui permet à Internet Explorer de savoir s'il doit interpréter le contenu du commentaire ou bien l'ignorer. Les commentaires conditionnels sont compris par Internet Explorer depuis la version 5.0 mais sont officiellement abandonnés à partir d'Internet Explorer 10.

Syntaxe de base L'exemple le plus simple de commentaire conditionnel est le suivant: Rappel: un commentaire conditionnel ne peut être inséré que dans un document (X)HTML, et ne peut contenir que des instructions (X)HTML et non CSS. Exemple d'utilisation: Viser une version ou un éventail de versions. Conditional stylesheets vs CSS hacks? Answer: Neither! …or… <html>’s conditional classes From what I’ve seen a good number of developers these days are split between conditional stylesheets and css hacks.

You’re used to seeing this: But probably also plenty of this: CSS hacks to target specific browsers stay where the rest of your styles are, but they certainly don’t validate. There are a few problems with it though: Conditional stylesheets mean 1 or 2 additional HTTP requests to downloadAs they are in the the <head>, the rendering of the page waits until they’re totally loaded. Here’s my proposed solution: Using the same conditional comments, we’re just conditionally adding an extra class onto the html tag. Plus it totally validates and works in all browsers. (Hat tip to Paul Hammond and Adam McIntyre for being s-m-r-t.) Doug Avery of Viget points out he prefers to use this technique on the HTML tag, freeing the body tag for dynamic classes.

You fancy something different? 2010.05.07: Oh sheesh ya’ll. 2010.09.07: Update follows! Why? It’s very smart. Qu'est-ce que les hacks CSS ? Tous les navigateurs, selon leur ancienneté ou leur degré de conformité aux standards, n'ont pas un support équivalent vis à vis des propriétés CSS : certains reconnaissent les dernières nouveautés en CSS2, d'autres non. Certains présentent des bugs d'interprétation, etc. Un hack est une technique pour contourner un problème d'interprétation et permettre à un navigateur défectueux d'aboutir à nos fins, soit en détournant une propriété de son usage, soit en utilisant des codes supplémentaires pour pallier aux manques.

Ce genre de "bidouille", est-il nécessaire de le dire, est bien évidemment déconseillée. Il est préférable dans tous les cas, quitte à remanier sa mise en page, d'éviter toutes techniques de contournement. Le principal avantage d'avoir des standards du web, est justement d'éviter d'avoir "une version Internet Explorer", "une version Opera", et ainsi de suite. Les classes conditionnelles en HTML.

Les cancres du Web, Internet Explorer 6, 7 et parfois 8, nous mènent souvent la vie dure. Même quand on s’abaisse à leur niveau, il leur arrive de ne pas comprendre, ou d’y mettre de la mauvaise volonté. La solution classique (comprendre: à l’ancienne) est d’utiliser des hacks CSS. Ces derniers sont déconseillés car peu fiables; en effet, on ne sait jamais à l’avance quels seront les navigateurs sur le marché dans deux ou cinq ans, et comment ils comprendront ou pas nos hacks CSS. Une deuxième solution, conseillée par Microsoft et Alsacréations (que du beau monde :)), est d’utiliser les commentaires conditionnels. Nous allons voir dans cet article que l’utilisation habituelle des commentaires conditionnels a quelques inconvénients, et proposer une technique qui combine plusieurs avantages : les classes conditionnelles.

Le problème des commentaires conditionnels Cependant, dans la pratique, une feuille de style corrective pour Internet Explorer ne suffira pas. Une alternative ?