10 Tricks for novice web designers to know

Absrtact: Most of the lessons you learn in web design come from working experience. Learning is a recurring process, and there is no better way to gain knowledge than to make mistakes. In this article, we'll discuss 10 important and general tips that every novice web designer should know.

There are a lot of problems in making a Web site, so web designers often have a variety of roles to play and to master how to build an effective and useful site layout knowledge.
Most of the lessons you learn in web design come from working experience. Learning is a recurring process, and there is no better way to gain knowledge (learn from mistakes) than to make mistakes. In this article, we'll discuss 10 important and general tips that every novice web designer should know. (Web front-end Learning Exchange Group: 328058344 prohibit small talk, non-happy do not enter!) ）
1. Optimize the picture for better page loading speed
Learn how to optimize page images by choosing the right format, and make sure that the file size is small enough for you in a workable range. Although people are already using broadband, there are still people dialing the Internet. In addition, although mobile device technology popularization, but mobile devices do not necessarily support the same speed as broadband, the size of the image file may still prolong the load time of the page, it is possible to drive users away.
Here's a tip for choosing the right file format: If the picture is monochrome, it's best to save it in PNG or GIF format, and if it's a continuous hue (like a photo) it's best to save it in JPG format.
[Image upload ... (1)]
There are a lot of tools that can help you further optimize your pictures and reduce their file size. You can refer to this list of tools to help optimize your images. Try to minimize the number of pictures and use them flexibly, and reduce the file size as much as possible. This will greatly reduce the page read time and improve the performance of the page.
2. Keep clean and simple (ie: concise)
A good web design is not just looking good, but also user-friendly. In general, a clean, simple web design will eventually become a highly available web design because it does not confuse users in their interactions. When there are too many site features and components on the page, it will distract the site's users from the original purpose of browsing the site. Make sure that each page element has its purpose, and then ask yourself the following questions:
Do you really need this design?
What is this component for and how does it help users navigate?
If I delete this component abruptly, will most people want it to "come back"?
How do you combine these elements with goals, messages, and the purpose of the site?
In addition, while it may be a cool new concept or interface design pattern, you want to make sure that the design is still easy and intuitive for your users. People are accustomed to universal interaction patterns, website functions, and network interfaces, and if your design is really unique, make sure it's not too vague and obscure. Be creative, but keep it simple.
3. Navigation (bar/bar) is the most important design
The most important part of a website is the navigation of the whole site. Without it, no matter in which page, the user will be stuck in this page is inseparable from the situation. With this obvious practical direction, we'll discuss some of the important points in building site navigation.
First, it is important to invest enough time and a lot of planning on the site's navigation structure. While this is common sense, there are still a lot of designers who take it for granted to design site navigation. placement, style, technology (JavaScript or CSS), usability, and web legibility are some of the things you need to consider when making your navigation timings.
In the absence of CSS, your navigation design should also be available, which is based on the text base of the browser compatibility. You can try to laugh at text-based browsers, but they are still popular on many mobile devices. Perhaps more importantly, for screen users (99.99% of the case), no CSS navigation functionality is still available to access.
In the absence of client-side technology (such as JavaScript or Flash), the navigation function should be easy to access and use. Users may not be enabled or installed because of security or company policy.
Therefore, it is necessary to develop a navigation system that can be placed in a good position, for example, in a conspicuous and visible place. A good navigation function, as long as the page loading will appear, and do not need to scroll down the mouse. This is why pages are important to keep clean and simple, and a complex and unconventional design can be confusing to users.
Even if only for a moment, the user must not wonder: "Where is the site navigation?"
Finally, the site to establish hierarchical structure, multi-level management. Make sure it is easy to navigate between the parent and child layers. In addition, it should be easy to reach the top-level pages (such as the home page), regardless of the page.
The main goal is to navigate your site, minimize the Action (action), and try to get the user to the content he wants to see.
4. Use fonts wisely and methodically
Although there are thousands of fonts, you can really use only a small fraction (at least until the main browser fully supports CSS3). So stick with Web security fonts. If you don't like web-safe fonts, consider using SIFR or Cufon to incrementally enhance your web design.
Maintain font consistency, confirming that the contents of the title and paragraph look different. Use white space, adjust row heights, font size, and letter spacing properties to make it easy for users to read and scan content.
Perhaps the most common mistake a web designer makes is to use the wrong font size. Because we want to put everything in one page as much as possible, we sometimes set the font size to make the user feel uncomfortable. If possible, try to keep the font size above 12 pixels, especially for paragraph content. Although many do not encounter difficulties in reading because of the small size of the font, think of the elderly, myopia and other similar visual impairment groups.
5. Understanding Color Accessibility
When we finish speaking the font, we need to point out the importance of using the correct color. For example, black text is on a white background, and if you use high contrast, red text on an orange background will make your eyes tense.

In addition, use some user-friendly colors for special forms of color blindness (the Check tool is named Vischeck to test for certain types of color blindness).
Some color combinations are only suitable for use in the foreground color, not for background color. For example, dark blue text with pink background and pink text with a dark blue background, both use the same color, but in different parts of the impact of its readability and the comfort of reading. It is important not only to use a good color combination, but also to apply it to the appropriate elements on the page.
6. Know how to write code
With a variety of WYSIWYG web editors flooding the market, web design has become a simple 1-2-3 step to design good one website. However, most web page editors are doped with unnecessary code, making your HTML structure poorly designed, difficult to maintain, and updated, resulting in web page bloat.
Through the code of your own page, you can get concise code, can be enjoyable and easy to read and maintain. You can be proud to say that you wrote the code yourself. But knowing how to use the WYSIWYG IDE or preview feature does not prevent learning HTML and CSS. You need to know what's going on to create effective and highly optimized web design.
7. Don't forget search engine optimization
When designing a website, a good web designer should always keep in mind the basic SEO concepts. For example, the content structure of a Web page, the caption (that is, the title and logo of the page). At this point, the ability to learn how to encode wisely is useful. Once you know the right, semantic, and standards-based HTML/CSS, you'll quickly realize that div is much better than a tabular layout, not only to show content more accurately, but also to help with search engine rankings. Also, it's a good idea to change backgrounds, text, and pictures with CSS.
8. There is no patience in understanding people
It takes a few seconds for the average person to decide whether to read more Web content or go to another site. Therefore, as a web designer, there is a good way to encourage users to choose the former (see more content) in this precious few seconds.
You know, if the user doesn't see the content of interest on the head of the page, not many people will scroll down to see the entire page content. So, place the important elements on the Web site where the page head is easy to see, but don't get too crowded on the top half of the page, or it will scare the user away from looking down to the content. Keep in mind the selling point of the top half of web design: treat it as a salesman and make people buy ideas about what they want to see on your website.
9. Understand (and realize) browser compatibility
One thing that a web designer must know is that your work environment (the browser) is critical and unpredictable. If your web design can only run on several web browsers, that is not enough, you need to test as many browsers as possible. Here is a tool browsershots that can test browser compatibility.
10. Flexibility and maintainability of the design
A good web designer can make sure that the site can be easily updated or modified in the future. Designing a malleable, easy-to-maintain website is a hallmark of a great web designer. Turn your work from structured to modular as much as possible.
Web Design The industry is dynamic, but also very "young". Things tend to change in the short term. Keeping this in mind will drive the creation of more flexible web design.
So, what are your web design tips?
If you have other skills to share with novice designers, please share them with you in the comments.

10 Tricks for novice web designers to know