Posts

Showing posts from October, 2011

Don't let scanablility destroy your website

People don't read they scan -  Really?

Every single web design book, and limitless online articles all advise you that people do not read they scan web pages. They cite tons of studies with scary statistics such as people will click the back button within 2 seconds, they will not read sentences and they will quickly browse your material.

Because of these reasons all of the aforementioned articles recommend to re-write your body copy with this in mind, cut down the text as much as possible.

Why do readers scan and not read?

Is it the medium of web browsing that means you cannot read you have to scan? Many people point to studies showing that reading the same text on a computer takes longer than it does on paper. Well studies do suggest that this is true, but does this really mean that people only scan?

One book on web design I have read recommended performing a ruthless cut of the details of an articles body copy. It is commonly stated that you should
Start with the most important in…

Multi-select with shift on HTML table

Well I was looking into adding a shift select on a checkbox table. After performing a quick search I found a jquery plugin. This was a great start, but I found it would not unselect successfully. I made some minor modifications and now it appears to work in IE9 and FF...

(function($){
  function toggleSelected(element, shouldSelect) {
    $(element).attr("checked", shouldSelect);
    if(shouldSelect){
        $(element).parents("tr").addClass("selected");
    } else {
        $(element).parents("tr").removeClass("selected");
    }
  }

  $.fn.shiftSelectTable = function(){
    var $table = $(this);

    $table.find(":checkbox").click(function(event){
      var last = $table.data("jquery-shift-select-table.last");
      $table.data("jquery-shift-select-table.last", $(this).get());

      if(last == null || !event.shiftKey) {
        $(this).parents("tr").toggleClass("selected");
      }
      else {
        …

IE9 Intranet compatibility mode in Intranet websites

So you have written an HTML5 site on your local intranet with some lovely CCS3 and run it up in Firefox and you feel smug, all your HTML and CSS are perfectly formed, but you run it up in IE9 and all the CSS3 goodness has gone away leaving your lack luster IE7 version of your site.


Why is IE9 running in IE7 compatibility mode?
IE9 has a hidden setting that forces it to run in compatibility mode when it encounters any intranet websites. Microsoft have detailed this behaviour in a Blog about what they call Smart compatibility mode.

You can easily switch off the compatibility mode for specific machines using the internet tools mentioned in the article above, but most of the time developers do not have the luxury of applying corporate wide settings of this nature.

Avoiding Smart compatibility with X-UA-Compatible

Luckily there is a single line of HTML you can that you can use to override this behaviour:

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">…