Go Tambopata in English… and in Spanish

25 March 2013 — tags:

The design and build of the Go Tambopata website is finished! You can read a little bit more about it on the Go Tambopata project page. It’s a pretty big site, with a lot of content – in both English and Spanish, which means it won’t be launched until the summer. Even then, that will only be the first stage, with more content to come. I think it’s going to be a useful resource for people looking for travel information and tips on visiting the area.

While awaiting news of the launch date, I thought it might be fun to share a couple of the challenges, discussions and outcomes related to the fact Go Tambopata is written in two different languages.

English and Spanish, Inglés y Español

Quite often, when you encounter a multi-lingual website, you’re able to change the language of the content, but the headings, menus and other options remain in the default language, which can make it difficult to find what you’re looking for. Another common problem is that you might find what you’re looking for in the default language of the website, but when you opt to change languages, you get sent to the homepage (even if that’s not how you entered the site in the first place) and then you have to find the correct page all over again.

Obviously, the client and I were keen to avoid creating such problems for people visiting the site. To allow it to function completely in both English and Spanish, the pages are created in both languages and these are linked together in the content management system (CMS). There are two sets of page templates, one for each language, which means when you select the Spanish option, the menus and labels will also switch to Spanish, as well as the URLs – not just the content in the body of the page. The templates also allow other elements of the site to be correctly translated and localised – everything from Twitter and Facebook plugins, Google Maps, the advertising, localised versions of outbound links, and alt text for screen readers can be presented in the selected language.

There are three places where Go Tambopata defaults to English:

  • The homepage at .com is in English, and the Spanish version is at .com/es/. As it’s a website for tourist information, trying to detect a language is not necessarily a useful feature. It’s possible somebody accessing the site in South America on a Spanish-language computer is an English-speaking traveller in an internet cafe. The site assumes English, and provides an easy obvious way to swap to Spanish.
  • The header and footer on the search results page is in English, but the results are in both languages. This is because it’s not always possible to work out whether somebody searching for the name of a hostel, which happens to be in Spanish, would like the results displayed in English, for example. It’s possible to switch to have the header and footer displayed in Spanish on the search results page, but the results will always be in both languages.
  • Similarly, if somebody types in an incorrect URL, you can only guess which language their misspelling occurred in! The 404 error page also defaults to an English header and footer, but the apology and instructions for locating the correct page are displayed in English and Spanish simultaneously.

Little things to look out for when designing and building a bilingual site:

Article–noun agreement:
The Spanish language likes to assign a gender to its nouns in a curious way. English does not. Working with two languages made me appreciate just how lazy (meaning efficient!) it’s possible to be when creating page templates in English. When your template needs to dynamically display text from elsewhere, you can just write The [Dynamic Word/s] and happily move on. Spanish page templates are a bit tricksier because depending whether Dynamic Word/s is/are masculine or feminine, singular or plural, The has a number of choices: el/la/los/las.

Only a couple of things ended up being translated in a slightly different way, so that the article (The) and the noun (Dynamic Word) would agree – these things were typically mid-sentence.

Though Spanish doesn’t have the reputation German does for having typically longer words than English, I had to make sure the page templates would cater for both languages regardless of the length of text content. While Where to Sleep and Dónde Dormir are a pretty similar length, page titles such as Jungle Nightwalks and Caminatas Nocturnas por la Selva show just how varied the text length can be.

Britain vs America

Amusingly, this was the subject of most discussion! The owner of the Go Tambopata website speaks (and therefore writes) British English and European Spanish. Due to the location of the Tambopata Reserve, it should come as no surprise that a large percentage of the tourists are either from North or South America.

We discussed at some length whether the site should be written in American English instead of British English, and whether that had implications for an expectation of South American Spanish, rather than the Spanish as spoken in Spain.

Who cares?! Here are some thoughts on why it’s important:

  • Would the site miss out on search traffic for any regional spellings of important keywords?
  • How are the British/American differences in spelling and semantics perceived – does it look like an error and affect the credibility of the site?
  • Does it appear insincere if you try and write for an American user but don’t quite catch all the British tell-signs (for example, colour/color or ºC/ºF)?
  • What’s the expectation of the audience? If you could tell it was written by a European would you consider the content might not be relevant to you as an American?
  • Given the ubiquity of American English on the internet is there a place for British English on a site which isn’t specifically targeted at British people?

In the end, partly because the Olympics was on at the time, patriotism and nationalistic pride got the better of us and the site is written in British English. American English was up for discussion right up until I unleashed a tiny Union Flag icon, which denotes which language can be selected – it seems just a text label would have been fine, but the idea of looking at the Stars and Stripes was a step too far – images are an evocative thing!

