In part 2 of this article we shall consider what new assumptions we recommend considering when designing for the modern day web. We don’t claim to have invented these ideas, but believe that spreading and sharing such thoughts will result in a better web for everyone.
Related Articles
Your user will have touch screen capabilities
When considering touch screens, many designers are satisfied that all their links and menus work by tapping the screen of a touchscreen enabled device. They forget that single tap, double tab, swiping, multi-finger swiping for scroll and other and complex multi-finger gestures are being used more and more by users, and these users will soon expect to be able to use these gestures on your site. All devices will trigger an action, but it could be in increasingly different ways. For selection, with a mouse, it’s a click; with a touch device, it’s a tap; on a keyboard, it’s the “Enter” key. Phones are starting to (and have for some time) had capabilities of controlling things by voice, and even recognising hand gestures in the air.
Smartphones with touch screen
Hiding content and showing it on mouse over was considered to be a reasonable design pattern. This worked for a long time, until touch devices entered the market. What should a device without a mouse do when content can be revealed only with a mouse? Consider a drop down menu. When the user taps such an item – will this trigger the sub menus, or actually should the link activate? On an iOS device the behaviour is actually something else entirely. On first tap, the hover event fires, and on the second tap, the link will be followed. How many users will miss out on the fact that they have to tap the second time? On Android, the mouse over event and the link is triggered – which makes even less sense. HTML5 technology now allows very advanced and complex solutions (Touch and Mouse) where you define different interactions for different devices. To us, this appears like we are revisiting old ideas like when you would have a different Style sheet for every version of Internet Explorer, and is not entirely desirable. The goal should be to make sure the default interaction or event works for all devices! You can then choose to improve the behaviour for certain users.
Your user will have a small screen
As an industry we have developed a range of solid techniques to grow websites so they look good on almost any size screen. A harder thing to master is the ability to shrink the page and still retain the desired aesthetics and necessary functionality.
Different screen size
When deciding to implement a responsive website design, try starting with the smallest possible viewport. The result of this will be that you end up with all of the uttermost important elements – the site can then grow from there. We know one thing for certain – the website will be able to display the content. Even with a minimal feature set, the device will be able to show letters – so this is an obvious area to start at! We can then progressively enhance the experience for users with bigger screens.
Your user actually wants to see your content
Previously many designs were laid out in the obvious fashion of logo and navigation on top, navigation on the left, and footer on the bottom. Although we have come a long way since then in terms of design aesthetics, we still see this commonly in one way or another around the web. All of these elements actually help the user to leave the page he/she is on – why not focus on the content, and make sure it’s relevant, looks good, is readable, and works! As is said so often, less is (often) more, and the less distractions the user has when consuming your content, quite often the better. Design your pages to be clean and modern rather than packed full of useless widgets and other distractions – and see your site “stickyness” factor jump. Consider if your logo really needs to be at the top of every page, or if that massive slider is helping things or distracting the user from the goal of the site. If the navigation looks more important than the main content, reconsideration might need to take place.
The last word on progressive enhancement
Both parts of this blog are really communicating an idea that has been around for a while – the idea of progressive enhancement. Start with designing around the content, optimising and laying out for different devices, and after that focus on optimizing for specific features of specific devices – hopefully there will be budget left to do these things, but if there is not, you still are communicating the base and most important areas to all users. Although the web’s “Wild West” days are gone, it is still a borderless and largely unregulated realm in terms of design, and devices which can connect to it. The singular ways of interacting that we’ve worked with for so long will no longer suffice, and attention needs to be drawn to this if our projects are to communicate effectively for all users. Making new assumptions or starting points for web projects will go a long way towards achieving this goal, and this article has outlined only a few new ideas.
Related Web Design Resources
Web Design Assumptions – Learning From The Past
Essentials For Professional Web Design
Web Design Starting Points
The Future Of Responsive Web Design
The post Web Design Assumptions – Preparing For The Future appeared first on Web Design and Development Blog | Leading Edge Web.
This post first appeared on Melbourne Web Development & Website Design Servici, please read the originial post: here
