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

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

  圖片在網站中出現的大小和位置,代表著一個網站對頁面信息的疏導,因為它關系著瀏覽者讀取信息的先后順序,網頁設計師可以根據這個特點來編排頁面,使網站傳遞的信息更加高效。在一個網頁界面中,想要突出的信息就是這個版面的重點,把含有重要信息的圖片尺寸放大,這個圖片就會更加吸引瀏覽者的注意,同理,把其他的次要圖片尺寸變小,就會讓整個界面的主次關系清晰明確。

  網頁中的圖片大小不但可以引導瀏覽者們的關注順序,還可以賦予界面不同的節奏感,但如果同一界面內的圖片過多,并且大小不一,會顯得整體效果雜亂無章,為了追求網頁中平衡的審美心理,就需要對圖片的尺寸進行整體協調。例如常見的做法是把圖片進行歸類整理,按照圖片信息的主次程度,大致劃分幾個規格,對圖片比例關系的調整會讓網頁中的主次級別更加清晰明了。

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

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

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

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

  對圖片的裁剪,還有一種形式較為復雜,我們稱為摳圖。摳圖就是我們俗稱的去背景,是指把圖片中具體的形象剪裁下來,其余的背景部分刪除掉。這種裁剪方式比較靈活,能夠將展示物體的形狀表現出來,賦予頁面靈動的美感。只是裁切的時候需要精細、準確,因為裁剪得不徹底,會在物體的邊緣留有雜邊,給人以粗糙的不良印象。

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