用戶體驗之網(wǎng)站界面布局

北京網(wǎng)站建設(shè)公司尚品中國：網(wǎng)站頁面的布局方式、展示形式直接影響用戶使用網(wǎng)站的方便性。合理的頁面布局會使用戶快速發(fā)現(xiàn)網(wǎng)站的核心內(nèi)容和服務(wù)。如果頁面布局不合理，用戶不知道如何開始獲取所需的信息、或者怎么樣去瀏覽頁面才能獲得相應(yīng)的服務(wù)，那么他們就會選擇離開這個網(wǎng)站，甚至以后也很少再來訪問這個網(wǎng)站。頁面布局的基本原則是既要體現(xiàn)網(wǎng)站運營的重點，又要兼顧用戶訪問的網(wǎng)絡(luò)行為習(xí)慣，這樣，就需要從以下幾個方面改善網(wǎng)站頁面布局，提高用戶體驗。
The Beijing website construction company Luxuries: Chinese Web page layout, display forms directly affect the usage convenience. Reasonable page layout will allow users to quickly find a website is the core content and services. If the page layout is reasonable, the user does not know how to get the information needed, or how to browse page to obtain corresponding service, then they will choose to leave the site, and later also rarely come back to visit this website. The layout of the page is the basic principle of it is to reflect the website operators to focus on, but also the user access network behaviors habit, so, need from the following several aspects to improve web page layout, improve the user experience.

一 網(wǎng)站頁面布局和內(nèi)容的相關(guān)性。網(wǎng)站的界面布局和網(wǎng)站內(nèi)容架構(gòu)息息相關(guān)。界面布局首先就應(yīng)該遵循用戶瀏覽習(xí)慣和網(wǎng)站的信息設(shè)計，將內(nèi)容合理有序的呈現(xiàn)在用戶的面前，把重要信息放置在頁面重要的版塊使之重點呈現(xiàn)給用戶。同時網(wǎng)站的界面布局也能從一定程序上反映出網(wǎng)站的運營思路，并且對最終的營銷效果和轉(zhuǎn)化率產(chǎn)生影響。
Web page layout and content correlation. Web interface layout and website content is closely related to architecture. Interface layout first should follow the user browsing habits and website design, content of reasonable and orderly in the user before, the important information is placed in the page important section to key is presented to the user. At the same time the website interface layout can also from certain procedures reflect the website operation train of thought, and the ultimate marketing effectiveness and conversion rate influence.

廣告被放在了網(wǎng)站首頁的重要位置，而把用戶更為關(guān)心的促銷和優(yōu)惠信息沒有能更好體現(xiàn)。網(wǎng)站使用廣告的目的就是為了配合市場營銷活動做宣傳，這樣的布局就顯得是網(wǎng)站建設(shè)的目的，而沒有足夠的去考慮用戶需要。
Ads were placed in the home of an important position, while the user is more concerned about promotions and discounts to better reflect the information. Web site using the purpose of advertising is to match the market marketing activity to do publicity, so the layout appears is the purpose of the construction site, and there is not enough to consider user needs.

網(wǎng)站競爭力認(rèn)為：進(jìn)行網(wǎng)站布局時應(yīng)該考慮 1 從上到下，從左到右，按照內(nèi)容重要性的優(yōu)先級有序放置；2 重要的內(nèi)容一定放在靠前顯眼的位置； 3 建立清晰的視覺層次感； 4 頁面布局要明確同級頁面的布局統(tǒng)一； 5 頁面內(nèi)容上右包含關(guān)系的部分，視覺設(shè)計效果上要進(jìn)行嵌套； 6 頁面內(nèi)容上相關(guān)聯(lián)系的部分，視覺效果上也要體現(xiàn)相關(guān)性，同時也適合SEO網(wǎng)站優(yōu)化。
Website competition ability think : a site layout should be considered in 1 from top to bottom, from left to right, in accordance with the content of the importance of placing priority order; 2 important content must be placed on top position; 3 to establish a clear visual hierarchy; 4 page layout to clear the same level of the layout of the page; 5 pages the content includes part of right relationship, visual design effect to be nested; 6 page content related contact portion, the visual effect but also reflects the relevance, but also for SEO website optimization.

