Work on a Web page that works like a piece of art in a small place

The fine is piled up with details.

Deep thought. In the design of the website, the more details are handled, the more perfect the experience will be to the user. This time in the design Chaoshan amorous feelings net of the Gallery column (http://image.csfqw.com), more and more realize the importance of dealing with good details.

In fact, the Web page design involved in the details of the problem, summed up not too much, the following try to enumerate some of the details I have dealt with:

Link state processing. Hyperlinks have four states, including link,visited,hover,active, to design different styles for these four states, which can help users to easily distinguish between links and plain text, visited, and every link state visited. There is a connection style I am not a production appreciation, is to the external link with a small icon, indicating "This is a link outside the station."

Picture scaling. The use of pictures in the Web page occupies a large proportion. Displays the picture on the page, sometimes the picture will exceed the container specification, if does not add the limit, will destroy the entire page the structure and the appearance. At this point the best solution is to control the size of the picture, so that when the picture is uploaded to be compressed into the appropriate specifications. Another alternative is to use JavaScript to scale proportionally, which avoids image distortion, but the load speed may be affected (the picture itself is too large). As for the use of CSS to set a specified length and width, although also can avoid damage to the layout and appearance of the page, but will cause image distortion.

Text length limit. The title of the article is too long and needs to be handled well. The best way to deal with it is by editing, by writing the title of the length of the page that fits the specification. For example, Sina, Web pages and other large web site headlines, most of the use of this way. Their web page can be said to be the word daughter, naturally only through editing, the author's careful consideration, write both to express the full meaning, but also in line with the length of the topic. The second is to intercept by procedure. Program interception for Chinese is better to deal with, a little powerless to English, because the English alphabet is unequal, and the interception of the title, may contain incomplete words. The last way is to hide the text through the CSS beyond the specification section. This is the same effect as using a program interception, but it's not the same way to implement it.

Input test. Input to the user, submit the data form, according to the requirements of each part of the data to design a flexible inspection mechanism, and in the appropriate time to the user prompt, so that users can easily understand what data he needs to enter, what restrictions. This can guarantee the accuracy of data and save time for users.

There's so much to think about. Of course, there are more details waiting for us to understand and deal with. I often with the design of colleagues said that there are some sites, we use it to feel very convenient, handy, but could not say why, in fact, he handled a lot of not for us to understand the details, in the subtle efforts. Such a site has gone beyond the scope of the application, it has become a user experience of fine, is a work of art.