I’ve just read Scrolling and Attention, the results of usability research by Jakob Nielsen. It shows some interesting results that influence how web designers position content above or below the fold.
The “fold” is the cutoff line of the bottom of your browser window, where you have to scroll down to see content “below the fold”, and any information/data/content that you do not have to scroll is “above the fold”.
He notes that although users much more willing to scroll than back in the 90′s, there is still a hierarchy of information that a user takes in above others.
He summarises that “most important for the users’ goals or your business goals should be above the fold. Users do look below the fold, but not nearly as much as they look above the fold. “. However, he also notes that the middle content tends to be viewed less than the bottom content, if there is something worth grabbing the user’s attention. This is probably due to the user looking for elements of importance.
It means that a website home page, or any key page should ensure that the most important information should be at the top, but that we shouldn’t be afraid of scrolling.
Also it means that there should be some ‘call to action’ towards the end of the page also, to keep the user’s interest.
One interesting thing is that he notes that paginating content can help reduce the lack of focus on the middle content, however it can also turn the user off continuing to the next page, whereas just scrolling reduces the effort the user has to do. The user should be given motivation to move onto the next page.
This information is relevant to mobile devices, where a user spends a lot more time scrolling than perhaps on a larger screen. The mobile site should still have the most important information at the very top, but give calls to action. The temptation with mobile devices is to paginate everything to reduce the size of the download, however that initiates another download, which requires the user to continue being interested. It seems there is a trade off between download size and keeping the user’s attention.
Any thoughts?
Tags: Mobile, Usability
Posted in Uncategorized, Usability | No Comments »
Version 0.2 has just been released of the Mobile Smart plugin, which is a plugin to help mobile site development in WordPress.
Download through the WordPress.org plugin repository: http://www.wordpress.org/extend/plugins/mobile-smart/ (note: link will open in new window/tab).
Mobile Smart currently contains the following functionality:
Any feedback gladly welcomed.
Tags: iPhone, mobile smart, theme switcher, Wordpress
Posted in Uncategorized | 5 Comments »
Updated 22/12/2009: plugin is now hosted on WordPress.org plugin repository.
I’ve just launched the first of a suite of plugins to aid mobile site development in WordPress, called Mobile Smart.
Download through the WordPress.org plugin repository: http://www.wordpress.org/extend/plugins/mobile-smart/ (note: link will open in new window/tab).
Mobile Smart currently contains the following functionality:
Any feedback gladly welcomed.
Tags: iPhone, Mobile, mobile smart, theme switcher, Wordpress
Posted in Uncategorized | 4 Comments »
I was recently designing a WordPress plugin, and was looking for a way to style its fairly complicated admin page.
To style the output of the plugin content in the site itself is fine, I would just use wp_enqueue_style(...). However, as far as I’m aware, this isn’t available for admin plugin screens.
Posted in Uncategorized | No Comments »
Just as a note for those who are interested in what how this site is built, I have just relaunched it as a WordPress-based site. This will speed up my updates to this site, which in turn means that it stays up to date whilst I’m working on other projects. Blogger to this site via FTP just wasn’t cutting it. Plus I get to look to use some decent plugins to display code better.
Some useful plugins I’m using in the process:
- All in one SEO – this helps manage some of the SEO requirements of this site, especially when it comes to page titles and page meta descriptions. It allows me fine granular control over the descriptions on each page, or can automatically generate each one.
- Google Analytics For WordPress – manages the Google Analytics site tracking for me. There are a few different GA plugins, so I’ll be trying this one to see if it’s any good, and will review this in more detail at a later date.
- Twitter Tools – Twitter integration, allowing me to both tweet on Twitter when I publish a new post here, and also the sidebar shows my latest tweets. This is a good plugin, highly recommended!
Elements still in development:
Posted in Uncategorized | No Comments »
Introduction
This is the second in a series of tutorials explaining how to detect mobile devices and so direct a user to a mobile optimised page.
Who is this tutorial for?
It will be helpful to have read the first in the series: Part 1: The User Agent String.
This tutorial assumes an intermediate level of PHP and xHTML
The Problem of Multiple Devices
In the last tutorial, we looked at how to detect one platform, by grabbing the user agent string, comparing it against the text for ‘iphone’ or ‘ipod’, and then redirecting to an iPhone-optimised web page.
However, there are a myriad of mobile devices in the world. Each mobile device has a browser, some of which are the same (e.g. Opera Mini, or a standard browser for Nokia Series 40), but many are different, and therefore return different user agent strings. It’s also worth noting that sometimes re-releases of the same handset will modify the user agent string slightly.
Tags: iPhone, Mobile, Nokia Series 60, PHP, User Agent
Posted in Uncategorized | No Comments »