Usability advice for VillageRatings

At Internet World, the affable and knowledgeable Simon and Alex (I hope I have the names right) from Nomensa and a very nice chap from Cyber-Duck gave me some great advice for VillageRatings (much of which will be generally applicable) that I hope to put to good use in the months to come.

Here’s the site as they saw it:

Some of the suggestions they had were:

  • Make it clearer why people should want to rate their village, e.g. talk about being proud of their village, sharing their expert knowledge (for ideas, see what TripAdvisor, etc. do to encourage users to write reviews)
  • Perhaps add a “Why rate a village” tab?
  • Make site appear to be flourishing (e.g. get more friends to write reviews)
  • See travelintelligence.net for ideas
  • Make navigation tabs react to roll-over
  • Don’t make site logo link to the homepage if the user is already on the homepage
  • Consider automatic completion of village names
  • Improve village search so that it does substring matching, e.g. a search for “Llantwit” would bring up the entry for “Llantwit Major”
  • Make things more visual and friendly with, for example, mini avatar pictures alongside users’ comments, and allow users to upload photos of the villages (but allow flagging of photos by users in case people upload anything offensive!)
  • Extend homepage with more content (to help search engine rankings?)
  • Consider making “Rate” button larger
  • Change “see more” to something more specific, e.g. “see more top villages”
  • Add a “Resources” page with links to other related sites in exchange for links back from them

Helpful stuff. It was worth attending Internet World for this feedback alone!

[Incidentally, as well as all this, the guy from Cyber-Duck suggested moving away from Google Maps at some point as apparently Google are going to be putting advertising on their maps sometime soon. He’d got this information second-hand. I rather hope it’s wrong as it’s going to mean revisiting a lot of work. One to check into.]

A Day at Internet World 2007

I spent today at the Internet World show at Earls Court. Apart from being a good excuse to escape from my trusty laptop for a day, there were a number of interesting talks and even some web usability experts on hand offering some free advice.

Out of the presentations I attended, the most interesting tidbits I gleaned were these:

  • Email marketing: 90% of email these days is in HTML format
  • SEO: Dynamically-generated pages with very specific titles and content can have a huge positive impact on a site’s search engine visibility
  • Legal issues: Sites with user-generated content should have a set of terms and conditions that users sign which releases the copyright on the content they create, allows the transmission of their personal data outside of the EU and allows the site owers to release their details to law enforcement agencies
  • Mobile devices: Developing web content for mobile devices remains a minefield (multiple markup standards, asset format issues, range of screen sizes, browser bugs). On the plus side, photos can look great on small screens
  • Amazon web services: S3 service offers very cheap storage and bandwidth. Hosting largest files on S3 could help sites to scale
  • Behavioural segmentation: Users can be segmented into competitive and spontaneous vs. humanistic and methodical. You top of your landing pages should cater to competitive and spontaneous visitors (e.g. with a “Buy it now” button). The rest of the page can cater to the other types of visitor (as they will tend to read the rest whereas the others won’t)

Maps galore

I’ve just finished adding mapping features to the VillageRatings site. It turns out that displaying maps is relatively easy, thanks to the wonderful Google Maps API. What is tricky (in the UK at least) is computing the right longitude and latitude values for the things you want to display on the map (in this case villages). Hopefully this will change some time soon when Google starts offering a UK geocoding service. Anyway, it was more of a fight than I’d anticipated, but it’s now up and running.

PeckhamLive

How long could I live in Peckham without creating a Peckham-centric web site? Not very long.

OK, so PeckhamLive is never going to be big. And it’s not the prettiest site to see the light of day. But it could be useful if you happen to live in Peckham and are looking for local information.

Talking of Peckham, I just discovered that it was chosen as Britain’s top “creative hotspot” by communications agency The Fish Can Sing (cute name!) You can read the article here. And that was back in 2005, before mulogy set up here ;-)

And in case you thought Peckham was still the grim urban area of its Only Fools and Horses days, check out the local palm trees.

