Web Design

It’s strange how influential an operating system UI can be on web design. I remember back in 2006 everyone was using Apple’s shiny table effect and it seems we may be about to see a wave of websites designed using Microsoft’s Windows 8 ‘Metro’ UI style. Do these large companies that make our most popular devices’ operating systems set the trend, or are they one step ahead? The interesting thing this time round is that the Windows 8 style we see here is designed primarily for touch....

You may have recently noticed that lots of Google search results now show profile pictures of authors alongside the result for the page. I think this adds a nice element of trust to the link, as you can see the person who wrote the page and you can be pretty sure the content comes from a person as opposed to a content aggregator or such like. As always, there’s no exact formula to controlling the search result information, but Google has published some advice for setting this up for your blog or website. ...

The jQuery UI library doesn’t support touch features by default, so trying to use the slider or drag and drop on the iPad won’t work. Fortunately, all that’s required to get this working is a small hack - enter jQuery UI Touch Punch. ...

OpenCart isn’t a system I’ve used before but Packt Publishing asked me to review OpenCart 1.4 Template Design Cookbook by Tahsin Hasan for them so I thought it’d be a good opportunity to learn more about an ecommerce shopping cart system. I spend a lot of time working on PHP/MySQL applications, including Drupal and CodeIgniter, but I haven’t used OpenCart before, so I’m coming to this book and application completely new. ...

Here’s an edgy stand-off I find myself in the middle of every so often – Google Chrome or Mozilla Firefox as my default browser. From a day to day, quick browse, everything is on the web perspective I’d have to say I prefer Google Chrome. It’s fast(er), simple and gets the job done. However, from a web developer perspective Firefox has the add-ons that you so sorely need. I’ve tried designing a Drupal Zen sub-theme with Chrome’s ‘inspect element’ feature but it’s not as comprehensive as the Firebug add-on for Firefox which I couldn’t work without....

This really is one of the strangest software bugs I’ve come across! The Problem Dreamweaver crashes and won’t open again. When you try and open Dreamweaver it just closes straight away, with nothing more than a glimpse of the splash screen. ...

I’ve been taking a few Firefox add-ons for granted, so here’s a little nod to some excellent add-ons which have made my life easier. I’m not going to list 50, simply because I’ve found either some do the same thing, or I don’t end up using them as much as I thought. So here they are: Firebug Web Developer Toolbar Dummy Lipsum IE Tab ...

I ran into a spot of trouble recently with img_assist, in that it only displayed alt text if there was also a caption below the image. Img_Assist takes the alt text from a combination of the title and description, and these fields are filled by default from the title and body of the image node. Although there is no real need for a caption below each image, you will almost always need alt text. The problem was that Drupal wasn’t wrapping the caption in a span, which meant no easy way of hiding it without digging into the module code. This is the HTML output: 1 2 <img class="image _original" width="200" height="75" title="Sunset" alt="Sunset" src="http://example.com/files/images/sunset.jpg"/> <strong>Sunset</strong> ...