It’s an absolute age (well, just over 4 months) since I wrote this post saying that I was developing a responsive website for the Westville Hotel, in Enniskillen. Well, after several changes of staff with the client, and at least two complete redesigns, we’ve finally launched this morning!
So, yes, it’s a responsive site. What does this mean? Well, it means that the site will meet the user no matter what device it is accessed on. So, the layout changes depending on whether it’s being accessed via a smartphone, a tablet, or a lovely 27 inch monitor. The code base stays the same – this isn’t a separate site – it just adapts to it’s environment. Smart.
I firmly believe that this is the way the web should be built. It’s the only way that doesn’t involve duplicated content, or some huge compromise of functionality.
This example is not perfect – notably, the booking engine is hosted by a 3rd party which does not provide a responsive experience (which is hugely frustrating, but we can’t do anything about that yet. Yet.) – and the sign up form for the email newsletter needs some work on the lower screen sizes, but it’s a huge step in the right direction.
Sometimes I’m just about the luckiest person I know. One of those times was yesterday when the most deliciously colourful, sumptuous and beautiful piece of artwork arrived on my doorstep. It came courtesy of the Kenspeckle Letterpress. It’s hard to do it justice on such a small web page. In real life it measures 4ft by 3ft. That’s huge! Laurena and I are both so thrilled with it.
So, I know, I know … ‘Where an I get mine?’ … well, just here as a matter of fact: As Above, So Below. Ours was a custom size, so you’d have to get in touch with Kenspeckle if you wanted one that large (they go up to 5 feet wide!) … but it’d be stunning at any size.
(Lara sees it as trees. Jonah sees it as rain – the Irish in him, I first saw it as river delta’s but now can’t get past trees. I’ll update later with Laurena’s take!)
This is the first hyper-local project I’ve worked on in a while … but it’s fun to get this local sometimes! So … let me tell you a little story …
There was a shop here in Belleek that had traded for 50 years. Owned and run by 2 brothers, McGraths stocked a seemingly random assortment of things you might never need but were perhaps tickling somewhere at the back of your mind ( ‘… y’know, I’ve never owned a Bodhrán … perhaps now’s the time. Or, I could get that pair of wellies I’ve always wanted’).
Obviously, they did this successfully enough, but the thing I will always remember it for were for it’s shop dummies. Writing this I cannot believe I never took a photo of them, but trust me – they’ll live long in my memory. They were all blessed with a deathly green hue more at home in some zombie movie. Some had 4 fingers on each hand – others fewer. Their hair styling was, well, agricultural. But dammit, they had personality.
Anyway … brushing all of that aside, in stepped Belleek Outlet Shopping and with them a breath of modernity. It’s a 3 phase development – phases 1 (menswear, ladies wear, accessories) and 2 (shoes, bags) are up and running, and we just launched the website too. Good stuff.
It’s not often that websites I work on are supported by a national TV Ad campaign, but they advertised throughout the Rugby World Cup in the autumn and also the X-Factor.
The whole thing has been such a boon to our local area. On a Saturday it’s now often standing room only in the local coffee shop and it’s great to see lots of their carrier bags swinging merrily from shoppers hands. A small village like Belleek needs enterprises like this and I wish them every success.
Have just written a lengthy page on mobile web design considerations … I’ve got it as a page, rather than as a regular post because it will eventually feature more prominently on the site … but for now, that’s where it is. I’m gearing up for some changes here at TickTock – 2012 is going to be different for me … I’m going to be undergoing a re-alignment in terms of the projects I’ll be working on and in terms of the clients I work with. More of which soon enough – suffice to say, I’ll be doing a lot more work in mobile web design … so I thought it best to have some general information available to people on their options: check it out.
For 3 extremely memorable years, I was lucky enough to walk through Grand Central Station, NYC twice a day, almost every day. To say it’s an inspiring building would be damning it with faint praise as well as stating the bleeding obvious. It’s one of my favourite buildings and so much of it is so perfectly suited to it’s primary uses – it’s like a cathedral for commuters, tourists, diners, hangers-around … it’s wonderful.
And now it has an Apple store. There must have been so many constraints placed on Apple when they were designing this particular store – I’m sure everything needed to go through many layers of bureaucracy and that hundreds of hoops were jumped through. But the result is stunning – and result in a store that both looks like a completely natural fit and one that has been there for ever. Beautiful.
So, over the week I build up a collection of open tabs in my browser which need reading … and finally, I had a little bit of time this morning to finish them off. Listed below for your clicking pleasure:
- First off, a series of three articles from .net magazine (y’know, I wish they’d rename … I keep getting horrible Microsoft framework flashbacks) in their ‘Insiders Guide’ feature. It’s the ‘Insiders Guide to a successful website’ – the three articles covering design, build and promote. A good breakdown from Laurence McCahill – co-founder of Spook Studio.
- Secondly, a couple of bits for the responsive minded amongst us … this great guide on ‘Essential Considerations for crafting quality media queries‘ Such a simple thing, a little media query but – apparently – an awful lot to consider. Certainly, discussion about break points is necessary – I’m working on a responsive project at the moment and have settled on just 2 break points (tablet and iPhone) – but this will change from project to project … and with the increasing proliferation of devices.
- Then, the best article I think I’ve ever read on the why and the how (in terms of the considerations – rather than the nuts and bolts) you should start your responsive project – this from Elaine Simpson at UX Booth: How to design a responsive mobile website.
- Finally, a little bit for us web designers – how to be your own best promoter. It’s not often we get to work ‘on’ our business rather than ‘in’ our business – but here are a few tips on how to do some of your own marketing.
That’s it for now. I’m still working away on the responsive project I blogged about the other week … it really should be launching soon and when it does I’ll be able to write about it properly again!
So then, the time has come to start a client project from scratch using purely responsive techniques (as defined by Ethan Marcotte’s book Responsive Web Design). I’ve retro-fitted some responsive techniques to previous client sites, but this will be the first ‘responsive’ project I’m starting from scratch. The three core ‘ingredients’ for this responsive website are:
- A flexible, grid based layout
- Flexible images and media
- Media queries
If, at this point you’re going ‘huh, what?’, then in essence I want to create a website that responds to the restraints and opportunities offered by the readers device – using the same code base. So, rather than serving a separate, mobile version of a website, I’m going to code one version that will work across devices. That’s the plan anyway.
What am I working with?
To help out with this, I’ll be using the Less.app – a pre-processor for CSS, cutting down my coding time immeasurably (that’s the theory), and the Semantic Grid – developed by the same guy as Less.app. Everything will be hand coded – and then converted into a WordPress theme.
And the project?
So, the client is The Westville Hotel – and below is a JPG of the design – with the 960px grid super-imposed on top.
My aim is to blog through the different stages of the development … the first stage will be to fire up Less.app and start working with the Semantic Grid. I’ll let you know how I get on …
Typically astute and interesting reading from John Gruber following the announcement of Amazons New Kindles.
I don’t own a Kindle, but if I was going to buy one – or, perhaps, y’know, maybe get one for Christmas – the new Kindle touch seems ideal. I love the e-ink of Kindle’s that I have seen in use.
As Gruber points out, the Kindle Fire (the tablet version with web browser), is the first tablet that doesn’t take the iPad on on spec – and offers something that none of the previous round of iPad competitors do: content.
It’s all about the content, though. That’s the difference that other tablet makers missed. Motorola, Samsung, RIM — they seem to be chasing the iPad on specs, building the best tablet they can manage at the same starting price of around $500. But they have no clear message telling people what you can do with them.
The thing that still prevents me though is that the price of an e-book is still higher than the price of a paperback. Given that distribution costs must surely be lower (even with all the new fancy cloud storage) and that you don’t actually have to print the damn thing, I don’t see why they can’t at least bring the price point to the same level. Maybe they will.
And actually, thinking about it, outside of gifts most of my books are bought 2nd hand from either charity stores or from greenmetropolis.com. So.
Ah – so, after a good few months in design & development, we were able to launch Angela’s Bella Flora website last week. I’ve blogged about this before whilst the site was in development and the good news is, it still looks gorgeous!
The photography, the design, the products, the overall feel of the site – is just wonderful. It’s been a pleasure to work on it.
For those who are interested, the site has been built using PHP. The shopping cart itself is custom built – but the guts of it comes from a blog post that is now 6 years old (! – hard to credit, I know) from Matthew Pennell. It’s a really handy little cart script – sure, it doesn’t do everything we needed, but that’s not the intention, it provides a solid enough base to begin with.
I’m proud of the development work, and thrilled once again to have worked with such a talented team on the project – so thanks again to Marian who did all of the design work for the site, and for the ultra patient, enthusiastic and talented team at Angela’s Bella Flora – both Angela herself and Bonnie who have lived and breathed this project for a good while now.