Archive for October, 2013

h1

Names suiting occupation

October 23, 2013

Sometimes a person’s name was just made for the occupation they have. When I was a kid, the only butcher in my small town was… Mr Butcher! Seriously. And for many years the spokesperson for the Bureau of Meteorology in our state was a Mr Southern.

In last week’s local paper, a veterinary clinic was advertising for a vet nurse, and the names of the top of the ad included a Dr Cockerill and a Dr Bunny ;-)

vet_names

(I couldn’t figure out the odd-looking logo until I looked closely — it’s a paw print [in white] over a red cross, in case you were wondering.)

h1

More find and replace tricks

October 22, 2013

This blog post is really for me, so that I don’t lose the link to this handy article:  http://www.techrepublic.com/blog/10-things/10-cool-ways-to-get-more-from-words-find-and-replace-feature/

h1

‘So that’ versus ‘such that’

October 21, 2013

Based on a writing tip I wrote recently for my work colleagues.

*********************

Susan asked: I see ‘such that’ used frequently these days, especially in […] documents. It’s used instead of ‘so that’. What are your thoughts?

She then gave an example:

The [ABC management system] ensures that critical information related to health, environment, safety, reliability and efficiency is developed, accessible, and maintained such that the workforce has access to and is using the most current information.

I wasn’t sure of the differences so I had to look this one up, and found a decent explanation here: http://english.stackexchange.com/questions/16883/difference-between-so-that-and-such-that

In essence:

  • ‘Such that’ focuses on consequences, or HOW something is done
  • ‘So that’ focuses on purpose, or WHY something is done

So in the example above, ‘so that’ would be more appropriate as it’s referring to the purpose (the WHY) of the [ABC management system], which is to give the workforce access to the most current information.

A simple, if macabre, example to show the difference:

  • The doctor changed Mary’s medication so that she died. This sounds like the doctor wanted to kill her (purpose).
  • The doctor changed Mary’s medication such that she died. This sounds like the doctor made a mistake (consequences).

*****************

h1

Microsoft marketing needs a proofreader

October 18, 2013

Oops!

microsoftAnd what on earth is that font they’ve used for the email where the ‘i’ and ‘t’ letters are all smaller than usual, and the ‘p’ is more bulbous than usual and bulges into the descender space? It just doesn’t ‘read’ well — the eye doesn’t flow naturally across the word and letter forms and so the brain has to hesitate (microseconds) to interpret the word.

One other thing: I read this email in Outlook 2010 on a Windows 7 computer, so it was was unlikely that it was a font rendering problem.

h1

Unfortunate kerning…

October 17, 2013

If you choose a font for your website or documentation that’s not from one of the standard/common/well-known font families, you should check the kerning (the spacing between various letters) before making it public, especially the kerning between round and straight letters.

Otherwise, you might get something like this:

kerning I read it as ‘The rapists working…’ at first, then my brain went ‘Whoa!’ and reinterpreted it correctly as ‘Therapists working…’

While this kerning issue may not be a problem with most letters (our brain adjusts quickly to slightly odd spacing), when it creates a new set of words totally unrelated to the context, then there’s an issue. Bottom line: Test your font choices before publication/distribution!

h1

Super easy zebra-striped tables using CSS selectors

October 16, 2013

I read about this trick in an article in the October 2013 issue of Australian Personal Computer (‘Powerful styling with CSS selectors’ by John Allsopp, p98-100) and thought I’d give it a try.

Wow! Super simple! Much better and cleaner than using JavaScript or coding each table row with an odd/even class.

The result

Here’s the result (ignore the ugly colors — they were just for testing the code):

zebra_tables01 The CSS

Here’s the code in my test CSS file that created the differently colored rows for odd and even rows (yes, I comment my code, especially where I can’t figure out what a color is by the hex value):

zebra_tables02

How simple and elegant is that! Basically just two lines of CSS and you’re done. Of course, substitute your own colors.

One caveat: If you have a TH row at the top of the table, it gets ‘counted’ as Row 1 (an odd row), so the color striping is ‘out’ by one.

The HTML

And here’s the bare bones HTML code I used for my test file:

zebra_tables03

Thanks for the article, John!

