Directory Image
This website uses cookies to improve user experience. By using our website you consent to all cookies in accordance with our Privacy Policy.

17 Most Important Principles of Modern Web Design

Author: Abdul Raheem
by Abdul Raheem
Posted: Jan 17, 2019

These principles cover not only aspects of modern web design, but also issues of the overall workflow, following which you will achieve a quality result.

1 - Collect interesting and original mindboards that can help in solving various problems. The basis may be taken from your work or successful examples of colleagues.

If you do not yet have your own collections of images, two wonderful resources will come to the rescue: imgspark and pinterest

  1. As a designer, you must firmly believe in what you are doing, but do not dwell on your successful techniques - constantly look for something new and improve yourself, so that you can quickly forget one idea and change to new conditions. Love every idea of??yours, but don't get too attached to them.
  2. First of all, reflect all your thoughts on paper: think about the content, layout of elements and functionality. It is not necessary to try to display the entire interface on paper - these could be some ideas for a promo block, navigation, interactive elements.

And in order not to be embarrassed by the white sheet, start drawing a browser window, this can be a good start for a start.

4 The grid will help you structure the location of various elements relative to each other, facilitate the work with the screen resolution, help to be consistent in terms of distances, as well as in many other design issues especially in affiliate site. On the technical side, the grid allows for a quick and easy way to automate layout.

If you have good reasons to start work on the grid, be sure to turn it on at any stage, check and line up all the elements on it.

5 If you look at the design of the modern site - it is about 70-80% of textual information, or even more. From this it follows that the designer must have good training in the main discipline - in the formation of textual information, in other words - in typography.

Learn to justify the choice of a font. Often, the choice of fonts is limited to the corporate style, in other cases I would not recommend using more than two different fonts, but depending on the nature of the project, their number can vary. In any case, choose a basic font that is easy to read large amounts of text, and a more informal font that would call for action (especially in headings). And do not be afraid to use a large font.

  1. Use a limited set of colors and shades to avoid visual congestion.
  2. From an aesthetic point of view, there are some points that should be avoided to create a clean and neat job, for example: blurred edges in graphic elements, blurry fonts - some look clearer depending on their size, choose the best display.

There are an infinite number of examples, so analyze each design element separately more carefully.

8 First of all, you need to understand that not all of the information should be dumped on the main page. Sites have sections, so sharing information is wise.

The simpler the page structure, the easier the navigation.

Each section on the site should disclose some topic. The design should help the user to pay attention to the most important blocks in the content. In general, there should not be too many appeals on one page. Everything should be reduced to the answer to the question: "What can I find here for myself."

9 Ask yourself: is this item really that important?

You should ask yourself this question about each design element. See which decorative elements in your design can be removed. It is not necessary to remove absolutely all decorative elements from the design, it is worth getting rid of at least some of them. Often this contributes to making your site easier to read and more elegant.

Elements that can be removed or simplified, for example: borders of images, shadows, additional images in the header / in the footer.

10 Innovation does not always come as a requirement for projects, so most often it is a question for ourselves to come up with some kind of interactive or design solution for a particular task. Therefore, I urge every designer to challenge himself on every new project.

As examples, this could be: using a new grid for positioning blocks, revising common interface elements, or even minor settings like: avoid blending mode or using one particular color.

11 Depending on the chosen concept of the project, "the love of detail" is manifested in different ways. This may be a small interactivity, unexpected animations or aesthetic "chips", such as: a light gradient on the buttons or a thin outline around the content area. But in general, they should look like integral elements of a whole and also fit naturally into it. Design - he's in the details. So pay attention to details: shadows, textures, transparency / opacity, hovers, etc.

It is necessary to ensure that each functional design element is created so that it can independently act as the best. Sometimes I leave some controversial parts of the site for last, and give them a little more attention at the very end.

12 Avoid spending too much time on one concept. The Pareto principle is universally recognized as one of the greatest discoveries in economics and sociology. Also known as the "Law 20/80", which states that 20% of efforts yield 80% of the result, and correspondingly 80% of the efforts only 20% of the result. The numbers are of course conditional. In any case, I advise you to try not to spend a lot of time on one concept, make several options, spend a small amount of time, and then choose the one that has the best course and bring it to the ideal concept, taking into account all that has been said before.

13 This principle, along with the use of the grid - one of the most important in working directly with the editor. Despite the scope of the project and the number of designers working on it, you must keep your source code "clean" and structured. This will make them more convenient for exporting various blocks, to speed up the responsive design process and to work with shared files with other designers.

14 Design cannot be considered complete without a good presentation. Present your concept as if children are in front of you.

It is as important as doing a great job. Your ideal design concept can be ignored or at least not understood if you do not present it properly. Always keep in mind: everything that is completely clear to you does not mean that it is clear to those who see this concept for the first time.

  1. Technologists are certainly creative people. They love their work as much as you, as a designer, do it well. In this lies your secret friendship or enmity with them. They are not always included in the project from the very beginning and are often included when the concept has already been approved and their creative role has not found its application. This process is incorrect. Some of the best ideas may come from a technologist, so make sure you are united with him from the very beginning of the project. The general access to the concept will lead to the improvement of the idea and to the best result.
  2. Contrary to common belief, your work on the project does not end at the moment when you transfer the source files to the developers.

If you really care about the fate of the design and interactive ideas you have done so that they are well executed, visit your fellow developers from time to time, explaining to them the importance of each pixel for you.

17 As part of the community, we all love to look not only at the end results, but also at work in the process. Sometimes the best part of a project is not considered for several reasons and is lost in archive folders. Until the project is completed, you can share with the community fragments of some design developments of the current project in Dribble, and as soon as the project is completed, make a case demonstrating the process, incorporating elements not included in the final version of the release, and share it in Revision or Behance. You will only help by contributing to the knowledge of the community, and in return you will receive the most valuable feedback.

About the Author

Abdul Raheem is an article writer and publisher at eBook Review Pro as well as internet marketer.

Rate this Article
Leave a Comment
Author Thumbnail
I Agree:
Comment 
Pictures
Author: Abdul Raheem

Abdul Raheem

Member since: Jun 23, 2016
Published articles: 4

Related Articles