Blog

  • Euthenasing Internet Explorer 6

    I think, much of the time, when website owners and developers decide to drop support for IE6, we go about it the wrong way.

    For a not-for-profit, like WordPress.org, the decision can be simple. The project is free and the cost is resources. To no longer support IE6 in their admin means the WordPress team can develop more efficiently. When a website makes a profit, however, I think the decision is black and white.
    (more…)

  • Putting the “distributed” in CDN

    I wrote yesterday that Google appeared to have taken the “distributed” out of their public CDN hosting of a variety of JavaScript libraries. I even provided some trace routes comparing their CDN to Microsoft’s. I was wrong.

    Unlike James Collins, we don’t have terminal access to any servers in Australia. As I’ve detailed before, our sites are hosted in the US. James was kind and diligent enough to do some further testing comparing Microsoft’s CDN to Google’s. He found they resolved as follows:

    Location Google Microsoft
    Melbourne, AU US Sydney
    Sydney, AU Sydney US
    Perth, AU Sydney US

    If you have the chance, I’d love you to test where ajax.aspnetcdn.com and ajax.googleapis.com resolve to for you. You can do a traceroute and you should be able to work out the destination from host names and response times. Letting me know via twitter is probably easiest, my username is @pwcc.

    Obviously, I should have done all this checking before writing the post. By failing to do so, I look a bit of a tit.

  • Taking the “distributed” out of CDN

    Note: After publishing this article, I was given the results of traceroutes from other Australian cities. The results showed I was wrong.

    Over on Twitter @bobearth, prompted me to run some trace routes against the Google CDN and compare it to the Microsoft CDN. It appears Google have taken the distributed network out of their CDN.

    As you’re probably aware, CDN is an abbreviation for content distributed network. The idea behind them is that American users will be served content from a server located in the US or Canada, Australian users will be served content from a server located in Australia or the Pacific, and so on.

    (more…)

  • !important is Important

    The !important declaration has really bad reputation, and deservedly so. As is often the way, this reputation results from abuse rather an inherent problem with the property itself. An example of its abuse might be:

    #nav {
      float: none !important;
      /* where did I float this? */
    }
    /* ...jumble of code... */
    ul#nav {
        float: left;
    }

    There are, however, instances where the !important declaration is the best tool for the job.

    (more…)

  • Big Red Framework

    We’ve updated the base WordPress theme we use at Soupgiant for WordPress 3.1+ and to make more use of the WordPress API.

    Along with the standard features you would expect in a WordPress framework, it includes

    Never use the framework proper to set up a theme, set up a child theme instead.

    • Copy the files from the starter directory into the base folder of your child theme
    • Create the sub-directory assets in your child theme
    • Copy the framework’s assets/child/ directory into the assets directory of your child theme

    See the WordPress codex page on child themes for more information.

    More documentation to come!

  • Guest Post on Digging into WordPress

    Jeff and Chris have been kind enough to publish Hosting Client Sites on a WordPress Network as a guest post on Digging into WordPress.

    Regular updates keep WordPress secure and expand the feature set, ensuring the platform meets both the developer’s and their client’s needs.

    The flipside of regular updates is the maintenance of WordPress installs. Once you start maintaining more than a few installs for your clients, keeping both plugins and WordPress up to date can become a bit repetitive.

    Setting up a WordPress Network, using the multisite feature, reduces maintenance time. Upgrading all your sites becomes almost as easy as upgrading it for one.

    Head over to Digging into WordPress to read the post and leave a comment.

  • Caching Google’s WebFont Loader

    The Google WebFont Loader provides the following sample code:

    WebFontConfig = {
      google: { families: [ 'Tangerine', 'Cantarell' ] }
    };
    (function() {
      var wf = document.createElement('script');
      wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
          '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
      wf.type = 'text/javascript';
      wf.async = 'true';
      var s = document.getElementsByTagName('script')[0];
      s.parentNode.insertBefore(wf, s);
    })();

    The line in bold indicates version one of webfont.js is being loaded. As with Google’s other hosted libraries providing a more, or less, specific version number will effect both browser caching and whether the webfont.js is upgraded automatically.

    Version in code Version provided Caching period
    1 Latest in Version 1 tree (currently 1.0.17) 1 hour
    1.0 Latest in Version 1.0 tree (currently 1.0.17) 1 hour
    1.0.17 Version 1.0.17 1 year

    By using the exact version number in your code, the load time of your site will improve on return visits as webfont.js will already be cached in your visitors browser. It will be cached on your visitors first visit if they’ve visited another site using the exact version in the last twelve months.

    You can see the latest version available by visiting the Google Libraries Developer Guide. You can specify the exact version number in your code by replacing the bold line in the code sample above with:

    '://ajax.googleapis.com/ajax/libs/webfont/1.0.17/webfont.js';
  • Soupgiant WordPress themes on Github

    Update: We’ve released our updated framework and renamed it the Big Red Framework.

    The Soupgiant base WordPress themes are now available on GitHub. There’s no documentation at this stage, I’ll write up a blog post with details in the coming weeks.

    There are two parts to the theme

    • Soupgiant Parent Theme
      We use this as the parent theme across multiple projects. Any bug fixes or new features applied to this theme will be available to all child themes.
    • Soupgiant Child Theme
      Starting point for each project. Once duplicated for the project, CSS styling and per project PHP customisations are applied/overridden in the child theme. Most projects require a custom header.php & footer.php.

    As I say, documentation to come.

     

  • HTML5: I couldn’t (quite) do it

    For most of my career as a web developer I’ve produced websites that work without JavaScript. For the JavaScript impaired the sites may be missing a minor visual feature or be a little clunky in places, but they work and the meaning remains clear. It doesn’t bother me that, sometimes, the cost of allowing for sites to load without JavaScript can mean missing out on the latest web fashion. I’m not a big fan of fashion.

    Currently, web development is undergoing some major transitions: the HTML5 spec is being developed and CSS3 is being implemented. The browser wars have returned, although this time around, it’s a battle to win developers’ hearts by implementing the newest standards.

    Now is the time for developers to re-evaluate their past practices; moving on from the old and embracing the new. I kept that ethos in mind when upgrading the Soupgiant WordPress base theme recently. Among other things we were porting it to HTML5.

    (more…)

  • Forms are forms, not lists

    Respecting someone or their publication does not prevent one from disagreeing with them. In fact, I think to nod along saying “you’re so right, OMG, you are so right!” is less respectful than listening to and considering what they say. That dealt with, allow me to disagree with some people I respect.

    Frequently, I see HTML forms coded as lists. I’ve seen this in code by some publications and people I highly respect, such as on A List Apart. The code may be:

    <form action="example.php" method="post">
    <ol>
      <li>
        <label for="itemOne">Item One</label>
        <input id="itemOne" name="itemOne" />
      </li>
      <li>
        <label for="itemTwo">Item Two</label>
        <input id="itemTwo" name="itemTwo" />
      </li>
    </ol>
    </form>

    (more…)