Category Archives: Internet

Create fancy wiki home pages with Confluence, Lozenge and Nuvola icons

Posted on by
4

I think that it’s important to have nice looking wiki pages, especially for those high level pages that are viewed by a large audience. I’ve put this post together to explain how to setup Atlassian’s Confluence wiki with some freely available macros and icons to make fancy wiki pages to impress.

Prerequisites

1) Atlassian Confluence

You need a running instance of Atlassian’s Confluence Wiki – you can get a free 30 day trial or free personal server license for personal use.

2) Content Formatting Macro

You need to have the free Content formatting macros installed. This can be easily done in Confluence under Administration->Plugin Repository.

3) Nuvola Icon sets attached to Confluence

You need to download the Nuvola icon set locally and attach these to your Confluence instance. Nuvola is a elegant looking icon set released free under LGPL.

Download this file, then unpack it (on Windows use something like 7-Zip), then upload all the 48×48 icons to new wiki pages in Confluence using the Confluence File Uploader that conviently runs directly from your browser.

I created five separate wiki pages under a master page called ‘Icons‘. I called these icons pages: ‘Icons Actions‘, ‘Icons Apps‘, ‘Icons Devices‘, ‘Icons Filesystems‘ and ‘Icons Mimetypes‘. You can create these pages under any space, so if you have an admin type space you’re probably best to use that.

You should put {gallery:columns=8} in each icon wiki page so the icons appear as thumbnails. You can put {children} in your Icons page to display the other child icon page names.

Creating the Actual Page

Creating the actual page is pretty easy once you have all the icons uploaded. The page uses three macros: columns, sections and lozenges. It’s a matter of reading the doco for each and experimenting with what looks best. I’ve posted my wiki source below.

You can then easily create a page template with some icons and blank labels so that others who use your wiki can easily create pages that look like this.

The Result

The final result

The final result - click to enlarge

Source code is posted below.

Continue reading →

Short, friendly URLs

Posted on by
3

Here’s a good comparison that shows why I like short, friendly URLs.

HP Quality Centre

URL: https://h10078.www1.hp.com/cda/hpms/display/main/hpms_content.jsp?zn=bto&cp=1-11-127-24_4000_100__
Length: Poor: 98 Characters
Friendliness: Poor: There’s no mention of Quality Centre or what it is. Lots of meaningless numbers and codes. Also, does a product page really require a secure page?
Google Search Blurb: Poor: “HP Quality Center is designed to address the wide-ranging challenges that…”

Google search for HP Quality Centre

Google search for HP Quality Centre

Atlassian JIRA

URL: http://www.atlassian.com/software/jira/
Length: Very good: 39 characters
Friendliness: Excellent: Includes both JIRA and software, so you know what it is. No unneccessary numbers or codes.
Google Search Blurb: Excellent: “Browser-based bug, issue, task and defect tracking system, and project management software solution used for open source and enterprise projects.”

Google search for Atlassian JIRA

Google search for Atlassian JIRA

It’s easy to see which one is better.

Google hasn’t felt quite the same lately

Posted on by
4

I’ve been thinking that Google hasn’t felt quite the same over the last few weeks. I soon realised that it’s because Google have updated their favicon; the first time they have done so in eight and a half years!

Instead of a capitalized boxed ‘G‘, you will now see the second g in Google.

It’s amazing how significant a small icon in the browser address bar can be. I hadn’t realised how often I subliminally use these icons. I’m pretty sure that when I glance at my open Firefox tabs that I use these icons to quickly determine what is what. I even get pee’d off when a site doesn’t have one. Which shows you that an icon is worth a thousand few words. Although this isn’t the case when I get into a lift (that’s an elevator) and they have those buttons. You know the ones. Someone is dashing for the closing doors and you quickly try to re-open the doors but somehow can’t.

The lift buttons look way too the same, in my opinion. That’s why I prefer the simpler(?) ‘OPEN‘ and ‘CLOSE‘ buttons instead of icons that look like each other.

So maybe that’s why Google changed their favicon. Maybe they were worried about looking too similar to everyone else. After all, bold capitalized letters are all the rage:

