One of our main goals is to be available to all users, regardless of where they are and how they want to consume our content. One important aspect of this is that all our services should be adapted for accessibility. All users should feel that the services are quick and easy to handle, even with a cheap mobile and a bad internet connection. Another equally important thing is that our services should work on future platforms, even if they have weaker hardware and less capable web browsers than the established platforms do.
To develop web services that meet these demands, we use a number of well-known and proven web development techniques and methods. All our services should be implemented according to them. The goal of the techniques is to be able to use the latest web technology and still support less common web browsers and platforms.
All web services that we develop should be build on progressive enhancement. This is a layer-based technique where you focus on content and the core of the service. This core functionality should be built with a simple and stable base. It should be implemented with accessible, semantic HTML and basic CSS that works well and looks good in all browsers. This base can be extended with new functionality layers that enriches the user experience in the browsers that supports them.
Follow web standards
A consequence of following standards is that we can’t make specialized solutions for broken web browsers that haven’t implemented these standards correctly. This is to avoid the administration of complex solutions to solve specific bugs in browsers that might not longer be used by any of our users.
Feature, Device & Browser detection
Feature detection means that appearance and functionality is adapted to what the web browser supports. Device and browser detection is a much more costly technology from a maintenance perspective, because the tests needs constant adjustments to take new browser versions and devices into consideration. Device and browser detection is more error prone than feature detection, because it’s difficult to determine which web browser that is used, especially because browsers often masquerade as something else.
To be future-proof and reduce the burden of maintenance, all progressive enhancement in our services should be based on feature detection. In exceptional cases, device or browser detection can be used, if this is the only possibility. But the decision should be discussed, and the reason should be documented in detail.
Cutting the Mustard
Progressive enhancement and feature detection create amazing possibilities to give a perfectly custom-made experience for the web browser that the visitor is using. But to consider all combinations of possible functions provided by different browsers in different operating systems can get very complex. It is also expensive to develop and maintain.
Responsive design is about presenting content adapted for the users’s devices and screen sizes, without having to develop different services for this. Responsive design is based on that all content should be available regardless of device and screen size. How the content should be presented can vary and should be tailored to make the best use of the user's particular screen size.
From a technical perspective, responsive design means that the images, typography and layout of the web page is changed to fit the user's screen size, using flexible images, elastic columns and media queries in CSS.
At SVT, we strive to develop our web sites mobile first. In practice this means that we start developing the site for the the narrowest screens first. This is the layout the user will se if no media queries are applied. We then scale up the layout using media queries on larger screens. From a design perspective, mobile first helps to focus on core values, and what is important to the user. The design shows what is central and relevant in the content, and presents it first.