Websites Where White Space Is an Important Design Element - Part 1
October 2, 2014, by Sebastian Maier
Design is much more than arranging shapes on a background. The background itself or the white space, on which the shapes are arranged, can also represent a very important and stylish design element.
In my opinion, space was integrated really masterfully into the design of the following websites. Here, it is much more than just “empty space”, but instead an important part of the overall layout.
See for yourself!
Cardboard boxes are simple, but with similarly simple web design they can be presented in an exciting way – like the one pager of the Chinese SUM HING CARDBOARD FACTORY shows. On a grey surface area, the animated product comes into its own particularly well.
On blloon.com, users can read books online and easily too, without paying even a cent. The web design is just as clear as the offer. Gaudy texts on brightly-colored backgrounds alternate with each other in an animated slideshow. If you scroll down the website, you experience the use of the parallax effect in the e-book reader.
On the website of Sydney Stockholm, a provider of blog relations, space is used generously not only in the design of the one pager, but also in the embedded video. The white writing on bright yellow is an unusual color combination and is all the more eye-catching for this reason. Grid design is largely adopted in the mobile view. Probably to enable the site load faster via the usually weaker mobile internet connection, the video is not integrated with the responsive design.
At the renowned Busenbender Dental Studio, the focus is on a good relationship with the customer and personal contact. That’s why, with the unconventional appearance of the website, the grey background is also specifically chosen as a platform to put the staff in the limelight.
If you wish, a text box will open only after you click on the ‘+’ sign. Even the navigation is hidden elegantly and unobtrusively at the top left corner under the “Menu” field. Both areas can also be re-closed so that the surface area takes up the most space again and the focus remains on the pictures. (By the way, this is a smooster project.)
The Bema photography and film studio, with its one pager presented in grid design, focuses on artistic photographs. A realistically photographed hand on a saffron-yellow background awaits the visitor on the homepage. An animation starts in the photos below, when you move your mouse over it: An overlay in a gaudy color and a zoom-in effect.
So you see, less is sometimes more even in web design. How do you guys like using white space as a design element?
P.S.: Expect Part 2 next week!