(John’s article has more on how this all works, and how to assign different column colors using math in the CSS, but for this post I just wanted to share the simplicity of the doing ‘zebra’ striped tables with CSS.)

h1

In what world is this usable?

October 15, 2013

The Australian Yellow Pages website (www.yellowpages.com.au) has undergone several incarnations in its lifetime, but this latest one takes the cake.

I’m sure they’ve made changes to deal with the mobile and small device world, and perhaps the current site works well on those devices (I just checked on my tablet and phone and it works fine). But it’s just horrible on a standard desktop monitor, even when I widened Firefox across two monitors:

yellow_pages

No matter what I did, the drop-down list would not expand its width to show all the ‘home maintenance’ options. As I said, it works fine on my Android tablet and Android smartphone, but NOT on Firefox my desktop.

Fail.

Update: And today it works fine! So why wouldn’t it work properly on Firefox yesterday? (rhetorical question — no need to answer…)

h1

The good, the bad, and the ugly of assembly instructions

October 14, 2013

assembly05

I decided to lash out and buy a garden cart. We have an acre of land, at least half of which is garden. When I go into the garden, I’m limited in what I can take with me, so depending on what I’m doing, I may have to go back to the shed to pick up another tool. For example, if I’m spraying weeds, I need two hands (one for the container, the other for the attached spray nozzle), which means I can’t also carry a weed puller, a water bottle, and secateurs to deal with garden issues as I see them, or my phone. I’ve thought of a garden tool belt, but hadn’t got around to investigating them too much as I didn’t want something heavy around my body that might restrict movement or that might be too hot to wear.

So when I was having lunch with friends in town the other day (we all live in semi-rural areas), we got to talking about the versatility of garden carts as you do when one friend lives on a 6-acre property, and the other two on 0.75 acre properties. I decided to get one. The store didn’t have one made up (and I doubt it would’ve fitted in my car anyway as I had a lot of supplies loaded up) so I took the flat pack.

I figured it shouldn’t be too hard to put together, and thought that it might take me an hour to do so if the instructions were clear and everything needed for the assembly was included. But as the flat-pack cart was made in China, I was a bit doubtful about the instructions, based on previous experiences with similar sorts of products.

The good

There were English language instructions inside the box — this was a good start.

And all required nuts, bolts, washers, etc. were supplied. I was impressed with how they did this — it was a cardboard sheet broken up into steps that matched the instructions, and for each step they had supplied all the required parts for that step. So there was little chance you’d use the wrong part if you only broke open the shrink wrap for each step at a time. This was really useful and helpful and I highly recommend it to other manufacturers of flat-pack goods.

On the back of the instructions was a complete list of ALL parts supplied. Each one was named and numbered (though the numbers for some were hard to read — it didn’t matter here as the numbers were sequential down the page) and each had a basic line illustration to show what that part looked like.

One other thing that was really useful was an illustration of what the assembled piece should look like after you’d completed each step. This was really handy to confirm that you’d installed the parts correctly, and would be another feature I’d recommend to manufacturers of flat-pack goods.

assembly01

Not looking promising — no instructions to be seen yet

assembly02

Contents of the box

assembly03

Yay! Instructions and required nuts, bolts, washers, cotter pins etc.

assembly_instr02

There was a full page of all parts, numbered and named, and with an illustration

assembly04

All required nuts, bolts etc. were shrink-wrapped into Step 1, 2, 3 etc. bundles. There was no chance of using the wrong part if you followed the steps.

The bad

There was one vital thing that was missing, and that was information about what tools you needed to assemble the cart! You needed a crescent/shifting spanner (or similar) and a ring spanner (or similar) to tighten the nuts (and information on what size you needed). These spanners were essential. You could only finger tighten the nuts a tiny bit — just enough to get the nut on the bolt, but then you had about 2 cm loose and no amount of finger tightening would get that nut tight as there was some sort of rubber (?) seal that prevented it being tightened without a tool to provide some torque. I made several trips to the shed to get various spanners before I found ones that fitted.

