Innovation@Sun blog design and functionality update

Recently I helped update Hal Stern’s Innovation@Sun blog on behalf of Hal and Marianne Salciccia, the blog administrator.

Checkout the new design over at http://blogs.sun.com/innovation/

At first glance you might be mistaken to think that aesthetically not a great deal has changed, however Marianne and I did a great deal of work on the site under Hal’s direction (mainly, “Yea, I like that, go with it”, after he saw the staging site we put together).

So what has changed? Well it’s still got the same great content and articles about innovation and innovators at Sun, we just marshalled the content a little better, provided more in site functionality and better meta-data support for all those web robots and crawlers that consume sites ready for inclusion in search engines.

I haven’t listed out all of the changes to the Innovation@Sun site that Marianne and I made, because that would make a rather dull and long list, however I have included the review of the original site that I did for Marianne, along with the suggestions I made, almost all of which were implemented.

Probably shows a little of how I think and break problems down too…

I’ve broken the recommendations into three primary areas: Aesthetic, Functional and Non-Functional, you’ll get the idea.

===================================================================

1) Aesthetic i.e. Look and Feel / Design

1.1) First off I like the design of the site, especially the left and right bordering panels, but they aren’t particularly balanced, so perhaps more content on the right hand side to balance this out.

1.2) Secondly if I scroll down by pages all content in the right hand bordering panel is used up in the first page, and all content in the left hand bordering panel is used up in the second page. However the number of posts you have on the site means that it will continue to scroll down for circa 17 pages of blog entries. This means for the majority of entries on the page there is no supporting information to contextualise it (unless you scroll up). Solutions could be move to a single border (not recommended for now), more content down the borders, and less entries per page. I recommend the latter two options, more content down the borders and fewer entries per page (if your going to have fewer entries per page we need to improve how people can find older content too, more on this below).

1.3) Third, less is more, avoid clutter, and minimize, minimize, minimize; check out my blog at http://blogs.sun.com/eclectic/ which is actually an interpretation of Tim Caynes Sun Blog, you see I’m a technologist, got a graphic designer, but I do know when to get inspiration and help from other people.

1.4) Fourth, given the images on the banner I think it might be nice to link to those innovations, although this is a nice to have, rather than anything else.

1.5) Fifth, I’d look at how the post bodies are arranged them selves, and look at formulating a standard template model for the posts layout. The Innovation@Sun blog seems to contain one to four types of content per post (supporting text, optional supporting image, optional blog radio control, links). Personally I’d go with a model of Blog Radio control top right floating object, people will soon learn it’s always there, supporting text top left and under the blog radio control, any image on the bottom left hand side, followed by links / podcast links. I think this would provide a much easier to read page and thus one people may stay on a little longer and read other articles.

===================================================================

2) Functional i.e. How the site ‘works’

2.1) Jakob Nielsen, ex-Sun staff member, Sun Distinguished Engineer and proclaimed web usability expert first published a list of the top ten web design mistakes in 1996 http://www.useit.com/alertbox/9605.html

For the most part, his original list of mistakes are still problematic today, he has also published a list of top ten “new” web design mistakes in 1999 http://www.useit.com/alertbox/990530.html followed by 2002, 2003 and 2005 too.

As well as the top ten good deeds designers can implement in their web pages http://www.useit.com/alertbox/991003.html

All of these are valuable and relevant sources of good design and functionality information, have a look if you get chance.

2.2) Remove “Blah words” – redundant repetitive text – get rid of it, for instance the calendar used on the site has no entries for this month and so is a ‘dead’ calendar which doesn’t link to anything. Furthermore lots of dates and times for the entries themselves, none of which matters a great deal, because no.1 is the content.

2.3) Next, blog post title doesn’t link top the article, they should, it’s the number one way people link to the article, plus allows to display article with comments and other data and meta data.

2.4) Current navigation to old articles (“Recent Shows” on the left hand side) link to dates and not titles, this should be changed, so that Recent Shows links to the articles themselves.

2.5) Better Achieve / Old Article retrieval needed, recommend the work I did on creating a “Roller Weblogger Achieve Menu” which creates a year / month achieve list making legacy content very easy to find, and putting it in either the left or right hand border, here’s more info http://blogs.sun.com/eclectic/entry/roller_weblogger_archive_menu_macro

2.6) You may also want to improve the next / previous function and make it much more obvious and easy for the reader to find (making access to old articles easier to find too of course). Another one of the standard roller weblogger functions I replaced: the next / previous function. Basically I wanted this to be a little more informative, and host it as a menu list in the sidebar. Here’s my article on how to do that “Roller Weblogger alternative Next Previous function” available http://blogs.sun.com/eclectic/entry/roller_weblogger_next_previous_macro

