The term Plain design o Flat Design describes a special type of web design in which the functionality of the web is the center of attention. This is done without the usual design items such as textures, ornaments or shadows, in order to reduce design to the core.
Flat design principle
Flat design contrasts with skeuomorphism, which in the past consisted of orienting webs as closely as possible to the "original". A commonly cited example is note apps that look like a real notepad, from the lined "paper" to the "leather case", which have been made with the corresponding textures. A flat design deliberately dispenses with 3D items, lighting effects, or three-dimensional buttons. Instead, it is the clear lines, the easily legible letters with a rather elegant progression and the play of colors that count. The innovations that go hand in hand with flat design are, among others:
- Free choice of fonts (web fonts).
- Design icons using fonts (vectors) that can be scaled by any browser without loss of quality.
- No use of background images or textures.
- Structuring by colored surfaces and buttons.
- Strong clarity of the web page.
- Intuitive navigation.
- High usability.
- Focus on content rather than design.
- There is no need for small designs with too many photos.
Typical representatives of flat layouts are, for example, one-page ones, in which all the information is found on a single sub-page, a variant commonly selected for corporate websites that would only have a few sub-pages. Large websites, where a single large graphic and single statement are in the center of the home page, are also part of the "flat design" concept.
Examples
Even before flat design was successful, there were already several large manufacturers who applied this principle. For example, Microsoft with the Metro design of Windows 8, which differs greatly from its previous versions. This development can also be observed in current smartphone operating systems, such as Android or iOs, and smartphone apps are designed in this way.
Difference in Responsive Design
Responsive design is commonly mentioned in the same topic as flat design. However, both terms do not mean exactly the same thing. Responsive Design is a web design that effortlessly adapts to a wide variety of browser models and can thus be viewed unrestrictedly on a small cell phone screen and on a 24-inch monitor. Flat design, on the other hand, exists regardless of the device chosen. Responsive design is usually also flat, but flat design is not automatically responsive. However, a flat design reduces load times and is more flexible and adaptable to different solutions. Hence, it can be part of Responsive Design.
Advantages of flat design
Flat design requires far fewer design items, such as complex images or effects. This means that much less data must be transported when loading the web. On the one hand, it has a positive effect on loading times, but it is also sensible for mobile phone users, mainly when it comes to the use of their data volume. The flat design prevents the websites from being overloaded, which can make it difficult for the user to use.
Disadvantages of flat design
A disadvantage may be that the loss of the character of a website can also result from the abandonment of certain design items. Many pages with a flat layout are very similar in terms of structure and layout.
Navigation can also be problematic. This is particularly important for small devices. The flat design makes it more difficult to guide the user and show him how to navigate the web portal correctly.
Experts even assume that a flat design for an online store can mean conversion losses if implemented too extreme. Thanks to their reduced design, the conversion items are no longer distinguishable from the rest and cannot be sufficiently perceived by the user.
