Blogging and all that malarkey

A jQuery plugin that:

Grabs all your HTML, and resizes it inside the browser when you click the width you want.

Potentially useful as a demonstration as well as a development tool. As well as a set of fixed (device derived) widths, I’d love to see the ability to add any width. I’m sure Jeremy would like it written in plain Javascript too.

Speaking of proprietary Apple meta elements, here’s a little gem for labelling a site’s home screen icon on iOS.

You might think — because all the talk at the moment is about seven inch tablets, in particular the iPad mini vs Google’s Nexus 7 vs Amazon’s Kindle Fire HD — that a seven inch tablet was a seven inch tablet was a… Right? Wrong.

I spent a couple of hours this afternoon upgrading this site’s iOS ‘Add to Home Screen’ icons and startup screen images.

I’m glad that people like my financial buffer business post the other day. I don’t think people write enough about the business side of what we do and from what I hear, not enough about it gets taught at universities either. I’m not a very good businessman, truth be told, but I have learned a few things over the years, so I thought I’d start sharing them.

Sergio Nouvel, writing for UX Magazine, about ‘Hi-Fidelity Wireframes.’

This is what most people have in mind when they think of wireframes: a carefully crafted blueprint, which is usually true-to-size and incorporates the highest level of detail previous to the final visual comp. In other words, this is a final comp, minus the look and feel, color palette, and fonts.

Sizes, whitespaces, margins, proportions, and line-heights are considered in this kind of wireframing, usually produced in a precision tool such as Fireworks, Illustrator, or OmniGraffle. This document is ready to be dressed by the visual designer with textures and branding.

“Dressed?” Dressed? You could of course substitute the word ‘decorated’ because that’s what design is reduced to in a so-called UX, bullshit, workflow where this kind of wireframes play a role.

I’m not arguing with Sergio though. This is a great article. Not only should you read, if you work with someone who spends hours in tools like Axure, you should print it out and staple it to their head.

After me saying the other day that I won’t buy an iPad mini, James Sherrett has tugged on my wallet.

But a desktop site won’t work on a seven-inch iPad Mini. A typical 12-pixel font will be unreadable. The buttons will be unclickable. The form inputs will drive people away.

At worst, a desktop website will look broken. At best, a desktop website will be hard to use.

My wife (who handles our finances) made me laugh yesterday when I brought this up. She said, “if you want an iPad mini, just hold your regular iPad at arms length.”

But designing for tablets isn’t just about what you ‘see’, it’s about what you ‘touch.’ Me ordering an iPad mini tomorrow is looking more likely.

A friend of mine works as an in-house designer. He emailed me the other day with a question that’s come up a few times recently. It’s a question I’m asked by people at various stages of their careers, from students to those, like my friend, who’ve worked for somebody else for a long time. The question? “What financial advice do I have for anyone who’s planning to go self-employed?” Rather than write that advice in an email, I thought it might be more useful if I wrote it as a short post.

A 64Gb first generation iPad sits by my desk. I bought it on the first day they were available in the US and, like many people I suppose, using it has changed what and how I design.

Microsoft launches Windows 8 in just a few days, so now’s a good time to turn our attention to Internet Explorer 10. Here are two links to help you get prepared:

Chris (I so want to say “Stretch”) Armstrong:

Absolute units like pixels effectively give a layout a sell-by date, locking it to a finite resolution range in which it will “work.” Proportional units (ems, rems, and percentages) enable you to define the important relationships between elements, and are a crucial first step on the road to resolution independence.

An incredibly useful, and beautifully designed, colour tool by Lea. I can see myself using this all the time. (Some background to the tool.)

This spot reminds me somewhat of Apple’s iPod ads and I don’t mean that in a bad way. I like the look of the Surface. I like it a lot and will probably pre-order one (for testing) this week. Even as an Apple devotee, I really hope that Microsoft does well with the Surface.

I have a Windows Phone 7 phone that I used as my only mobile until I upgraded to the iPhone 4S and I love the we don’ call it Metro no mo’ Windows 8 Style interface. If I had to stop using an iPhone tomorrow, I’d head straight to a Nokia Lumia running Windows Phone 8.

Thibaut Sailly added an extra dimension to the three-lines responsive navigation icon discussion by suggesting that the three horizontal lines could represent a gesture.

In a fantastic A List Apart double bill, Matt Griffin tackles Responsive Comping: Obtaining Signoff with Mockups:

Sending clients in-browser comps is remarkably easy, as it turns out. We just e-mail them a URL. Clients can look at the designs in various browsers and on various devices, resize them, click links and navigation, and check out hover states. Instead of asking our clients to pretend that an image is a website, we show them a website.

Keep in mind though, that showing clients a prototype instead of showing them static visuals is about setting realistic expectations and not about designing a browser.

Something strange happened to me on Twitter today.

I’m glad that the three-lines icon I suggested first, back in March is now being established as a sort of standard.

With the help of Tapbots’ Netbot client, it looks like App.net might be gathering steam. If App.net’s your thing, you’ll now find me there too although I guess I’m not alone in being unsure when I’ll use App.net instead of Twitter.

Follow me on App.net. (Damn that name isn’t getting any easier to say.)

Jordan Moore (who has a name like a country singer, but doesn’t like country and can’t sing):

There have been calls recently from Andy Clarke and Jeremy Keith to have a standard icon for revealing navigation in small contexts, and rightly so — this is a new technique and we need to set users’ expectations about the consequence of the reveal action.

The app uses regular expressions to find the parts of the selector which contribute to specificity. It highlights each part with a background colour to help you learn the specificity rules.

Then of course, there’s always Star Wars.

Aarron Walter is one of those people I wish I could spend more time with. Every time we’re together, I learn so much from him. Here, Aarron tells the story of how he helped me make my talk at Smashing Conference more balanced and inclusive (he does that to me a lot), particularly when it comes to (so-called) UX.

This article is published on On My Mind, Aarron’s email newsletter, which is well worth subscribing to.

This seems like a lot of work, but I am acutely aware how large some of the high-resolution (retina) assets are on this site.

Via Jeffrey, who thinks “this is madness.”

Stu’s compiled a great list of resources for LESS users (like me) who need to use, or want to switch (Blah. Blah. LESS. Sass. Sass. LESS. Blah. Blah.) to using Sass.

Personally, I love LESS. But the real kicker is that I’m trialling a soon-to-be-released compiler that compiles Sass but not LESS, and it doesn’t play nicely with Codekit. That alone could persuade me to make the move to Sass. (For God’s sake don’t tell Jina Bolton that.)

My design hero, TrentWalton, on how he and his amigos responsively redesigned the Microsoft.com homepage.