2.7) You may want to try using a third party comment system, which can increase the number of people seeing your comments, have a look at “Integrating Disqus and Roller Weblogger on blogs.sun.com” which you might like https://horkan.com/2008/09/09/disqus-integration-bsc-roller-weblogger

2.8) Do you have lots of blog postings, possibly over a number of years? And do you suspect that despite embedding search and tag clouds into your blog that your readers are still not finding content related to that they enjoy? In fact do you have evidence of that very problem from your web analytics data but don’t know what to do about it? Yes? So did I, so I created this roller weblogger code to generate a list of the most related blog entries based upon tag and category relationships. This is my favorite and most productive functional enhancement to Roller. The article “Roller Weblogger Related Entries and Blog Post code” describes it in detail and shows an example, it really is good, http://blogs.sun.com/eclectic/entry/roller_weblogger_related_entries_macro

2.9) Tag display on individual articles, with links to other appropriate content aggregators. I would produce tag links to at least four popular tag destinations, your blog, blogs.sun.com, technorati and del.icio.us. It also ensures that the links are marked as tags, so that crawlers that look for and index tags and tag data will pick them up (microformat and semantic web focused applications, like the ‘Operator’ plug in for Firefox also pick them up of course). Article “Roller Weblogger blog post tag link code for blogs.sun.com, technorati and del.icio.us” over at https://horkan.com/2008/08/11/roller-weblogger-tag-technorati-delicious

2.10) Twitter integration

2.11) Flickr Integration

===================================================================

3) Non-Functional i.e. technology behind the site

3.1) Remember that good site design for attracting traffic is about designing the site for human and non-human visitors; a large number of your visitors will be web spiders and crawlers indexing your site for search engines, blog catalogs, directories and the like. So it’s important that as well as your human visitors you also design your site to be easily and throughly consumed and interpreted by these electronic visitors. My article “make Google notice your Blog” has lots of background info that can help here https://horkan.com/2009/01/20/make-google-notice-your-blog

3.2) My biggest problem with the Innovation@Sun site is it’s lack of semantic / meta data embedded within the main and other pages, this is a significant issue when looking at how this page relates to other sites on the web. The main page should have tag meta data at the very least. You could achieve this with a tag cloud, but frankly tag clouds are becoming rather ‘de rigueur’ and common place. Whether you want a tag cloud or not we should look at generating tag data for every page. For instance if you run a semantic / meta data analyzer on my site you’ll see there is a large amount of machine only readable data, all of which helps spiders index my site the way I want them to.

3.3) Make sure every article has tags and tag data and it is human readable once on the article only page (see 2.9 above which we could double to do this, also ensuring the sites above index it well too).

3.4) Standardise on tags, both format and content. I recommend that you standardize on a Tag format that is search engine friendly. Don’t over tag nor under tag, but try and match your articles tags with other similar articles, try and join in with the subject matter’s folksonomy if at all possible (i.e. the tags people are using when talking about that subject matter, technorati and delicious are both good examples). My article “Tic, Tag, Tow” here https://horkan.com/2008/01/08/tagging-tags-blog-tag-policy should help. Basically use tags which are already being used by the Sun blkogging community, this will also generate pages which display your content vis the main Sun Blogs interface.

3.6) Google’s PageRank algorithms work on links, inbound, outbound, number, and the PageRank of those inbound and outbound links. Link to sources, get inbound links from sources / reciprocal links if possible. Don’t forget to trackback articles that you reference, if the trackback fails try leaving a comment with a link to the article that references it.

3.7) Make sure you let sites such as Google know you’ve updated your site and that you’d like it re-“spider”ed, indexed and advertised. This is done by “blog pinging” search engines and blog directories so that they are informed that your site has been updated and to send over there spiders when they get chance (most search engines / blog directories want to do this quite quickly as they want to be first with any potentially newsworthy content that draws traffic). Personally I wanted a more granular level of control over this than offered with the standard blog ping functionality embedded in roller and so I wrote my own stand alone version, see my article “Free XML-RPC blog ping site submitter: “Blog Ping”” for more information https://horkan.com/2008/04/22/blog-ping-search-submitter-seo

3.8) Other things to consider…

* PageRank of your site and individual pages; how well does your article compete with articles of a similar nature.
* Have pages been bookmarked in del.ici.ous, technorati, etc., i.e. are they being shared.
* Improving site analytics and getting better visibility of visitor interaction with the site and using this to plan the next round of enhancements.

===================================================================

And don’t forget you can become a fan of the Facebook Fan Page and follow Innovation@Sun on Twitter too @InnovatingatSun.