My team recently finished an overhaul of the navigation on our primary product, K-State Connect. Connect serves as a dashboard for Kansas State University, displaying various university services within “widgets”. The main goal of the navigation re-design was to add links directly to each of the widgets within the dashboard. The navigation was also in need of a better small screen experience.
When did touch icons get so complicated? It had been a while since I last made a touch icon, so when I recently wanted to add one to a project, I decided I better double check the sizes of icons that I needed to make.
I remembered reading a useful article about touch icons in the past called “Everything you always wanted to know about touch icons”, which I was able to find again. I had thought there were only two sizes of icons that I needed, but I was surprised to find that the article had been updated with a recommendation to produce nine icons to account for various versions of iOS and Android.
In order to make this easier on myself (both now and in the future), I decided to make a handy Sketch template that I’ve linked to below. The final code needed in the HTML
<head> should look like this:
<link rel="icon" sizes="192x192" href="touch-icon-192x192.png"> <link rel="apple-touch-icon-precomposed" sizes="180x180" href="apple-touch-icon-180x180-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="152x152" href="apple-touch-icon-152x152-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="144x144" href="apple-touch-icon-144x144-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="120x120" href="apple-touch-icon-120x120-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="114x114" href="apple-touch-icon-114x114-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="76x76" href="apple-touch-icon-76x76-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="apple-touch-icon-72x72-precomposed.png"> <link rel="apple-touch-icon-precomposed" href="apple-touch-icon-precomposed.png">
A few weeks ago I ran across an article on The Verge titled “The best Gmail app for the iPhone is now made by Microsoft”. The article talks a lot about the new Microsoft Outlook app (a rebranding of the recently purchased Acompli app), but there was one quote that really stuck out to me:
…nobody wants to just give me an email client for my phone: everyone’s gunning to reinvent the entire experience and revolutionize the speed and efficiency of my communications.
That quote really summarizes my frustration with all these new e-mail apps. I don’t need someone to “reinvent” my e-mail experience. I don’t want to turn my e-mail into a to-do list. I just need someone to make an e-mail app that does e-mail well.
I did end up trying the new Outlook app for iPhone and still found it to be lacking in one major area: it seems to only be able to add one label per message, much like standard folders. The whole point of Gmail having labels instead of folders is so that messages can have multiple labels and thus can be found in multiple locations. Oh well, the search for a good e-mail app continues.