With Android 5.0 Lollipop and Chrome 32, Chrome tabs are now integrated into the app switcher, appearing as separate apps. This is a key step towards integrating websites equal to apps into the Android experience.
In the first screenshot, you can see two versions of the ODL site – one with no meta, and one using the new meta and icon. The lower one blends into the app browser like any other app.
The site without the icon shows a ‘W’ as it is on the wearebase.com domain.
To compare, at the top you can see Google Play Music and Pocket Casts – two normal apps. (Pocket Casts is yet to update to support the colour bar.)
And here it is in the page itself – the address bar and the OS status bar at the very top both blend in with your chosen colour scheme. Picking a nice, complementary colour is important here. It’s worth noting that Chrome automatically switches your text colour from black to white if you pick a dark colour.
Over on HTML5Rocks, they’ve got the skinny on what you need to add:
For example, to set the background to your favorite color or HTML5Rocks orange:
<meta name=”theme-color” content=”#db5945″>
In addition, Chrome will show beautiful high-res favicons when they’re provided. Chrome for Android picks the highest res icon that you provide, and we recommend providing a 192×192px PNG file. For example:
<link rel=”icon” sizes=”192×192″ href=”nice-highres.png”>
You can also set the ‘Add to Home Screen’ settings through a manifest.json.
A word of warning
On a traditional website with seperate pages, the colour flashes from the Chrome grey to your chosen colour every page load. This means a user’s experience using this might be jarring or confusing, so use with caution. Hopefully future updates to Chrome will phase the colours much like the rest of Lollipop does. If you’re using a single page webapp like Meteor or Angular, this shouldn’t be a problem.
For now, it may be a better idea to upload a hi-res icon and leave the colour.
If you need access to a Lollipop device, get in touch – at the ODL we have a number of devices soon to be updated to Android 5.0 Lollipop, so they will be available for you to test on.