圖片是網(wǎng)站設(shè)計(jì)中最重要的元素，圖片的排版是否合理，是否好看，是網(wǎng)站設(shè)計(jì)中很專業(yè)的操作。圖片排版是專業(yè)的范疇，也是一個(gè)技術(shù)活，下面沛宣網(wǎng)絡(luò)為和你一起分享一個(gè)精美的網(wǎng)站，圖片是怎么排版的。
圖片在網(wǎng)頁中是極為重要的設(shè)計(jì)元素,它比文字更能夠吸引瀏覽者的注意力,不但能給網(wǎng)站帶來美感的烘托、氣氛的渲染,也讓觀眾們得到眼見為實(shí)的直觀感受,恰當(dāng)?shù)膱D片運(yùn)用會(huì)給網(wǎng)站帶來有效的受關(guān)注程度。圖片的大小、位置、形態(tài)以及不同的組合方式,都會(huì)直接影響到網(wǎng)頁的視覺效果。

1.圖片的大小及位置的影響

  圖片在網(wǎng)站中出現(xiàn)的大小和位置,代表著一個(gè)網(wǎng)站對(duì)頁面信息的疏導(dǎo),因?yàn)樗�關(guān)系著瀏覽者讀取信息的先后順序,網(wǎng)頁設(shè)計(jì)師可以根據(jù)這個(gè)特點(diǎn)來編排頁面,使網(wǎng)站傳遞的信息更加高效。在一個(gè)網(wǎng)頁界面中,想要突出的信息就是這個(gè)版面的重點(diǎn),把含有重要信息的圖片尺寸放大,這個(gè)圖片就會(huì)更加吸引瀏覽者的注意,同理,把其他的次要圖片尺寸變小,就會(huì)讓整個(gè)界面的主次關(guān)系清晰明確。

  網(wǎng)頁中的圖片大小不但可以引導(dǎo)瀏覽者們的關(guān)注順序,還可以賦予界面不同的節(jié)奏感,但如果同一界面內(nèi)的圖片過多,并且大小不一,會(huì)顯得整體效果雜亂無章,為了追求網(wǎng)頁中平衡的審美心理,就需要對(duì)圖片的尺寸進(jìn)行整體協(xié)調(diào)。例如常見的做法是把圖片進(jìn)行歸類整理,按照?qǐng)D片信息的主次程度,大致劃分幾個(gè)規(guī)格,對(duì)圖片比例關(guān)系的調(diào)整會(huì)讓網(wǎng)頁中的主次級(jí)別更加清晰明了。

2.圖片的組合編排的影響

  在一個(gè)網(wǎng)頁界面中包含多個(gè)圖片信息的時(shí)候,除了對(duì)它們的大小尺寸予以調(diào)整外,還要考慮到它們的位置、方向和對(duì)齊方式等因素,它們的差異同樣會(huì)給瀏覽者帶來不同的心理感受,如果能夠?qū)�頁面上的多張圖片進(jìn)行靈活處理,就能較好地控制網(wǎng)站的風(fēng)格和觀眾的印象。在網(wǎng)頁中適合放置圖片的地方有很多,如頁面的上部、下部、左側(cè)、右側(cè)以及連接對(duì)角線的四個(gè)角的位置,都會(huì)成為瀏覽者們的視覺焦點(diǎn),但其中最佳的焦點(diǎn)位置,還是觀眾視覺流程中較先注意到的左上角和頁面上部,將重要的圖片放在這些位置,會(huì)增強(qiáng)信息的視覺沖擊力。

  另外,在圖片的排列上,如果其中一張圖片與其他圖片相隔較大或者突出顯示,會(huì)讓這張圖片更加顯眼,這也是增強(qiáng)頁面信息層次的有效做法。還有一些網(wǎng)站在風(fēng)格定位上要追求活力動(dòng)感、活潑可愛等調(diào)性,這類網(wǎng)站在圖片的運(yùn)用上也往往選擇具有動(dòng)感的視角,圖片上物像的動(dòng)感會(huì)使整個(gè)網(wǎng)站趨于活躍。此外,我們還可以調(diào)整圖片的傾斜度,使它們的方向產(chǎn)生對(duì)比,或是沿著某種運(yùn)動(dòng)路徑排列,這些動(dòng)感的編排可以打破網(wǎng)頁原有的格局,增強(qiáng)網(wǎng)站的動(dòng)態(tài)化表現(xiàn)。

3.圖片的形狀及摳圖的影響

  對(duì)圖片的裁剪,還有一種形式較為復(fù)雜,我們稱為摳圖。摳圖就是我們俗稱的去背景,是指把圖片中具體的形象剪裁下來,其余的背景部分刪除掉。這種裁剪方式比較靈活,能夠?qū)⒄故疚矬w的形狀表現(xiàn)出來,賦予頁面靈動(dòng)的美感。只是裁切的時(shí)候需要精細(xì)、準(zhǔn)確,因?yàn)椴眉舻貌粡氐?會(huì)在物體的邊緣留有雜邊,給人以粗糙的不良印象。

  如果是為了網(wǎng)站的宣傳而專門拍攝的圖片,應(yīng)盡量在拍攝時(shí)選擇與物體反差較大的單色背景,這樣在后期去背景時(shí)較容易。減少多余的信息量,截取其中的局部,這也是版式設(shè)計(jì)中處理圖的常見方法,裁剪的時(shí)候也并不一定需要保持圖片原來的矩形,它可以根據(jù)需要裁剪成任意形狀,這能將瀏覽者的視線集中在保留下來的部分,令圖片的展示效果更加突出,也更適合版面的需要。網(wǎng)站中圖片的形狀可以裁剪成幾何形、不規(guī)則形或者是自然形等。幾何形的圖片常見的有圓形、三角形、菱形、多邊形等。