二 網(wǎng)站頁面布局設(shè)計的兼容性。頁面局部的兼容性主要從兩方面考慮：一是要進(jìn)行主流瀏覽器上的兼容，二是要考慮主流顯示器分辨率上的兼容。瀏覽器主要是微軟的IE和火狐firefox[Firefox 火狐3.0測試版下周發(fā)布] ，設(shè)計時應(yīng)該考慮多種瀏覽器上都能正常瀏覽；而屏幕分辨率則主要是1024*768px和1280*1024px等，當(dāng)前大多數(shù)用戶還使用的是1024*768px，因此網(wǎng)站界面設(shè)計也盡量保持在主流分辨率的基礎(chǔ)上，兼顧到適合未來主流分辨率的趨勢，要做好UEO營銷型網(wǎng)站建設(shè)。最后，隨著3G時代的到來，移動商務(wù)也是未來發(fā)展的趨勢，企業(yè)在建立網(wǎng)站時還有必要對手機(jī)瀏覽兼容，建立專供手機(jī)瀏覽的WAP網(wǎng)站。
Web page layout design compatibility. Partial page compatibility mainly from two aspects: one is to mainstream browser compatible, the two is to consider the mainstream display resolution on the compatible. Browser is Microsoft 's IE firefox[Firefox and Firefox Firefox 3 beta release next week ], should be considered when designing a variety of browsers can normal browsing; while the screen resolution is 1024*768px and 1280*1024px, most current users still using 1024*768px, so web interface design is also kept in the mainstream based on the resolution, balance to fit for the future trend of mainstream resolution, to do a good job in UEO marketing website. Finally, with the arrival of the 3G era, mobile commerce is the future trend of development, enterprise website is also necessary to establish compatible mobile phone browsing, for mobile phone browsing WAP sites.

網(wǎng)站競爭力認(rèn)為：兼容性設(shè)計主要是 1 Web標(biāo)準(zhǔn)的熟練運用；2 網(wǎng)站界面應(yīng)對主流瀏覽器兼容；3 網(wǎng)站界面應(yīng)對主流分辨率兼容；4 網(wǎng)站界面對手機(jī)和屏幕閱覽器等特殊設(shè)備的兼容。
Website competition ability thinks: compatibility design is 1 Web standards of proficiency; 2 web interface to mainstream browser compatibility; 3 web interface to mainstream resolution compatible; 4 web interface for mobile phone and the screen reader and other special equipment compatibility.

三 首頁設(shè)計的要點。作為企業(yè)網(wǎng)上信息的第一入口，首頁不僅扮演形象展示的作用，更重要的是起到信息傳遞的作用。目前，國內(nèi)品牌企業(yè)的首頁設(shè)計過于重視“形象展示”職能而忽略“信息傳遞”職能，導(dǎo)致大量企業(yè)網(wǎng)站首頁一律是全屏flash，對用戶快速獲取信息造成阻礙。
Home design points. As the enterprise information the first entrance, home not only plays the image display effect, more important is to play the role of information transmission. At present, the domestic brands of home design attach too much importance to " image " and " information transfer functions ignore " function, resulting in a large number of enterprise website home page is always a full-screen flash users quick access to information, to hinder.

因此，網(wǎng)站的首頁設(shè)計要在傳遞品牌形象的同時，讓首次訪問的用戶在第一時間明白網(wǎng)站的內(nèi)容、服務(wù)和功能，同時，通過首頁，能夠快速直達(dá)所要找尋的目標(biāo)頁面，因此首頁設(shè)計需要具備一些基礎(chǔ)元素：企業(yè)logo標(biāo)示、信息搜索框、全局導(dǎo)航條、產(chǎn)品分類目錄、動態(tài)新聞、推薦信息、網(wǎng)站地圖等基本要素。
Therefore, the site's home page design in the transfer of brand image at the same time, let 's first visit to the user in the first time to understand the content of the website, service and function, at the same time, through the home, can quickly access sought target page, so the page design needs to have some of the basic elements: enterprise logo labeling, information search, global navigation bar, product catalog, dynamic news, information recommendation, site map elements.

網(wǎng)站競爭力認(rèn)為：從整體上來看聯(lián)想網(wǎng)站具備了大部分首頁設(shè)計所需要的必要元素，但在熱點產(chǎn)品、網(wǎng)站地圖等細(xì)節(jié)上還有很多欠缺。同時，網(wǎng)上首頁設(shè)計包括：1 站點的標(biāo)示和使命，讓用戶明白這個網(wǎng)站是做什么的，有什么獨特的地方；2 告訴用戶站點提供的內(nèi)容和服務(wù)有哪些；3 注冊和登陸入口； 4 重點鏈接推薦，但要避免大量信息堆積首頁讓用戶難以獲取重點。
Website competition ability thinks: on the whole the Lenovo site has the most home design the necessary elements, but in a hot product, site map and other details have many shortcomings. At the same time, the online home design includes: 1 site marking and mission, allows users to understand this website is doing what, what unique place; 2 to tell the user site provides content and services which; 3 registration and landing entrance; 4 key links recommended, but to avoid a large number of home users to obtain information accumulation focus on.

