Tags: ask

22

sparkline

Friday, November 25th, 2022

Tweaking navigation sizing

Gerry talks about “top tasks” a lot. He literally wrote the book on it:

Top tasks are what matter most to your customers.

Seems pretty obvious, right? But it’s actually pretty rare to see top tasks presented any differently than other options.

Look at the global navigation on most websites. Typically all the options are given equal prominence. Even the semantics under the hood often reflect this egalitarian ideal, with each list in an unordered list. All the navigation options are equal, but I bet that the reality for most websites is that some navigation options are more equal than others.

I’ve been guilty of this on The Session. The site-wide navigation shows a number of options: tunes, events, discussions, etc. Each one is given equal prominence, but I can tell you without even looking at my server logs that 90% of the traffic goes to the tunes section—that’s the beating heart of The Session. That’s why the home page has a search form that defaults to searching for tunes.

I wanted the navigation to reflect the reality of what people are coming to the site for. I decided to make the link to the tunes section more prominent by bumping up the font size a bit.

I was worried about how weird this might look; we’re so used to seeing all navigation items presented equally. But I think it worked out okay (though it might take a bit of getting used to if you’re accustomed to the previous styling). It helps that “tunes” is a nice short word, so bumping up the font size on that word doesn’t jostle everything else around.

I think this adjustment is working well for this situation where there’s one very clear tippy-top task. I wouldn’t want to apply it across the board, making every item in the navigation proportionally bigger or smaller depending on how often it’s used. That would end up looking like a ransom note.

But giving one single item prominence like this tweaks the visual hierarchy just enough to favour the option that’s most likely to be what a visitor wants.

That last bit is crucial. The visual adjustment reflects what visitors want, not what I want. You could adjust the size of a navigation option that you want to drive traffic to, but in the long run, all you’re going to do is train people to trust your design less.

You don’t get to decide what your top task is. The visitors to your website do. Trying to foist an arbitrary option on them would be the tail wagging the dog.

Anway, I’m feeling a lot better about the site-wide navigation on The Session now that it reflects reality a little bit more. Heck, I may even bump that font size up a little more.

Wednesday, March 24th, 2021

Show/Hide password accessibility and password hints tutorial | Part of a Whole

A good tutorial on making password fields accessible when you’ve got the option to show and hide the input.

Tuesday, February 25th, 2020

Reflections on software performance - Made of Bugs

I’ve really come to appreciate that performance isn’t just some property of a tool independent from its functionality or its feature set. Performance — in particular, being notably fast — is a feature in and of its own right, which fundamentally alters how a tool is used and perceived.

This is a fascinating look into how performance has knock-on effects beyond the obvious:

It’s probably fairly intuitive that users prefer faster software, and will have a better experience performing a given task if the tools are faster rather than slower.

What is perhaps less apparent is that having faster tools changes how users use a tool or perform a task.

This observation is particularly salient for web developers:

We have become accustomed to casually giving up factors of two or ten or more with our choices of tools and libraries, without asking if the benefits are worth it.

Sunday, June 2nd, 2019

Fantastic pop-up from @mestiza.filipina at @hollertap: ox tongue with pickle and banana ketchup!

Fantastic pop-up from @mestiza.filipina at @hollertap: ox tongue with pickle and banana ketchup!

Friday, February 9th, 2018

I finally made sense of front end build tools. You can, too.

I still find the landscape of build tools completely overwhelming, but I found this distinction to be a useful way of categorising the different kinds of build tools:

Build tools do two things:

  1. Install things
  2. Do things

So bower, npm and yarn install things, whereas grunt, gulp, and webpack do things.

I think.

Wednesday, July 5th, 2017

It is as if you were doing work

Stop dilly-dallying and just get this work done, okay?

Thursday, April 27th, 2017

Using NPM as a Build Tool | gablaxian.com

For a small to medium sized project, this sounds like a sensible way to approach build tasks. It feels nice and close to the metal.