The language choice will be under review and up for discussion once again when the site is live though… and I’ll post an update as soon as it is.

Dowsett Design Website

18 March 2013 — tags:

The website I designed and built for Dowsett Design is now live! Take a look, particularly if you’re interested in furniture design, lighting or installations. It’s a portfolio gallery built using WordPress so it’s easy to update when new work needs to be added to the site.

The logo was redrawn to make it suitable for online use, and this informed the style of the bullet points, arrows and other visual elements on the website; everything is comprised of triangles.

Dowsett Design Logo

Logo made from triangles.

The homepage is an index of all the projects on the site, generated automatically and arranged using jQuery Masonry. As the work isn’t categorised or organised in any particular way, displaying all the projects simultaneously makes them immediately accessible and invites people to view the design piece most relevant to their interests.

Dowsett Design Website

Homepage design.

There is a selection of different dividers which appear randomly between the images on the homepage, adding some variation each time you visit. Each thumbnail image links to its own page, which displays photographs and a description of the project. It’s possible to browse through the work without needing to return to the homepage each time.

You can read a little bit more about the project in the Drawn By Day projects section.
Or view the site itself here: www.dowsettdesign.co.uk Sadly no longer live.

Please get in touch if you’re looking for something similar for your own website – I’ll be happy to help!

London Underground Depot Postcards: Why & How

8 March 2013 — tags:

I like maps. Possibly more than would be considered normal. Living in London, my most ubiquitous map is the Tube map, and being a designer, the history and ideas behind the Tube map provide a lot for me to get excited about.

Like a lot of people, I enjoyed the BBC’s documentary (September 2012) showing what happens behind the scenes of London Underground and my fascination for the things you don’t get to see led me to wonder if there are any maps available for the parts of the network not accessible to the public.

This is how my idea to map the Underground depots developed. There are a few online resources which map the London Underground network geographically and I decided to convert these geographical depictions of the depots into schematic diagrams as the regular Tube map has done since 1933 when Harry Beck’s design was introduced to the public.

Here’s a rough sketch of what Beckton depot on the DLR looks like from a geographical point of view:

Beckton depot geographic view

Beckton depot sketched geographically.

In order for it to be recognisable as related to the Tube map, each road, as they’re known, is drawn either vertically, horizontally or at 45º. You’ll notice that on the Tube map, the only places where two lines cross each other at 90º are where there is an interchange – and since there are no interchanges in a depot, all the roads which intersect are at 45º to each other. I also kept the orientation of the depot as closely as possible; if the depot runs north to south, it runs top to bottom on a portrait postcard.

Here’s the diagrammatic version of Beckton depot:

Beckton depot schematic view

Beckton depot drawn schematically.

Once I’d drawn all 17 depots, I created the postcards and coloured each one to match the colours of the lines on the Tube map. The cards have a slight background texture inspired by the print variation typically seen in handprinted items and old London Underground posters. My favourite depots are Morden and Stratford Market because they have a pleasingly neat shape and nicely fit the size of the cards. I’m also intrigued by Waterloo, the smallest depot for the shortest line, because it appears to have some sort of fun-looking turntable for the trains – due to the confined space, I imagine.

Morden, Stratford Market and Waterloo

Morden, Stratford Market and Waterloo depots.

The most difficult depot to draw was Neasden because it is MASSIVE! And complicated. I considered dividing it over two postcards to demonstrate how much more complex it is than the other depots, but its orientation didn’t allow it.

I didn’t manage to finish the postcards in time for the official 150th birthday of London Underground on 9th January 2013… but better late than never! Royal Mail have released a series of stamps to commemorate the occassion – so if you want something appropriately Underground-themed to post with your stamps, you could have a quick peek at the Drawn By Day shop. The cards are available to buy as an entire set (17 depots) or individually.

You can read more about the project, and see images of the postcards here.

Happy 150th birthday, London Underground!

Pick Me Up 2013

4 March 2013 — tags:

Pick Me Up London

Pick Me Up – Graphic Art Fair

Pick Me Up is back again this year, towards the end of April! I’ve been the past two years, and enjoyed it both times. It’s a nice chance to browse (and buy) illustration work, design and graphic art. There are workshops happening too.

If you’re interested in going, there are more details about dates/times and what to expect on the Somerset House website, Facebook and Twitter.

Happy New Year!

31 December 2012

Without the Olympics to be distracting, here’s to a productive 2013! Let’s make it good.