Other things on this site...

MCLD
music
Evolutionary sound
Listen to Flat Four Internet Radio
Learn about
The Molecules of HIV
MCLD
software
Make Oddmusic!
Make oddmusic!

Rejigging the OpenStreetMap browse page

On OpenStreetMap, I find the /browse/ pages really useful for getting a quick summary of an "object" in the map. It shows when it was edited, shows all the tags, etc.

However, I have two issues with it:

  • The use of space isn't ideal. There's plenty of unused space which I don't think is entirely deliberate (of course whitespace is good sometimes) - and the interesting information often gets pushed down below the fold as a result.
  • The browse pages have enough information that they should be generally useful, not just as a diagnostic tool for mappers, but maybe for people who want to share the details of the pub they're going to, or whatever. The main impediment to this is that the initial impact of the page is fairly unfriendly and technical.

I believe the layout can be rearranged in a way which doesn't remove any of the information that mappers need, but which makes the browse pages more accessible and friendly and hopefully generally useful. This would encourage more casual users to see the tags we have, and... fix them :)

So the main objectives are:

  • Make the main heading a bit more approachable, making the "name" (where available) a bit more primary than it currently is.
  • Make the "Tags" section a little bit more visually primary (more approachable to newcomers than changeset).
  • Make the "last edited" info more compact - it doesn't need to be a four-row tabulation, but can be as a sentence "Last edited [date] by [user] (version [v] in changeset [c])". It makes sense to put the "View history" link at the end of this too. Also, it's more approachable to have the last-edited-date converted to something like "2 months ago", and for full info it'd be good to have the full date tooltippy.
  • Try not to do anything that prevents experienced mappers from getting a visual overview of the more technical info, such as history, XML link, edit links etc.

Work so far is in my github branch called "browsepage". Here are some screenshots, in each case with "before" on the left and my version on the right:

A relation:

A way:

A node:

I really think the "Last edited N decades ago by Thor" is much more approachable than the current table of metadata. The other stuff I've done is less dramatic, but I like the way it gives a bit more priority to the tags and makes room for plenty of them in a screenful.

Update: someone asked if I could post how the pages look on small screens (i.e. phones) - here are screenshots, taken by resizing my Firefox window small enough that the small stylesheet kicks in:

Saturday 21st September 2013 | openstreetmap | Permalink
Comments:
Name: Anon...
Date: Wednesday 16th October 2013 13:23
Great addtion. Thanks.
Name: Anon...
Date: Thursday 7th November 2013 10:04
I also think this is a positive change, de-cluttering without loosing any information and would like to see it implemented on the live site.

Add your comments:

Name:
Email:
Website:
Comment:
I am a:
Everything is optional - and email addresses will be marmalised to protect you
Creative Commons License
Dan's blog articles may be re-used under the Creative Commons Attribution-Noncommercial-Share Alike 2.5 License. Click the link to see what that means...