And it’s suprising how quickly we humans adapt to change: at first I hated the new small g, but now I don’t mind it at all.

Menu Usability of Superratings.com.au

Posted on by
1

The good thing about improving the usability of websites is that often it doesn’t take a huge amount of effort to drastically increase the usability.

For example, I was recently browsing the Australian Superratings website where you can purchase reports about various Australian Superannuation Funds and how they compare on investment returns, service and fees. I was curious about the price of the reports, but I couldn’t find this information anywhere on the site! I realised I had to commence the checkout process, which involved creating a new user account, just to find out the price of a report, which is very annoying and unnecessary.

Whilst navigating the site, attempting to find the pricing, I started to quickly get annoyed by the menu design on the left of the site.

Superratings Menu Original

The problem I have is that only two of the menu options are actually menu options, the rest are links, and it isn’t clear which two of the eleven are the options! So what happens is that I hover over each and every link only to realise that nothing is going to happen. The right pointing arrow on each blue box implies that it is a menu option that will display another option.

When I come across a menu option, the grey sub menu links all have a left pointing arrow. I am not sure of the purpose of this arrow as the sub menus disappear as soon as I move my mouse away.

A two minute redesign gives something like this:

Superratings Menu Redesign

It’s now easy to see, at a glance, what are menu options and what are links. I have removed the left pointing arrows from the sub menu to make them all look like links.

This quick design improves things straight away and would be sufficient in my opinion. If I was redesigning this site and I had more time I would probably try to remove the sub menu options completely by doing a reorganisation using information architecture techniques, such as card sorting, with a small focus group.

Oh, and I’d make sure that report pricing is displayed prominently throughout the site so that I don’t have to dig in the first place.

Simple web application monitoring with Watir

Posted on by
1

One of things I love about Watir is its flexibility. For example, you can quickly and easily write a script to monitor your web application availability and schedule it to repeat periodically.

I like the idea of application monitoring that acts like a real user. It’s all well and good to monitor a server’s CPU and memory but if the user can’t access the logon page then the application is not doing its job.

I use SMTP to send an email if a page is unavailable. There is some good information about using SMTP connections in ruby available here. You need to specify an SMTP server which most organisations already have running, otherwise you can run one locally or use a public one such as Gmail. You can set up notification groups which then send text messages as well.


require "watir" # For connecting to web pages
require "socket" # For getting host name
require "net/smtp" # For sending email

MONITORED_URLS = ["http://www.google.com","http://www.ruby-lang.org/en/"] #This is a list of urls
EMAIL_FROM = "your.email@example.com"
EMAILS_TO = ["your.email@example.com"] # This must be a list of addresses.
SMTP_SERVER_NAME = "localhost"
LOG_FILE_NAME = "./watir_monitor_log.txt"

def check_page_available(url)
   begin
      start_time = Time.now
      ie_page = Watir::IE.start(url)
      load_time = (Time.now - start_time).to_s
      if (ie_page.check_for_http_error() or ie_page.text.include?('The page cannot be displayed')) then
         result = false
      else
         result = true
      end
   rescue
      puts "EXCEPTION RAISED: #{$!}"
      result = false
   end
   ie_page.close
   return result, load_time
end

def send_email(subject)
   Net::SMTP.start(SMTP_SERVER_NAME) do |smtp_server|
      EMAILS_TO.each do |email_address|
         email_message = "From: Web Site Monitoring Script \n"
         email_message << "To: #{email_address}\n"
         email_message << "Subject: #{subject}\n"
         email_message << "#{subject}\n\n"
         smtp_server.send_message email_message, EMAIL_FROM, email_address
      end
   end
end

# Start of Script
host_name = Socket.gethostname
MONITORED_URLS.each do |url|
	puts url
	date_time = Time.now.strftime( "%A %d/%m/%Y %I:%M %p" )
	result, load_time = check_page_available(url)
	if not result then
		send_email( "Could not connect to URL: . There may be a problem with this site." )
	end
		
	File.open(LOG_FILE_NAME, File::WRONLY|File::APPEND|File::CREAT, 0666) do |log_file|
		log_file.puts "#{date_time},#{host_name},#{url},#{result},#{load_time}"
	end # File closes automatically