四 網(wǎng)站列表頁面的設(shè)計要點。常見的列表頁面包括新聞等文字鏈接類型的列表和產(chǎn)品頁面等圖文混排型的列表。站內(nèi)搜索結(jié)果頁面也屬于列表頁面的一種。列表頁面的特點是：用戶在列表頁面的瀏覽目的已經(jīng)相當(dāng)明確，集中于某一主題下的可選信息豐富，是通向內(nèi)容頁面的最后一道橋梁；用戶在此頁掃描式瀏覽，希望盡快找到鏈接目標(biāo)進(jìn)入內(nèi)容頁面。因此列表頁面應(yīng)盡量減少干擾信息，突出內(nèi)容的鏈接標(biāo)題。
Site list page design. Common list page includes news text type of link list and product page and other graphic mixed type list. Search results page to page a list. List page features : user list page browsing objective is quite clear, focused on a certain subject under the optional information to the page content is rich, the last bridge; users on this page scanning browsing, hoping to find links to content page. So the list page should minimize the interference information, highlighting the content link title.

這個是阿里巴巴英文版的產(chǎn)品列表頁面，由產(chǎn)品縮略圖、產(chǎn)品名稱和產(chǎn)品介紹等信息構(gòu)成，右側(cè)信息欄是對用戶瀏覽頁面歷史記錄和一些相關(guān)的用戶提示及幫助信息，便于用戶瀏覽。
This is Alibaba English edition product list page, thumbnails, product by product name and product introduction, information structure, the information bar is for browsing pages historical records and some related user tips and help information, convenient for users to browse.

網(wǎng)站競爭力認(rèn)為：列表頁面設(shè)計需要注意1 為列表增加一個標(biāo)題和一段摘要信息；2 盡可能多的展示列表數(shù)量，減少頻繁翻頁；3 相鄰兩條列表之間明確區(qū)分間距，每條列表標(biāo)題醒目；4 產(chǎn)品列表最好提供產(chǎn)品的縮略圖；5 右側(cè)信息欄有相關(guān)幫助信息和瀏覽提示。
Website competition ability thinks: list page design need to pay attention to 1 for the list to add a title and a brief information as much as possible; 2 the display list number, less frequent page; 3 adjacent two list clearly distinguish the spacing between, each list Title striking; 4 product list is best to provide product thumbnail; 5 the right information bar help information and browsing tips.

五 網(wǎng)站詳細(xì)內(nèi)容頁面設(shè)計要點。詳細(xì)內(nèi)容頁面應(yīng)屬于網(wǎng)站最深層次的頁面，如單條新聞的詳細(xì)內(nèi)容或是單個產(chǎn)品的詳細(xì)內(nèi)容。一般都有較多的文字。形式上主要分為文字排版和圖文混排。在詳細(xì)內(nèi)容頁面上，用戶獲取信息的目的已經(jīng)相當(dāng)明確，此時不宜在頁面左邊或正前方視線最集中的地方出現(xiàn)干擾性內(nèi)容，而應(yīng)將干擾性內(nèi)容置右側(cè)或頁面底部位置。同時，詳細(xì)內(nèi)容頁面由于是網(wǎng)站的終極頁面，大量用戶在這里關(guān)閉窗口退出網(wǎng)站，因此有必要根據(jù)本頁內(nèi)容主題提供與本文相關(guān)的其他內(nèi)容鏈接，如“相關(guān)文章”列表，盡量挽留用戶。
Site content page design. The details page should belong to the site of the most deep-seated page, such as a sheet of news details or a single product details. Generally have more words. The form is mainly divided into text layout and mixed map and text. In the detailed content on the page, the user access to information of the objective is quite clear, this time not in on the left side of the page or the front sight most centralized place appear to interfere with sexual content, and should take the interference a right or the bottom of the page location. At the same time, the details page as is the site of the final page, a large number of users here to close the window exit site, so it is necessary according to the page content themes related to this article links to other content, such as " the list ", try to retain customers.

網(wǎng)站競爭力認(rèn)為：詳細(xì)內(nèi)容頁面設(shè)計需要注意1 文章底部或右側(cè)置放更多相關(guān)內(nèi)容鏈接及其它推薦鏈接、廣告；2 對于較長的文字，應(yīng)該提供摘要和設(shè)計錨點目錄；3 產(chǎn)品的詳細(xì)頁面中對于較復(fù)雜的參數(shù)宜采用表格或列表的形式更易查看；4 有用戶評論留言功能； 5 增加用戶選擇推薦和投票排行。
Website competition ability thinks : details page design need to pay attention to 1 the bottom or right placing more relevant content links and other recommended links, advertising; 2 for the longer text, should provide the abstract and design of anchor directory; 3 product detail page for more complex parameters should adopt the table or list form more easily view; 4 user comments function; 5 increase the user choice recommended and voting list.

本文發(fā)布于北京網(wǎng)站建設(shè)公司尚品中國http://proteomeinstitute.com/