VillageRatings on Rails

I’ve just re-implemented the VillageRatings site in Rails. The site allows people to read about UK villages and leave their own feedback on them. You can now list villages in order of their ratings for any attribute or overall average rating which wasn’t possible before. And, thanks to Rails, the homepage has been completely overhauled.

During the re-write I also gave the site a new look. It’s an improvement on the previous version, but the navigation is not quite right (not all pages correspond to a tab) and it feels a bit cold. Perhaps a cute animal logo would help. And a bit more time with CSS is in order at some point.

Compared to developing the site first-time-round in raw PHP without any MVC framework, the rewrite in Rails was a breeze; wonderfully quick to do.

Anyway, I’d welcome any comments on the site. And feel free to add reviews of your favourite villages :-)

[Update: the cute animal logo has now been added!]

LondonTwenty

LondonTwenty is designed as a starting page for Londoners. The idea is to provide categorised links to the top twenty (or so) sites for Londoners of which people might not otherwise be aware or of which they might not remember the names. It also has a London-specific search engine.

The next time you’re looking for London information, try it out (especially the search engine – it can be strangely fun) and see what you think.

Sending data from browser to server with javascript and JSON

This is some code I wrote to send data from a javascript object (on a browser) to a Rails application on a server.

[My aim was to use the Google AJAX search API and a Google local search controller to search for and select business locations that I then wanted to store away in a database on my server.]

The approach I used was to encode the object’s data into a string using JSON, stash it inside a hidden form field, then POST the form to the server. The Rails app on the server would then receive this form, grab the hidden form field data out of params[] and decode the JSON string into a hash.

  1. User clicks submit button.
  2. Submit button’s onclick function converts the javascript object data to a string using the toJSONString() function of the json.js library.
  3. The onclick function sets the value of the hidden field to this string.
  4. The browser sends the contents of the form (including the contents of the hidden field) to the server.
  5. The server receives the HTTP POST and sees that it is for controller ‘places’, action ‘add_from_map’ of my Rails app.
  6. The add_from_map action finds the hidden form data in params.
  7. The action parses the data using JSON.parse from the json ruby gem (on Linux use “sudo gem install json” to install the gem).

Let’s step through that in more detail as we look at the code.

First, in the .rhtml file for the page with which my browser constructs the data, I included the json.js file:

<%= javascript_include_tag 'json' %>

I then added a form (note that it should really be written using Rails form helpers – any pointers on how to convert this example would be gratefully received).

<form action=”/place/add_from_map” method=”post”>
<input type=”text” id=”loc-data” name=”loc-data” value=””>
<input type=”submit” id=”save” name=”save” value=”Save” onclick=”SubmitAll()”>
</form>

This form provided:

  • A hidden field called “loc-data”
  • A submit button that calls “SubmitAll()” when clicked.

My page already included placeholders for various Google search objects that ended up populating an object called gLocalSearch.

The data I needed was held in “gLocalSearch.results” (incidentally, these are the results of a Google ‘local search’ executed using a GlocalSearch object as described here).

Here’s the SubmitAll() function:

function SubmitAll() {
document.getElementById(“loc-data”).value = gLocalSearch.results.toJSONString();
return true;
}

When the submit button was pressed, this function used the toJSONString() method added by the json.js library to convert the data to a JSON string.

The return value of “true” resulted in the form being submitted to the server.

On the server, I needed to include the json code in the “place” controller:

require ‘json’

The “add_from_map” action extracted the JSON string and decoded it, putting the result into an easily-accessible hash:

def add_from_map
@place_rows = JSON.parse(params[:loc-data])

for place_row in @place_rows
@place = Place.new(:name => place_row[‘titleNoFormatting’])
end
end

(Ignore the nonsensical loop here. Just notice how you can use [ ] to access a field in the hash that is created by JSON.parse.)

That’s about it. As it happens, the Google map search tool I was planning to use doesn’t currently support UK searches so my little application will have to wait. Or maybe I’ll do a French version :-)

Happy mapping!