A terrific article from Wilto detailing the thinking that went into the Boston Globe’s responsive image techniques and how browser pre-caching is now throwing a spanner in the works.
Tuesday, January 31st, 2012
Monday, January 30th, 2012
A great behind-the-scenes look at the process behind the responsive Boston Globe site, with a particular emphasis on the visual and interactive design challenges.
Monday, September 19th, 2011
Luke’s excellent detailed notes from Scott’s talk at Breaking Development about building the Boston Globe site.
Thursday, September 15th, 2011
Boston Global Scope
After giving my language-centric talk at the Breaking Development conference I found it interesting to listen out for the terms that attendees and speakers were using to describe desktop-centric websites. Some of the adjectives I heard were:
- full site,
- standard site,
- regular site.
Once again, I think that this kind of language can constrain our approaches to web design and development. In truth, a mobile site should be the standard, full, regular site; you can still go ahead and add more stuff for the desktop environment, but to think of it as the canonical instantiation isn’t helpful. It hinders our ability to think in a mobile-first responsive manner.
Jason made a great point in his closing talk at Breaking Development. He said that clients are always asking how much extra it’s going to cost them to have a mobile site. But it should be the other way around. The mobile site ought to be the default and they should be asking how much extra it will cost to optimise for the desktop (which is not very much because, let’s face it, the desktop environment is a piece of piss compared to mobile).
It can be tough to convince a client that a mobile-first responsive site is the right approach. It’s always better to show rather than tell, but up until now there haven’t been any poster children for responsible responsive design—much as I like the mediaqueri.es site, the majority of sites showcased are shrinking down from a desktop start.
This reminds of the situation with web standards ten years ago. There were plenty of great sites that has switched over from table layouts to CSS but they were mostly blogs and portfolio sites (again, take a look at mediaqueri.es). It wasn’t until large commercial entities like ESPN and Wired.com were brave enough to make the switch that the CSS floodgates opened.
As of this week, we have a poster child for responsive web design: The Boston Globe. Actually, that does it a disservice …it’s a poster child for excellence in web design and development best practices.
I was lucky enough to have Scott do a show’n’tell at my dConstruct workshop. Seeing the thought and care that went in to every step of the process was humbling. There were a lot of tough challenges but they kept their eye on the prize: universal access—regardless of what device you’re using—without compromising on visual and interactive richness.
I’m going to let the site speak for itself but I just wanted to send my heartfelt congratulations to Ethan, Miranda, Scott, Todd, Patty and everyone else at Filament Group, Upstatement and the Boston Globe. Their hard work will benefit everyone designing and development for the web. Thank you guys.
Here are some reports in their words:
- From the Boston Globe itself, here’s a look at the strategy and business goals that informed the site.
- Ethan wrote about his role in the process.
- Upstatement have a beautiful portfolio page (itself responsive) showcasing the Boston Globe.
- Patty documents Filament Group’s experience with this project.
Lots of other people are writing about the Boston Globe launch, although much of the commentary focuses on the forthcoming paywall/fence rather than the design or technology. Jeffrey has written about the site, also comparing it to Mike’s visionary work on ESPN back in the day.
I could go on and on about how well the site works on touchscreen devices, tablets and mobile phones of all kinds but I think the essence of what makes the site great is captured in Grant’s screenshot of The Boston Globe site running on… an Apple Newton.
Wednesday, September 14th, 2011
I’m sitting here in Nashville with Scott, who has been answering questions from Read Write Web about the Boston Globe launch. Here’s the resulting article.
An overview of the strategy behind the fantastic Boston Globe website.
Tuesday, September 13th, 2011
A slick little video that goes behind the scenes of the Boston Globe site.
A lovely responsive portfolio showcasing a lovely responsive site. Responsinception!
Ethan chronicles the story of the Boston Globe site and his part in it.
This photograph made my day: the brand new Boston Globe site running on a Newton.
Progressive enhancement. It works.
Monday, September 12th, 2011
It’s here. A large-scale commercial site with a gorgeous responsive design. Try it on any device.
This is the first of many.