Apple iCloud KeyChain Web Developers Best Practice Guide

Apple’s password manager (iCloud KeyChain for Safari) may not be the best password manager but that’s completely irrelevant because by now it’s already the most popular, most widely adopted password manager in the World. It’s therefore important that you make sure your website is compatible with this piece of Apple technology. As a user of Apple’s Safari I’m increasingly shocked at the number of major websites that are not compatible with the Apple password manager.

Testing that your site works with Apples iCloud password manager will improve your User Experience (UX) and also improves your sites security.  In my experience people are much more likely to use a strong password if Safari picks the password for them.  In addition to this Safari generates a random strong password for each site, so the chances of a hack on one site being used to gain access to another are greatly reduced.

The key points to making your site compatible are:

  1. Make sure that testing your site against the Safari password manager is incorporated into your user acceptance test plans from now on.
  2. Make sure that testing includes your password change page and password recovery pages. Specifically make sure that when your user picks a new password that this gets saved away properly by Safari and is used next time they need to logon.
  3. Make sure that your site can accept the long complex passwords generated by Safari – currently 15 long containing upper and lower case and dashes.  For example:

    Apple Safari Web designers and developers password manager guidelines.
    The most frequent issue we encounter is that sites don’t allow the hyphen in passwords.

  4. Make sure that your website does not undermine this great security by then emailing out this strong password to the user/customer as part of their registration confirmation.
  5. Make sure that your website does not store passwords as clear text in its database. It should be using a one way hashing algorithm so that the password itself can never be retrieved.

If you discover any hints or tips for making your website work really well with Apple’s Safari / iCloud KeyChain password manager do please get in touch and leave a comment below.  We’ll be sure to update this blog post as we discover more about it.

Web page forms and date field best practice

I was prompted to write a quick blog post about entering dates on web forms after a painful experience on an insurance quote site at the weekend.  I needed to retrieve my quote by had to enter the reference number, my postcode and my date of birth.  I just couldn’t get the site to return my quote, it just kept saying it couldn’t be found. After phoning their helpline and spending 20 minutes listening to their music on hold they just said have are you putting the slash signs in? e.g. 10/08/1966 instead of 10081966.  There wasn’t a single clue on the page that that was required.

Dates on webpages which can be accessed from anywhere in the world are a problem due to the way dates are formatted differently around the world. Generally when displaying dates it’s best to avoid any confusion by spelling out the month e.g. 10th August 1966 instead of 10/8/1966 which could also be read by some as 8/10/1966.

When asking for a date of birth I prefer to separate the fields and make it clear to the user what is required as shown in the example below. Even if this page is accessed from a part of the world where the month is traditionally positioned at the start of the date the user won’t be confused about what they need to enter.

Best practice for date entry on web pages

Also notice that for Date of Birth we don’t display a date picker / calendar component. Using a date picker for and having to scroll back a number of years would be painful. The lesson is to seriously think about what the date is and why you are asking the user / customer to enter the date.  In this example you’ll notice that the year isn’t a drop down box.  Displaying a list of 80 or more dates isn’t a great user experience, it’s quicker to just key in four digits.

Entering dates in the future on web forms.

I love this website and the skill that has gone into making it really easy to use.  It’s for a UK hotel chain where people are booking rooms in advance. Note how the form is pre-populated with today’s date (March 17th 2014).  This is great from two perspectives. Lots of people leave booking their hotel rooms until the last minute incase their travel plans change so this means that a lot of the time you don’t actually need to enter a date at all.  Having the date pre-populated also acts as a visual guide to reenforce subconsciously with the customer how the date should be entered.  The date picker is also really well thought through. So many of the off the shelf date pickers are styled with quite a small font, this is big a bright and it’s obvious how to use it. The current date is nicely highlighted.  The developer has also taken the time to consider that you can only book a hotel room for future dates, so previous dates are greyed out.

Next time you need to ask a user for a date on a web form:

  1. Think through what the date really represents.
  2. What is a sensible default.
  3. Should it allow dates in the past and the future?
  4. If future dates then how far into the future? For example if you are asking someone to pick a delivery date why not just display the next 7 days and let them pick one of those dates from a drop down?
  5. Is the format of the date clear to an international audience and people from different backgrounds?
  6. Does a date picker make sense? I’d suggest it seldom makes sense on a date of birth for adults but may be if your developing something to record the date of birth for infants it does make sense.

Bonus tip: I’d always encourage good semantic markup but I have noticed that the default rendering on HTML date fields can yield pickers which are not optimised to the context of the date you want the user to enter. Think carefully before you leave this to chance.  For now I’d always code 3 input fields like you’ve seen in the above examples.

Does Audi support Apple CarPlay?

Apple CarPlay allows you to connect your iPhone 5+ via the lightning connector and have selected apps displayed in a simplified form on the dashboard. The simplified form means that the driver isn’t distracted by all the usual fun and features of a their iPhone.

Will Audi ever support Apple CarPlay?

I’m desperate for this functionality in my Audi.  I drive a high end model that’s only a year old but the Audi MMI system is like something from days of MS/DOS and painfully slow and clunky. Even the MMI integration with the iPhone that it supports doesn’t work that well.  I’ve now given up with it and put a cheap air vent iPhone holder next to the steering wheel and use the TomTom App for navigation which is infinitely superior to the Audi built in satnav. I’ve got an iPod touch in the glove compartment connected to the MMI interface for music and podcasts.

When I heard about the Apple CarPlay system I got excited. Some car manufactures are planning to offer upgrades to existing customers so that their cars can support CarPlay. Anyway I tend to replace my car every 2 or 3 years so I thought no doubt my next Audi would support CarPlay.

Sadly it doesn’t look like Audi are planning to support CarPlay. Their name is missing from the list of manufactures on the Apple website.  Further Audi is currently backing Google and an initiative called the Open Automotive Alliance launched in January 2014 at the CES trade show in Las Vegas.

So at the time of writing (March 8th 2014) there is no public sign that I’ve been able to find that Audi have any plans at all to support Apple CarPlay. I can’t honestly believe that they won’t ultimately have to back both standards or risk losing serious market share.  You see the thing is these days all new cars are actually really good so the purchasing decision is heavily influenced by little things like dashboard features.  Ask any car sales man these and they’ll tell you that one of the most frequently asked questions they get is ‘will it work with my iPhone’. I hope Audi do get tho sorted out in the next 12 months before I look to change my car or I’ll certainly very seriously consider another car brand.

As and when I receive any more information on Audi’s plans for Apple CarPlay I’ll post an update.