做網(wǎng)頁的第一步就是從美工那邊獲取到網(wǎng)頁的模板（*.PSD文件），在網(wǎng)頁頁面的制作之前，我們需要對其進行切片處理。
為什么要切片？可能很多人一開始都會有這樣的疑問，網(wǎng)頁上的圖片最后要呈現(xiàn)給用戶的就是一個完整的樣子，為什么要浪費大量時間和精力，又承擔(dān)著排版布局極容易出錯的風(fēng)險來做這項“無用功”？最主要的問題是效率。大家都知道，頁面的呈現(xiàn)過程是先有客戶端（用戶瀏覽器輸入URL）向服務(wù)器遞交瀏覽申請，然后服務(wù)器獲取URL相對應(yīng)的資源在通過網(wǎng)絡(luò)返還給客戶端。這中間就存在了一個下載資源的過程。而整張圖片或者大塊圖片的下載很顯然可能導(dǎo)致下載過程中頁面出現(xiàn)難看的條痕等影響界面友好度的問題，而小圖片的下載效率在多年來的測試中已經(jīng)被所有網(wǎng)頁設(shè)計者認(rèn)可。除此之外，切片后的頁面能更好的對頁面元素進行定位，你能想象用類似坐標(biāo)定位的方法在一整張圖片上面去定位每一個頁面元素的位置是一個什么樣的工程嗎？
切片時很重要的環(huán)節(jié)。切片的時候是一個意識上對整個頁面進行布局分析的過程，同樣的一張模板，不同的人會有不同的切法，理由很簡單，因為每個人都有自己的布局習(xí)慣，有些人習(xí)慣table布局，有些人則擅長div+css，也有人習(xí)慣介于兩者之間的布局方式（關(guān)于table和div+css的對比，暫且放下不談）。由于兩者對布局設(shè)計思想的要求完全不同，切片時就可能出現(xiàn)很多細(xì)節(jié)上的不同。由此也就能推斷，網(wǎng)頁的切片會影響整個頁面的排布，只有在切片階段仔細(xì)考慮到后期排布的問題，才能使后面的工作有條不紊的展開。
具體切片的方法，我在這里只是說一下我一直以來用的方法。
1.拿到一個模板，先盡可能用最簡單的一個table把它的各個板塊劃開，然后直接用PS生成一個頁面1。
2.用DW打開生成的HTML，把圖片全部轉(zhuǎn)為背景（有技巧可以偷懶的哦，別傻傻的一個一個去換啊）
3.在用PS打開相應(yīng)的一小塊一小塊的gif圖片進行最終的切片并生成一個個html，復(fù)制里面的table放置到頁面1相應(yīng)的td中就能達到最終拼完頁面的效果了。

可能整個過程看來簡單，但具體的操作還是需要多聯(lián)系才能真正體會到拼圖的技巧。希望這篇文章能對大家學(xué)習(xí)切片拼頁面有所幫助。也希望有更有效直接的方法能說出來哦。

名稱欄目：做網(wǎng)站編程的初期準(zhǔn)備工作
地址分享：http://www.2m8n56k.cn/news9/114659.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián)，是專注品牌與效果的網(wǎng)站制作，網(wǎng)絡(luò)營銷seo公司；服務(wù)項目有做網(wǎng)站等

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：[email protected]。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)