Monday, April 3rd, 2017

adactio/ama: Ask @adactio anything!

I’ve made one of them there “ask me anything” things so that you can ask me, well …anything.

Wednesday, March 22nd, 2017

Improve Your Billing Form’s UX In One Day – Smashing Magazine

A few straightforward steps for improving the usability of credit card forms. The later steps involve JavaScript but the first step uses nothing more than straight-up HTML.

Sunday, July 17th, 2016

Barbecued Thai chicken.

Barbecued Thai chicken.

Monday, March 2nd, 2015

Password Masking

A great investigation into the usability benefits of allowing users to fill in their passwords in plain text.

Major caveat: make sure you still offer the ability to mask passwords too.

Thursday, April 24th, 2014

Labelmask | Brad Frost Web

I really like this interface idea from Brad that provides the utility of input masks but without the accessibility problems.

Wednesday, November 7th, 2012

LukeW | Mobile Design Details: Hide/Show Passwords

I concur completely with Luke’s assessment here. Most password-masking on the web is just security theatre. Displaying password inputs by default (but with an option to hide) should be the norm.

Wednesday, October 17th, 2012

digitalBush » Masked Input Plugin

This looks like a handy way of enhancing forms to have input masks (Luke W. would approve). Right now it’s a jQuery plug-in but I’m sure someone as smart as you would be able to create a standalone version, right?

Thursday, February 17th, 2011

ifttt / About ifttt

This intrigues me. “If this, then that” sounds like a good approach to loosely joining some small pieces.

Saturday, October 23rd, 2010

Kitchen Interfaces Suck; Let's Break Down Why | Co.Design

Aza Raskin on the UI failings of kitchens.

Tuesday, September 7th, 2010

Did you have a nice day? - Made by Rattle

A beautiful SVG visualisation (with source code) of the Rattle team's experience of dConstruct 2010.

Thursday, December 4th, 2008

The Whale Hunt / A storytelling experiment / by Jonathan Harris

An experiment in human storytelling, using a photographic heartbeat of 3,214 images to document an Eskimo whale hunt in Barrow, Alaska.

Tuesday, September 16th, 2008

SHOUTS & MURMURS: My Gal: Humor: The New Yorker

This article by George Saunders had me giggling from start to finish.

Saturday, May 31st, 2008

Alasgone

This is the second briefest visit I’ve ever paid to Seattle. I arrived last night and I’ll be leaving in just a couple of hours to head for home.

The briefest visit I’ve ever paid to Seattle was just over a week ago. That lasted just long enough for me to grab a few hour’s sleep in a hotel near the airport — in room 404, no less — before heading north to Anchorage, Alaska.

In the following week I saw plenty of sights. I certainly had no lack of daylight in which to see them. With just a few weeks to go until the Summer solstice, night time doesn’t last very long.

I spent three days on The Spirit of Columbia cruising around the glaciers of Prince William Sound and the rest of the time was divided between Anchorage, Talkeetna and Denali National Park.

The three-day cruise offered up plenty of wildlife sightings: one bear, a drove of mountain goats, a bevy of otters, a bob of seals, a convocation of eagles and a gam of whales. The sight of a young humpback whale lunge-feeding near the shoreline was eclipsed only by the unusual sight—to my eyes, at least—of an eagle swimming. I thought that maybe the eagle was in distress but no, apparently when an eagle catches a really big fish, it will try to swim to the shore with it rather than let the prize go.

The landscape was, needless to say, spectacular. I took plenty of pictures but the only ones that really get the scale across are the panoramas I stiched together (Photoshop CS3 makes this a breeze using FileAutomatePhotomerge).

Peruse these at full size to get all the detail. I’m particularly fond of the panoramas created from pictures taken on a crisp clear day atop a glacier at Denali after an exhilarating helicopter ride.

  • Water
  • Clear
  • Ice ahead
  • Glacier
  • Snowy landscape
  • Helicopter on ice
  • Glacier landing