Yummy wallpapers for your desktop, tablet, and phone, from NASA and ESA.
Some interesting outcomes from testing gov.uk with blind users of touchscreen devices:
Rather than reading out the hierarchy of the page, some of the users navigated by moving their finger around to ‘discover’ content.
This was really interesting - traditionally good structure for screen readers is about order and hierarchy. But for these users, the physical placement on the screen was also really important (just as it is for sighted users).
Dave explains the thinking behind his responsive table pattern I linked to a while back. He’s at pains to point out that you should always make sure a pre-made pattern is right for you instead of just deploying it no-questions-asked:
Using prefabricated, road tested solutions from Apple’s Human Interface Guidelines, Google’s Material Design, Twitter’s Bootstrap, and Brad Frost’s Responsive Patterns is always a good place to start, but don’t settle there. My biggest advice would be to turn off the 27” display and use your sites and projects on your phone, there’s lots of low hanging fruit that could give way to new patterns, tailor-suited to your content.
Here’s a nice little pattern from Dave—showing data tables one column at a time on smaller screens.
A fascinating insight into some of Tumblr’s most popular accounts:
Some posts get more than a million notes—imagine a joke whispered in biology class getting a laugh from a city the size of San Francisco.
It’ll be a real shame when Tumblr disappears.
That’s “when”, not “if”. Remember:
In 2013, Yahoo bought Tumblr.
There’s something about this that I really like: a message transmitted via a modern communications medium converted into the oldest form of writing.
Combining the molecules of narrative tropes to create stories.
Those lovely people at Filament Group share some of their techniques for making data tables work across a range of screen sizes.
Zoe uses one little case study to contrast two different CSS techniques: display-table and flexbox. Flexbox definitely comes out on top when it comes to true source-order independence.
An interesting pattern for handling complex data tables in responsive designs. It’s a desktop-down approach, but pretty smart.
I like this CSS solution to sideways-scrolling tables for small viewports. It’s not going to be right for every situation but it’s a handy trick to keep up your sleeve.
Dan Bricklin—co-creator of the original VisiCalc spreadsheet—turns his attention to responsive design, specifically for input-centric tasks.
A look at the degree of diversity in Android devices, complete with pretty pictures. The term “fragmentation” is usually used in a negative way, but there are great points here about the positive effects for web developers and customers.
You say fragmentation, I say diversity.
Details on how the BBC Responsive News team plan to eventually make their m-dot site scale all the way up to be the default site. This “planting a seed” approach works really well, not least for political reasons.
This is handy—a month by month list of which vegetables you should be planting right now.
The guys at Cover Up are great: they make accessories for tablets and e-readers, so they have lots of those devices. They’ve made them all available for web developers to test on. Like I said: they’re great!
A great piece by Jason analysing the ever-blurring lines between device classes.
Mind you, there is one question he doesn’t answer which would help clear up his framing of the situation. That question is:
What’s a web app?
I know how Brad feels. I find it hard to muster any enthusiasm for any specific new device these days. But that’s okay. It’s more important to step back and see the trends and directions instead of getting caught up in the specifics of this particular phone or that particular tablet.
My remedy for device fatigue has been to take a step back and let my eyes go unfocused. Much like a Magic Eye, I can then see the hidden pictures behind the stippled noise that is the device landscape. This remedy helps me cope, gets me to stop caring about things that don’t really matter, and gets me to care about the broader trends the Magic Eye unveils.
Josh takes an-depth look at the navigation design implications of touch/keyboard hybrid devices, coming to a similar conclusion as Luke and Jason:
Unfortunately, the top-of-screen navigation and menus of traditional desktop layouts are outright hostile to hybrid ergonomics. Tried-and-true desktop conventions have to change to make room for fingers and thumbs.
Want to test for a hybrid device? Tough luck. Instead, argues Josh, the best you can do is assume that any device visiting your site could be touch-enabled.
Luke and Jason have done some excellent research (and put together some demos) into how the placement of navigation could be optimised for touch screens of all sizes. Turns out that the “standard” convention of having navigation along the top is far from ideal on a touch-enabled device.
There is an elephant in the Microsoft store.
A nifty example of responsive tables. View source to see how it’s done.
An interesting approach to squishing down large data tables for small-screen viewing …though I wonder if there isn’t a “Mobile First” approach that could scale up, say, lists to become tables on large screens.
A Responsive Design Approach for Complex, Multicolumn Data Tables | Filament Group, Inc., Boston, MA
A really nice pattern for data tables in responsive designs. Just as with conditional loading, the key point is making a distinction between essential and optional content.
A cute glanceable interface onto Foursquare that turns it into your own private railway station.
This is an excellent use of the Kindle as an undemanding screen. Really lovely!
Some good ideas for formatting tabular data for small screens.
Y’know, I think this comparison actually makes a lot of sense.
Edit this page. Then view source.
Cute illustration of different content types in HTML (though, personally, I would put sectioning content — section, article, nav, aside — into their own group).
Table of Condiments That Periodically Go Bad
Rachel and Kevin's new book looks very interesting indeed. It is about just one thing: CSS tables.
Ben has written a superb article outlining the hows and whys of distributed social networks with hCard and XFN, finishing with an inspiring call to arms.
As promised by Kevin Marks in the Q&A after my panel at South by Southwest, the Google Contacts API now supports OAuth. w00t!
Liveblogged notes from a discussion I participated in at BarCamp Brighton 2 about Social Network Portability.
A nice summary of the technologies presented at my SXSW panel.
Chris interviews himself about portable social networks and distributed identity.
TIm Berners-Lee explains what the "graph" part of "social graph" means. I'm still not keen on the term but I really love the idea (although I also disagree about the building blocks required today).
Brian's article on portable social networks is a clear and concise introduction to the subject with explanations of the technologies involved.
A new site to track the building blocks of portable social networks: OpenID, OAuth, hCard, XFN and more.
David Recordon announces a new developer tool for tracking status changes on social networking sites.
A new feature on Matthew Somerville's brilliant train timetable site. Just put /fares at the end of any URL to get the cheapest available fare.
Brian Oberkirch's presentation from Webmaster Jam looks excellent.
Six Apart are getting ready to make portable social networks a reality. Watch this space for code.
Dan is claiming that these notebooks could be moleskin killers. I am intrigued and I do like the nice use of Futura.
Cameron's plea for social network transparency and portability is one of the most lucid and succinct yet.
Try Plaxo's identity consolidator for yourself. Give it a URL that includes rel="me".
Plaxo to ship online identity aggregator based on microformats | ScobleShow: Videoblog about geeks, technology, and developers
The guys at Plaxo have not only implemented social network portability, they're sharing the code.
James has some quick'n'dirty Python code for extracting relationship data from social networking sites.
A mailing list to discuss portable social networks.
Giger's alien made of vegetables, Arcimboldo style.
The need for portable social networks hits the mainstream press: Professor Michael Geist writes an article for the BBC website.
Tantek, Brian, Daniel and others got together in Ritual Roasters to discuss making portable social networks a reality. Here are the notes.
Kevin Lawver has implemented portable social networks by mashing up OpenID and microformats in Rails. Read the presentation and download the code.
Portable social networks are no longer just theory: Dopplr makes it a reality.
The Museum of Kitschy Stitches: a gallery of notorious knits. Just in time for Christmas.
Sarah mocks up an interface for importing contacts across social networks.
Identity consolidation with the XFN rel="me" value. RTFM on sharing information across social networks.
Put this one in the "so bad, it's good" category. The movie is called "Undefeatable" if you fancy trawling eBay for it.
Molly has written a great article about CSS and urban planning. The ensuing comments are sometimes thought-provoking, but mostly just plain antfucking.