Website Design and Production Specification
Source: Shangpin China |
Type: website encyclopedia |
Date: July 13, 2012
We always insist that the website is a tool for visitors. Everything on the website must be carried out around the visitors, and everything is user centered. A good website is only if the visitors feel good, use it well, and experience it well. For an operational industry portal, we will plan and design user experience in four aspects: 1、 Browsing experience: the experience of website columns and content, including page navigation, page speed, page capacity, page structure, content arrangement, content update, content form, content presentation mode and path recording;
2、 Visual experience: the visual experience of the website to users, including: overall style, website logo, page layout, page color, page size, animation effect, picture display, icon use, advertising settings and sound settings;
3、 Interactive experience: that is, the user's operational experience of various functions of the website, including: member application, member registration, form filling, click prompt, error prompt, online question and answer, online search, page effect, new window and path design;
4、 Trust experience: how to improve users' trust experience through details, including 12 details: friendship links, bottom information, about us, contact information, help center, website filing, content format, content subscription, website map, adding favorites, user login and forum popularity;
Now, let's specify our understanding and production standards for these four types of experiences when building websites.
1、 About "trust experience" Trust experience focuses on details and stability.
1. Bottom information: the bottom information content of the website is the common content of every page of the website. The bottom information provides a lot of content for the visitors to build trust experience, such as the establishment time of the website, whether it is filed, whether it is a business website, whether there is a warning sign, privacy statement, and the ownership relationship of the website (such as the website under xx). This part is detailed content, It is easy to ignore, but they are the most standardized and universal content, which needs careful design.
2. Friendly links: users' trust in websites is not only based on Website Design On the basis of functional experience, and also on the evaluation of similar or other related websites. The value of friendship links is not only in search optimization, but also an important reflection of the website user positioning. If the website links to unknown small websites, users will not rate it too high. When making friendship links on the home page, the number should not be too large. We should pay special attention to the weight of these links. Even if we make some one-way links (well-known industry websites, industry association websites, relevant government websites), we should also show our strength.
3. Contact information: comprehensive and detailed contact information and contacts, which is easy to establish a sense of steadfastness and trust for visitors, making people feel relieved and able to find people with problems. If the ultimate goal of the website is to call customers for consultation, then the contact information needs to be more obvious and easier to remember.
4. About us: This is the most direct way for users to understand the background of the website. It is also a way for website operators to show their attitude and style. The website operator must create a self introduction content, and make characteristic planning and design for the page content.
5. Website Filing: Filing is the most basic and necessary procedure. With this, we can prove that our website is legal. There are many websites for filing, and different websites need different filing. Operators need to check and apply one by one. The more perfect the filing, the more accident can be prevented;
6. Help Center: The technology of the website is changing with each passing day, and visitors have different understanding of the website, so it is necessary to set up a detailed help center or FAQ column. Don't take it for granted that visitors will see new things as soon as they see them, and there will always be problems with new things. In addition, the function and content richness of the help center is also a reflection of the website customer service awareness, which deserves attention.
7. Content subscription: whether using Feedsky, Rss, or traditional mail news lists, setting up content subscription is not only to improve users' stickiness and promote users to visit again, but also an important sign of large websites and regular websites. Only those websites with strength and care will provide regular information services; In addition, certain registered users can also be activated through the subscription function.
8. Content format: the degree of content standardization is also an important aspect of website trust building experience, which is mainly reflected in the standardized presentation of information content. On the one hand, whether each information includes the source, author, editor, publishing time, as well as the number of clicks and comments. Comprehensive auxiliary information can improve the credibility and authority of the information, and then enhance the credibility of the website. There are fewer and fewer websites that will list these points completely, for many reasons, but it is recommended to pay attention to and improve them; For the number of hits, set some values to create an atmosphere; Popular information, you can use some vests to comment. On the other hand, personalization details, such as setting the page color, setting the font size, clicking to send directly to the mailbox, copying the page address, etc., are also important aspects that affect the user experience.
9. Forum popularity: If there is a forum on the website, it is necessary to create a very popular atmosphere, hang more online users and set more hot content, otherwise, it is easy for visitors to directly deny the whole website. Therefore, either do not do it, do it, we must bring the popularity up, even if we use the "vest" to irrigate every day.
10. Website map: for web2.0 websites, no matter the size of the website, we must make a website map. On the one hand, it is easy for search engines to capture website information, and visitors will quickly learn about the whole site architecture when using it. It is also very important, but it is also details.
11. Add to collection: "Add to collection" and "Set as home page" are the necessary functions in traditional website design, but now, "Set as home page" is basically meaningless, and adding to collection is quite important, generally in the top right of the website. It is better to put the location of adding to collection at the front and mark it with striking colors.
2、 About "Interactive Experience" Interactive experience focuses on path design and ease of use.
1. Member registration: It is better to design a multi-level registration method for web2.0 websites. Only fill in the registration name, email, password, etc., can complete the first level registration, so that users can further attract additional content later. The first level priority must be clear and simple, so as to save time for users. More importantly, how to attract users to add comprehensive information? It is necessary to let visitors know the value of their supplementary information. In addition, pay attention to the integrity of the information prompted to the user.
2. Membership application: membership application must run through every page of the website. Turning random users into registered users is an important part of improving website traffic and user stickiness. The buttons or positions for membership application should be designed to be eye-catching. In addition, the core of the membership function is permission control. The website must have some content that can only be browsed by registered users or advanced users, but also ensure that the information presented to non registered users is also attractive. Otherwise, how can visitors have the motivation to register? Before construction, we should consider clearly: why should users register? What attracts users to register? What is used to stabilize the regular visit of registered users?
3. Click prompt: the information that has been browsed needs to be displayed in different colors to distinguish it from unread content and avoid repeated reading. For pictures, it is better to set picture annotation. When the mouse scrolls to the picture, the picture title can be displayed.
4. Form filling: There are many ways to fill in forms, and there can be many options. However, the required options should be clearly marked and displayed in stages (or pages) to avoid making users feel that filling in is a very troublesome thing. After the submission is successful, the thank you prompt page must be carefully designed. In particular, it should explain what the registered user should do next and what can he do? The thank-you page should be personalized in content and form.
5. Online Q&A: At present, there are many forms of online Q&A, which can be selected according to needs. It is generally recommended to cooperate with the "Frequently Asked Questions" and "F&Q" of the customer service center, because in many cases, we can not answer questions online 24 hours a day. Instead, we can guide customers to find answers first, and if they cannot find answers, they can contact or leave messages (if not online). In addition to answering questions, online Q&A can also play an important role: collecting all kinds of information. This requires setting up online Q&A processes and scripts, and adding some questions to collect information, such as website evaluation, satisfaction inquiry, improvement suggestions, etc. For new questions raised by users, summary and analysis shall be carried out, and they shall be added to "Frequently Asked Questions" or "F&Q".
6. Error prompt: a "error prompt page" must be created to give proper guidance to the error page. Because visitors will definitely be very upset about the wrong page on the website, and even close the website directly. When designing this page, we should take full account of the user's visiting psychology at that time, have sincere explanations, appropriate pictures, and most importantly, provide solutions, and finally, redirect the visitors to the website.
7. Page effect: The feature of web2.0 in the technology layer is that many of the latest technologies can be easily and quickly integrated and quickly applied to the website, especially in the page layer, such as ajex, lightbox js, etc. We combine the advantages of "technology R&D center", always pay attention to the application of these technologies, and constantly develop some new ones, Appropriate functions, applied to the website, always lead the trend and follow the trend;
8. Online search: First, the location of the search bar is set. The most common location is at the top right, and information websites are generally at the top center; The second is the setting of search operation, providing precise search and fuzzy search; Exact search means that you first select the classification of information, such as information column, author or information title (in the form of drop-down menu), and then enter keywords; Fuzzy search is to directly input keywords to search; The default is full-text search; Finally, we should consider the presentation of search results; There are many details about the presentation method, including the number of search results, the standard and method of information arrangement (title, title plus brief content), keyword color, etc.
9. Path design: When it comes to experience, the most direct thing is the effective clicks generated by users on the website. Each click also means the beginning of a new experience. Among many clicks, path design and recording also reflect the spirit of web2.0 personalized service. Each netizen has different access habits and browsing habits. First, design the most direct and effective browsing path; The second is to record the browsing path of netizens so that they can return at any time; Third, try to find a match with the browsing path of netizens.
10. New window: Now more and more people are using multi thread browsers such as maxthon, firefox, TT, etc. Therefore, when entering the final page to browse, more new windows are used to open, which is convenient for users to browse information and saves return time and search time again.
3、 About "Visual Experience" Visual experience focuses on UI design and comfort. 1. Website LOGO: The design level of LOGO directly reflects the aesthetic level of website builders. LOGO is the leading factor of the overall style of the website, and also the image mark of the website's external communication. For a clear LOGO, the designer will carefully consider, and integrate the characteristics of the LOGO into the style of the website; If there is no logo and it needs to be redesigned, the designer will design according to the website's positioning and goals, combined with the characteristics of the industry, etc; Generally, simple and decent LOGO is recognized by visitors.
2. Overall style: style refers to the first impression of the website on the viewer, which is mainly reflected in two aspects. One is the balance of website quality. After the viewer sees the website for the first time, he or she will first make a psychological judgment on the website according to the visual feeling, and the other is the attribution of the website type, such as industry information, brand promotion, online trade, etc. Therefore, before designing the website, our planning will first clarify the target customer group, analyze the aesthetic expectations and preferences of the target customers, and determine the type of website, and then the designer will design the website purposefully;
3. Page color: six specifications: website must have a theme color; Coordinate the cool and warm colors of the page, not a single color; Strictly grasp the number of main colors and auxiliary colors used, not fancy; Keep the overall image of the website unified; Use gradient colors to create a sense of color hierarchy (from top to bottom, from left to right...); Adjust the brightness and brightness of colors;
4. Page layout: first of all, the layout should highlight the key points, with clear priorities, rich pictures and texts, and comprehensive sound and painting. The effective space of the website is limited. The first screen of the website is the focus of our design and planning. In the page layout, we should also consider the combination with the website marketing purpose, and place the content that can attract users most in the most important position through appropriate forms of expression.
5. Animation effect: the first thing to consider is the placement position of the animation, then the presentation method, then the loading speed, and finally, the most critical is the content representation. Animation effect is to attract users' attention at the first time, but attention is not the ultimate goal, but to let users accept the content conveyed by the animation. Therefore, when designing the form and content of animation, we pay attention to the coordination of content and animation rhythm, and create animation effects with content as the center.
6. Page size: It is mainly set according to the core user group, which is one of the reasons why the user survey should be conducted. Different users have different usage habits. For example, according to the survey, 800 * 600 users are still the majority of users over 30 years old. If the main user group of the website is such people, it must be adjusted. In general, the size is 1024 * 768, and it is set as an automatically adapted page. If it cannot be corrected, the main content of the page is set to the left, which is more convenient for users who use 800 * 600.
7. Use of icons: the design of icons must be consistent with the overall style of the page, followed by simplicity, clarity, understandability and accuracy. Finally, try to add some dynamic and 3D effects to make icons more dynamic.
8. Picture display: first of all, we should consider the location of the image, and consider whether it is consistent with the overall website proportion and the browsing habits of ordinary users; Secondly, choose the display form of pictures. Now there are many display forms of pictures, such as flash and Lightbox effects; Finally, consider the size of the images used, the proportion of thumbnails, whether they conform to the style of the website, whether they are clear, etc.
9. Sound setting: the sound of the website is generally divided into two types: one is background music, which is an automatically played sound and keeps circulating; The second is to click music, which requires the mouse to move or click to a specific place (most of which are used for navigation) before sound appears; For background music, it is generally not recommended to set it unless it is a theme website for image promotion or some activity promotion can be set, and it should be set with unique music instead of popular music. When the website has set background music, the switch button and volume control should also be placed in the prominent position, so that the visitors will not shut down the page immediately because they are bored and cannot find the control button. Clicking music gives people the feeling of being flexible, lively and fashionable. We should also choose whether to use it, what sound to use and where to use it appropriately according to the actual situation;
10. Advertising setting: first of all, we should consider the selection of advertising space and the presentation of content. At the very least, you should not let advertisements affect your browsing, or let users dislike advertisements. Some advertising positions and forms of expression are generally recognized by visitors, such as banners at the top of the page, couplets on both sides of the page, and text ads at the bottom right of the page.
4、 About the "browsing experience" The browsing experience focuses on reasonable planning and attraction.
1. Page speed: The massive application of video, animation and pictures also has a huge impact on the browsing speed of websites. And the speed of browsing the web page has determined the satisfaction of the visitors to the website and the chances of browsing again. Therefore, in addition to choosing a stable server hosting provider, we also need to consider future development, such as how to deal with peak times and how to communicate between the north and the south after increasing the number of visitors;
2. Page navigation: Like the foundation of a building, website navigation is the foundation and framework of the whole website. All content and services are extended from the navigation. There are two levels of page navigation, one is the form level: navigation location, presentation (text, pictures, flash, etc.), and the other is the content level: content classification and generalization. Therefore, when planning and designing navigation, we emphasize dynamic, concise and clear forms of expression; And will combine the characteristics of the customer industry to classify various information in a standardized and orderly manner; The column name should be as short and clear as possible, and the column level should be as few as possible, with content as the center;
3. Page Structure: Page structure refers to the frame for placing page content. Now there are more and more websites, and the page structure of the website has basically formed a pattern that some visitors are accustomed to and familiar with. They are mainly "Tong" type, "Si" type, "San" type, "F" type, etc. We will follow these basic patterns in our design, and we will make creative innovations on these bases, but we promise not to break users' browsing expectations.
4. Page capacity: mainly refers to the page capacity of the home page. For general corporate websites, it is not recommended to have more than two screens of home page content, so that users can browse to the entire page without scrolling. The design of the page should consider: 1, the collocation of the page text and pictures; 2. Collocation of different font sizes, fonts and colors; 3. The combination of website content and blank space can avoid the visual resistance caused by the page (psychologists have done experiments, and the maximum number of valid characters consumed by the human eye per second is 20. If the page is full of detailed text, the effect can be imagined);
5. Content update: mainly consider from the aspects of content source, update frequency, update quantity and content quality. We put more emphasis on how to mobilize the enthusiasm of users, let them participate in the update of information, and share their own information; Content update is not only the consideration of website editors, but also the measurement of website user value; The frequency and quantity shall be planned according to the actual situation; For the quality of content, it is mainly from the original, reprint, the value of the content itself and other aspects of the balance;
6. Content arrangement: first, highlight the key content, and use big titles and pictures to create visual impact; The second is to coordinate the content. Each column should ensure enough information to avoid no content in the column; Then comes the content form, taking into account the proportion of video, pictures, text and page coordination.
7. Path record: record the user's browsing path, access record, etc. to facilitate the user to return and search at any time; For some key columns and pages, quick links can be set or navigation at the bottom of the page can be set to provide users with a clear quick entrance.
8. Content form: stereoscopic information, display videos, pictures, text and comments on one page, and update comments instantly; For the text part, the font size can be set as required (generally three choices are large, medium and small), the information content can be marked with "keywords", and the "keywords" can be linked; The information page generally does not exceed two screens, and the longer information is browsed by multiple pages;
9. Content presentation mode: consider more convenient and complete details, including the marking of new articles, article guide, recommendation of relevant content, netizen recommendation, printing page, E-MAIL sending to friends, copying website, etc.
This article was published by Beijing Website Construction Company Shangpin China //ihucc.com/
Source Statement: This article is original or edited by Shangpin China's editors. If it needs to be reproduced, please indicate that it is from Shangpin China. The above contents (including pictures and words) are from the Internet. If there is any infringement, please contact us in time (010-60259772).
