The Google IO 2014 conference was held on 25th and 26th June.
This year, there was quite a lot on offer for web developers. In this post, I collect 7 videos that cover research findings on mobile web usability, Google’s new unified design philosophy (Material design), a library called Polymer to help make developing web components easier and last but not least why you should be using HTTPS everywhere.
Let’s get on with it.
Design Principles for a Modern Web
What are the common usability errors made when designing mobile websites?
To try and find out, Google ran a usability study spanning 100 sites and held 119 in-person, one-hour usability sessions with Android and iOS smartphone users. This resulted in 22 principles spread across 5 categories:
- Home and navigation
- Site search
- Form entry
- Commerce and conversions
- Site wide considerations
Jennifer Gove talks us through the study and their findings.
The results of this study were used to create a set of UX principles for mobile website design.
Material Design
Material design is Google’s new visual language used by Google across all new products going forward.
It attempts to synthesise the classic principles of good design with the innovation and possibility of technology and science.
The principles of material design are:
- Material is the metaphor
- Surfaces are intuitive and natural
- Dimensionality affords interaction
- Content is bold, graphic and intentional
- Colour, surface and iconography emphasise actions
- Users initiate change
- Animations are choreographed on a shared stage
- Motion provides meaning
For a full break down of these principles, have a look at this video.
Besides, the design principles outlined above Google have also started developing a set of web components that implement the material design principles.
This video focuses on how these principles affect how you design your application. Watch as 4 Google designers talk you through applying these principles to your applications.
Polymer a Web Components Library
Web components are the future of the web.
Well, at least that's what Mozilla and Google think. Web components are a new W3C draft spec that allows developers to develop custom tags and describe how they should act and render in the browser.
The spec consists of 5 main pieces:
- Templates, which define chunks of markup that are inert but can be activated for use later.
- Decorators, which apply templates based on CSS selectors to affect rich visual and behavioural changes to documents.
- Custom Elements, which let authors define their own elements, with new tag names and new script interfaces.
- Shadow DOM, which encapsulates a DOM subtree for more reliable composition of user interface elements.
- Imports, which defines how templates, decorators and custom elements are packaged and loaded as a resource.
The polymer project is a library developed by Google that makes developing web components easier. To get started, you can work your way through this tutorial.
HTTPS Everywhere
Lastly, Ilya Grigorik and Pierre Far explain why we should be using HTTPS everywhere. They will take you on a hands-on tour of how to make your websites secure by default: the required technology, configuration and performance best practices, how to migrate your sites to HTTPS and make them user and search friendly, and more.
This is an Exciting Time to be a Web Developer
With the rapid pace of browser development and a whole host of new technologies starting to mature, there has never been a more exciting time to be a web developer. The user experience we are able to provide on the web is starting to catch up to native applications. Will 2015 be the year of the web app?
What do you think?
The post Google I/O 2014 recap for web developers appeared first on Aesthetic IO.
