13996527831
詳細

如何做好網頁切圖?

發表日期:2015-04-12 19:18:26   作者來源:米卓網絡   瀏覽:    

  什么是網頁切片?網頁切片可以使用切片將源圖像分成許多的功能區域。將圖像存為Web頁時,每個切片作為一個獨立的文件存儲,文件中包含切片自己的設置、顏色調板、鏈接、翻轉效果及動畫效果。可以使用切片加快下載速度。

  網頁切片是網頁設計人員必備技能之一,但是并不是人人都能做好網頁切片。把一個psd文檔要切成網頁需要繁瑣的工序,新手很難掌握這些技巧。重慶網站建設公司分享一些切片的基本要求:

  1、顏色范圍

  如果一個區域中顏色范圍小,只有幾種顏色,那么應該單獨切出;如果只有一種顏色,切片后選擇HTML類型,在DW中改背景顏色就可以了。如果顏色數量比較多,漸變過渡多一些,應該把切片數量切的多一些;色塊用HTML代替漸變,用png來生成。顏色單一過渡,可以用用GIF或PNG生成。不可把圖切的太細,也就是不要生成太多小圖。

  2、切片大小

  切片的目的主要是加快下載進度,所以切片大小要根據需要來切,標志LOGO等主要部分盡量切在一個切片內,防止顯示遇到特殊情況時顯示一部分,圓角表格部分要根據顯示區域的大小來切,控制好邊緣和邊角,并且需要在DW中編輯。

  3、切片區域

  保證完整的一部分在一個切片內,例如某區域的標題文字,以后修改時方便。

  4、導出類型

  顏色單一過渡少的,應該導出為GIF,顏色過渡比較多,顏色豐富的應該導出為JPG,有動畫的部分應該導出為GIF動畫。

  5、源文件存檔

  即使頁面作好了,也要保留帶切片層的源文件,在需要修改的時候,直接修改單獨導出所用的切片。

  切片要注意的常見問題:

  1、切片是生成表格的依據,切片的過程要先總體后局部,即先把網頁整體切分成幾個大部分,再細切其中的小部分。

  2、對于漸變的效果或圓角等圖片特殊效果,需要在頁面中表現出來的,要單獨切出來

  3、在DW中進行編輯時,少用圖片,如果能用背景顏色代替的就使用背景顏色 能使用圖案的也盡可能使用圖案平鋪來形成背景

  4、在DW中進行編輯時,刪除圖片時出面表格錯位如何辦?

  刪除圖片的時候記住圖片的長寬,再插入一個相同長寬的表格。

  5、在DW中如何自定義表格的長寬?

  使用表格長寬一樣的圖片做為單元格的背景。

  6、如何在圖片上輸入文字?

  把圖片設置成背景。

  學會切片沒有什么太多技巧。需要我們在不斷的實驗的過程中去總結,找到自己得心應手的方法,包括從用戶體驗和技術層面。這樣做出來的網頁才能達到用戶使用最佳的瀏覽體驗,具美觀和舒適度,讓用戶喜歡、樂意使用。

极速排列3