The other vital information *was* provided… but not until Step 8 (of 10 steps). And that was that you needed to make sure all nuts/bolts were tightly secured. This should have been mentioned in Step 1 or in the introductory list. I left the nuts/bolts loose initially, thinking that was how it was meant to be as I couldn’t tighten them any more with my fingers. But that obviously wasn’t going to work, so without instructions to do so, I found the spanners and tightened the nuts/bolts anyway… only to find that they told me to do so in Step 8 when the cart was almost fully assembled.

The ugly

The instructions, while pretty clear as far as text went and with very useful ‘after assembly’ illustrations, were just hopeless when it came to identifying the numbered parts for assembly. In the text you see in the image below, the numbered parts are mentioned in the step; those numbers are also reproduced in the illustration as white numbers inside black ovals. But they were IMPOSSIBLE to read! Even with a magnifying glass. The black ovals with their white numbers were tiny and/or fuzzy — it looked like an old faxed copy that had been photocopied several times, with the resolution getting worse each time.

The scanned copy below is exactly how the printed instructions were — there’s no extra fuzziness from the scan.

assembly_instr01

‘Impossible to read’ illustration with numbered parts

Conclusion

Despite the limitations of the instructions, I eventually put this cart together, though it took me two and a half hours instead of about an hour. Had I been told about the need for spanners and tightening the nuts right from the beginning, and had the illustrations been much clearer than they were, then I expect I would have completed the assembly in less than two hours. And with less frustration.

Ultimately, this experience was let down by the instructions — vital prerequisites weren’t listed, and labelled illustrations weren’t clear enough to read. I think it’s vital for anyone writing instructions to actually use them as a user would, and/or to get someone else (with no experience) to test them. With testing, these basic omissions would have been detected and fixed prior to release. And I wouldn’t be writing this blog post.

assembly06

Loaded up and ready to work!

BTW, I used this cart on the weekend and it’s very handy!

h1

Mixed error messages

October 11, 2013

Why is it that here we are in 2013 and STILL website error messages are confusing and often contradictory?

I needed to create an account with one of the Australian federal government agencies (yes, ASIC, I’m talking about you!). Easy enough — just my name, email address, phone number, and a password. Not so…

I entered an 8-character password (with numbers and letters), then got this (click the image to see it all [aside: spot the spelling error]):

password_error01

Hmmm… I tried again, this time adding two numbers to the end of my existing (so now it was a 10-character password with six lower case letters followed by 4 numbers). As far as I could understand that error message, my password met the requirements.

So I clicked Submit again, and this time I got this:

password_error02

The problem with this second error message was that there was NO ‘entry above’ — it was totally meaningless.

I tried a couple more combinations, still using 10 characters, but converting some lower case letters to upper case ones. Still the site wouldn’t accept my password and I kept getting this second message. I must have tried about five different combinations and was ready to give up… But I’m nothing if not persistent when it comes to technology and especially bad user experience on websites ;-) (It’s all fodder for blog posts like this!)

My final foray before giving up and walking away in frustration was to hover over the question mark next to the password field. I got this tip:

password_error03

Note that the wording is different to that displayed in the first error message. This time it says that my password MUST contain AT LEAST three lower and upper case letters and three numbers, though it wasn’t clear about whether special characters were required. The first message said OR implying any combination, whereas this one says AND.

I tried more variations on my 10-characters, but still couldn’t get in. Then I had a brainwave — maybe I should try only nine characters and make sure that I had three lower case letters, followed by three upper case letters, followed by three numbers. And guess what? That worked!

So it looks like this password check was quite specific, but the error message and tooltips didn’t tell the whole story. ‘Minimum nine characters’ actually meant ONLY nine characters, and ‘contain at least three’ meant three in ORDER.

No wonder people walk away when online registration forms like this are so hard to use!

(One final thing… the requirement to NOT use two or more consecutive letters from your username [which must be your email address on this form], first, or last name seems particularly onerous. And the requirement in the first error message to not use one of your previous EIGHT passwords seems particularly onerous too. Not that that was relevant to me — I had enough trouble entering my first password ;-) )

h1

Serendipitous placement

October 9, 2013

Sometimes I see adjacent posts on Facebook or Twitter that came from random people in my friends lists, but that have a common thread or even color in their images, or that are juxtaposed in such a way that reading them in a stream is funny. And so with these two from my Twitter stream the other day:

Twitter_juxtaposition

Well, it made me laugh!