網(wǎng)頁常見布局類型及布局技術(shù)的分析

摘 要：隨著“互聯(lián)網(wǎng)+”時(shí)代的到來，網(wǎng)絡(luò)上各式各樣的信息都有，琳瑯滿目、各式各樣，比如各類購物網(wǎng)站、休閑旅游網(wǎng)站，還有科技學(xué)術(shù)網(wǎng)站等。大多數(shù)人在上網(wǎng)的時(shí)候，都會(huì)瀏覽網(wǎng)頁提供給我們的信息，那么，我們就要合理設(shè)計(jì)網(wǎng)頁的布局，利用網(wǎng)站的頁面展示吸引住瀏覽用戶的目光，最后點(diǎn)擊查看他們感興趣的信息。本文以介紹網(wǎng)頁布局的概念為切入點(diǎn)，介紹了常用的幾種網(wǎng)頁布局，并對經(jīng)常采用的網(wǎng)頁布局技術(shù)進(jìn)行了分析和探討。

關(guān)鍵詞：網(wǎng)頁布局；網(wǎng)頁類型；網(wǎng)頁布局結(jié)構(gòu)；DIV+CSS

中圖分類號(hào)：TP393文獻(xiàn)標(biāo)識(shí)碼：A文章編號(hào)：2096-4706（2018）07-0103-03

Abstract：With the advent of the “Internet plus”era，all sorts of information on the internet are dazzling and varied，such as various shopping websites，leisure travel websites，and scientific and technological academic websites，etc. Most people on the internet will browse the information provided to us by the webpage. Then，we must rationally design the layout of the webpage，display it on the website’s page to attract the attention of the browsing user，and finally click to view the information they are interested in. This article introduces the concept of web page layout as an entry point，introduces several commonly used web page layouts，and analyzes and discusses frequently used web page layout technologies.

Keywords：Web page layout；Web page type；Web page layout structure；DIV+CSS

1 網(wǎng)頁布局的概述

一個(gè)網(wǎng)站的布局展示是會(huì)直接影響到網(wǎng)站的整體視覺效果和用戶體驗(yàn)的。如果布局亂七八糟、層次混亂，會(huì)很大程度影響到用戶的再次訪問。制作一個(gè)網(wǎng)頁時(shí)，最初的它就好像一張白紙，需要設(shè)計(jì)者發(fā)揮自己的主觀能動(dòng)性，設(shè)計(jì)你的頁面。網(wǎng)頁布局就是以最適合用戶觀看的方式將各類媒體排放在頁面的不同位置。當(dāng)然，不同的設(shè)計(jì)者會(huì)有不同的設(shè)計(jì)思路，但是無論怎樣，合理的頁面布局是網(wǎng)站建設(shè)過程中最重要的一個(gè)關(guān)鍵點(diǎn)，不僅能夠提高網(wǎng)站的觀賞性，更重要的是可以提高用戶的體驗(yàn)度，進(jìn)而提升網(wǎng)站的訪問次數(shù)。

網(wǎng)頁布局通常包含如下元素：

1.1 頁面尺寸

頁面尺寸是網(wǎng)頁布局非常重要的一個(gè)方面，首先要知道一點(diǎn)：頁面尺寸與顯示器大小和分辨率的關(guān)系密不可分。而且瀏覽器也會(huì)占去不少的空間，這樣留給設(shè)計(jì)者的頁面范圍就會(huì)更小。……