Using HTTP headers to battle against grandma and the tards aka IE

I've seen quite a few websites include a meta tag in the top of their pages to "force" IE to use its lastest installed engine. Which, as a side note, is the most hilarious show of browser immaturity I have had to work around. As well as enabling chrome frame if they happen to have it installed. After seeing this meta tag on a few websites It got me to thinking.

If http-equiv meta tags are just substitutes for real HTTP headers then maybe we can be more efficient by writing them out in their native environment.

Use set http header to force participation of 'all the things'

Here are some examples of adding headers using various web servers and reverse proxies

nginx

location / { # ect... add_header X-UA-Compatible 'IE=edge,chrome=1'; }

Apache

Header set X-UA-Compatible "IE=Edge,chrome=1"

varnish

sub vcl_deliver { if( resp.http.Content-Type ~ "text/html" ) { set resp.http.X-UA-Compatible = "IE=edge,chrome=1"; } # Other code... }

Worked like a charm! I tested on 2.1.5 but should work on 3.x as well.

While this is a quick and easy way to add this to all the html content served by your server it could produce havoc on (improperly coded?) sites. Be sure you test this setup throughly before running this in production.

Cleaner Solution for Drupal

It's most likely considered best practice to set headers like X-UA-Compatible on a per application basis. To do this in Drupal 7 I suggest using HTML5 Tools module. Its a good start to adding HTML5 compatibility to your Drupal sites.