end
# End of Script

I like to record page load times for historical data collection. I have logged this information locally for simplicity but you can also easily log this information to a wiki page (such as Confluence) so that it is easy for others to access as well.

Once you have the ruby script ready you can simply schedule it to run as a Windows task every 10 minutes or so. I usually create a one line batch file to call the script with the -b flag so the browser doesn’t display during execution.

The usability of home contents insurance quotes

Posted on by
Reply

Background

I tend to pay my bills for an entire year at a time. This means rather than having lots of small amounts coming out of my bank account each month, I have a few large bills every now and then that I pay. The added advantage is that each time a new bill comes for the coming year I take a quick moment to shop around and make sure I’m still getting a good deal.

Last week my new home contents insurance bill came. I think I am getting a good deal but it can’t hurt to check. I decided to check about six or so home contents insurances companies to compare their quotes. Only then did I realise how much web usability still sucks… and it’s 2008!

I don’t get to do much usability work these days so I thought I would do a quick and dirty usability review on here, inspired by the stylings of my favourite usability book called “Don’t Make Me Think!“.

Starting a new Quote

Great: Allianz Insurance – One click and you’re there!

How to get a quote

Not so great: BankWest – Six screens including a modal dialog that temporarily disables all your firefox tabs. Lots of clicks and loads of clutter. Yuck.

How to get a quote

Getting a quote – what I liked

To be honest, there wasn’t much that blew me away when looking at the various insurance quote screens. AAMI had two nice features.

The click to talk feature is neat. You put in your phone number and someone will call you straight away to discuss your query. This is both convenient and cost effective as some people don’t have easy access to a phone.

Click to talk

The flexi premium screen is a good idea. It shows all excess options and how much they cost. It’s nice to be able to compare and make a decision without going back and forth between screens.

AAMI Home Insurance Flexi Premium

Getting a quote – what I didn’t like

New Window Popups: The insurance quotes at most sites open in a new browser window (sans browser controls). This is annoying because I use tabs in firefox to switch between various pages. A new window means I can’t use these tabs as easily.

Opens in a new browser window

Drop down values: Some of the drop down values are unclear and inconsistent. There is often no help available for these too. For example, I live in an apartment block and I honestly don’t know what the building or roof is made of.

Drop down list values

Buggy Software/Unhelpful Error Messages: The BankWest quote displayed an fatal error “Potential Flood Postcode, Check Full Address” midway through the quote. Straight away I am confused: I’m not even applying for flood insurance. It doesn’t tell me my options. I can’t correct it. I try to go back, I can’t. I’m stuck. I quit.

Unhelpful error message

Non Standard Terminology: Six out of seven sites I looked at use the term “quote” which makes sense but NRMA insurance insist on using “estimate“. I’m not as confident with the term “estimate“.

Firefox Browser Compatibility

I try to only use Firefox (2.0.0.13) as it is cross platform and open source. Some sites still won’t support it though. I simply don’t bother with quotes from these sites, they obviously don’t want my business.

AAMI: OK
Allianz: OK
ANZ: Session Timeout Error – Won’t work

BankWest: OK
NRMA: OK
Suncorp: OK
Western QBE: Must use IE.

Conclusion

The usability of the sites I looked at is not very good. Of the seven sites I looked at I only managed to get three quotes!

Most of the quotes I got were roughly the same price, so really my decision comes down to how pleased I am with the quote process. It shows you that in a fairly level playing field that good usability does really count.

Seek.com.au Rocks

Posted on by
1

I use the web a lot but I am still impressed by a little unexpected nicety.

Seek‘s maintenance message is one such thing. Instead of just telling me that Seek is down (so there!), they offer me three things to do instead of using seek at that moment. These are well worded and include expanding my skills, looking for my own business, or my favourite is offering me a game of pacman, right there, directly in the maintenance page!

Seek Unavailable


(Click to view full size)

I was also impressed with Seek when i recently emailed them a suggested improvement. Within hours i received a response saying its a great idea and thanks to people like me Seek gets better all the time. Two weeks Six months ago I emailed realestate.com.au with a site gripe, and I still haven’t heard from them at all.