Post from Fromthefrontend
Firstly, sorry for the lack of posts recently – it’s amazing how much time is consumed in looking after a new baby. No doubt you’ve seen Baby Olivia’s photos in my flickr stream featured on the rhs of this blog.
Since been back at work after the Crimbo break I’ve had the chance to work on interactive maps for the first time. Having avoided javascript as much as possible during my time as a front-end designer I suddenly found myself wading in with Ajax.
The project was for the atlarge.com home page as previously mentioned on this blog. I had a look at several 3rd party APIs and settled on Yahoo! Maps as being the best option.
It was the easiest to implement and control, had the most features and I had working map with most of the effects I wanted in an afternoon. However, I had to stop using the Yahoo! API because of 3 major problems.
- view full article for more -
(more…)
A project I worked on back in September/October went live this week – atlarge.com
A lot has been done to it since my HTML/CSS pages were submited. It’s always cool to see all the lights and bells working when you’ve been working on a flat static page and could only imagine what the working page would look/behave like.
I guess that is how movie stars feel when in a special effects scene and all they can see is a blue/green screen.
The site is designed to help you get connected at the airport. The website is driven by user submited ratings and tips. Whether it be the locations of wifi hotspots, availabilty of 3g/GPRS signal or simply if there is somewhere to charge up your devices.
As it’s only just launched a lot of airports have no ratings/tips yet but you can see it’s potential on airports like London Heathrow (LHR) which has seen some activity.
The reviews appear to be moderated which means your review doesn’t appear immediately but ensures useless comments and spam are kept out.
I like the integration with Google Maps enabling you to see a zoomable map of the airport you are viewing.
I hope someone writes a review of Tabago (Tab) airport before I go there next summer. I’m going to be stuck there for about an hour while I wait for my connecting flight to Trinidad and it would be nice to get online – especially on the return leg when I’ll be uploading my photos to flickr.
powered by performancing firefox
Filed under: Awards, Extentions, Newsflash, Plugins, Recommended Sites, Tech news, Tools
If you’re wondering “What on Earth are Microformats?” – where have you been? A quick search on Google returns 11.7million results!
Very brief explanation. For designers it means instead of using random/made-up class names for content you want to style, you use names listed in the Microformat specification. This gives the content you are styling more meaing which can then be read by appropriate software. The class now not only allows you to style that content/element as usual, but also means an application that reads Microformats can “understand” what that content is.
The easiest example to explain is with a contact us page. If Microformat classes are used correctly a Microformat application can differentiate a name, an email address, a telephone number etc. For a user this means when wanting to make a note of someone’s contact details rather than opening up your address book and manually copy and pasting each detail you can click your Microformats button, pick the name you want, view the business card and add it straight to your address book. You could even add all contacts on the page at once. This also works if the information is dispersed through the page such as a biography page containing contact information spread out through the paragraphs, microformats can collate this data into one tidy hcard. This is just one application. Imagine the other posibilities – adding events directly to your calender, XFN relationships, enhanced searches etc.
This is mostly theory at the moment as there are very few websites (Flickr, Technorati, d.construct) that feature this new technique and even fewer applications taking advantage of it (tails, greasemonkey, Safari favelets). However, with the stir being generated about this and the backing it’s receiving it won’t be long before it’s as big as RSS. There is already a Firefox extention called Tails that can read microfomats and Tails export allows you to export the business cards or calendar events (Tails Export is currently only compatible with Firefox 1.5 or older). There are also a few GreaseMonkey Scripts and plugins for IE and Safari.
To see the latest news on which websites or applications make use of Microformats check out the official Microformats.org
website. Microformats are actually a more advanced than I’ve explained here, read more at the official site to get the full picture.
This brings me to the topic of this post – Microformats on ZDNet. If you have the Tails Firefox extention or another application that reads Microformats visit the ZDNet.co.uk contact us page to see Microformats at work. To avoid spammers harvesting email addresses individual contact email addresses are not shown, instead the instruction to use firstname.surname@domain.com is given. However, if you are using a Microformats reader the business card generated still presents the correct email address for each contact. The embedded Microformats was developed by James Myers (a CNET Networks Producer) and myself. James Myers has been interviewed on the subject which will appear on the site as a podcast and video shortly.
This is another example of ZDNet being leader in new technologies. For this reason I am very pleased to present ZDNet.co.uk with the very first FFE (From the Front End) Award. Congratulations to the ZDNet design team on the FFE Award for Best use of new technology on a Business Website. You can view all awards presented by FFE on the Awards page. Three more Awards were given out during the Podcast with Reinette “Ray” De Silva which was recorded last week. James Myers also modestly awarded another site an Award for best use of Microformats in his interview. These will be added to the award page when the Podcast goes live.
If you need any help viewing microformats in your Firefox, IE or Safari please post a comment and I’ll try and help out if I can. Please include your browser name and version.
