『壹』 在ps里網頁切片應該怎麼切
首先網頁切片要點(一)根據顏色范圍來切:如果一個區域中顏色對比的范圍不是很大的,就只有幾種顏色,這樣的話就應該單獨的把他切出來,如果一個區域中就一種顏色,寫代碼的時候就可以直接用背景色來表示。顏色過多的話也沒有關系,很多時候都要用到漸變的效果,應該把切片數量切的多一些盡量把單個切片控制在一個顏色范圍的輪廓內。
其次網頁切片要點(二)切片大小:把網頁的切片切的越小越好,這是有道理的。切片越小的話可以加快網頁下載圖片的速度,讓多個圖片同時下載而不是只下載一個大圖片,所以切片大小要根據需要來切,標志LOGO等主要部分盡量切在一個切片內,防止顯示遇到特殊情況時顯示一部分,圓角表格部分要根據顯示區域的大小來切,控制好邊緣和邊,有時候切出來的切片並不是直接插入到DW了事,而需要在DW中編輯,比如有的圖片應該設置成背景圖片
網頁切片要點(三)切片區域無整性:保證完整的一部分在一個切片內,例如某區域的標題文字,以後修改時方便
『貳』 網頁製作中的切片步驟
1、盡量切小一點
2、可能用來做背景的部分切整齊一些,以備改小做背景。
3、切完保存為網頁後,最好重新新建文件再排版
『叄』 在ps里網頁切片應該怎麼切
首先網頁切片要點(一)根據顏色范圍來切:如果一個區域中顏色對比的范圍不是很大的,就只有幾種顏色,這樣的話就應該單獨的把他切出來,如果一個區域中就一種顏色,寫代碼的時候就可以直接用背景色來表示。顏色過多的話也沒有關系,很多時候都要用到漸變的效果,應該把切片數量切的多一些盡量把單個切片控制在一個顏色范圍的輪廓內。 其次網頁切片要點(二)切片大小:把網頁的切片切的越小越好,這是有道理的。切片越小的話可以加快網頁下載圖片的速度,讓多個圖片同時下載而不是只下載一個大圖片,所以切片大小要根據需要來切,標志LOGO等主要部分盡量切在一個切片內,防止顯示遇到特殊情況時顯示一部分,圓角表格部分要根據顯示區域的大小來切,控制好邊緣和邊,有時候切出來的切片並不是直接插入到DW了事,而需要在DW中編輯,比如有的圖片應該設置成背景圖片 網頁切片要點(三)切片區域無整性:保證完整的一部分在一個切片內,例如某區域的標題文字,以後修改時方便
『肆』 我的網頁主背景被我用ps切片了。一共切成3塊。我應該怎麼把背景組合在一起去 代碼怎麼寫啊
你在PS中保存後,會自動生成一個代碼網址,你打開後就復制代碼,在網頁自定義中粘貼,把圖片上傳空間,一張一張的添加就OK了。
『伍』 在fireworks裡面做好網頁界面圖以後,怎麼進行切片,有的作為背景圖怎麼切啊,而且背景圖上面還有文字
切圖原則:
一、完整性原則,保持元件獨立性
二、節約性原則,盡力讓文件最小
三、可修改原則,讓後期創作容易
四、不交叉原則,切片之間不重疊
五、背景化原則,刪除單色與背景
六、表格性原則,表格的拆分模塊
七、交互性原則,熱區與圖片變換
八、冗餘性原則,同樣的圖片處理
九、佔位符原則,刪除要用佔位替
『陸』 網頁中的大背景圖片如何分成小圖片啊!!!
應該是GIF格式的圖片,
調到PHOTOSHOP里用切片工具就可以分片.
切片工具在工具欄里.
『柒』 網頁設計中圖像切圖技巧
網頁設計中圖像切圖技巧
在網頁的製作過程中,不時需要將圖像進行切圖處理。下面是我為大家整理的網頁設計中圖像切圖技巧,歡迎參考~
網頁製作技術伴隨著網路的快速發展而快速興起,目前,國內外計算機行業對於網頁製作的研究較多,但是由於受到初學者個人風格和操作技巧的影響,在網頁製作中普遍存在不同程度的問題。而對圖像進行切圖處理也是一個存在網頁製作中的問題。基於此,本文就網頁設計中圖像切圖技巧進行了探討,並提出了一些有關的技巧,相信對圖像切圖的工作能有一定的幫助作用。
1 切圖技術
切圖就是指在網頁製作過程中,用圖形圖像處理軟體提供的切片工具,將美工設計的網頁效果圖這種大幅圖像,分割成為一系列小的圖像,這些小圖像稱為原大幅圖像的切片。一張圖可以有多種切圖方案,但不是所有的切圖方案都適合後期的網頁製作的。因此需要在眾多切圖方案中,找出一種適合後期網頁編程的最佳切圖方案。本文中所說的切圖技術,就是指的實現最佳切圖方案的切圖技術。由於它遵循一些切圖原則和技巧,所以它能夠實現最佳切圖方案。
由於切圖時,圖像的最小單位是像素,矩形對邊上的像素個數應該是相同,或者遇到圓角應該是銳化的。但是在人工操作時,可能會發生像素個數的變化,或者圓角產生頓挫角。因此,在切圖時,將原圖採用300%以上的放大倍數切圖。切完整個大圖後,把一系列的切片全部選中,接著利用軟體中的圖像優化工具,即菜單欄中「窗口」下拉菜單「優化」命令對所有的小切片進行優化來解決以上問題。然後利用文件菜單下的「導出」命令生成HTML網頁和圖像,最後在網頁製作軟體DREAMWEAVER中建立站點,將上面導出的網頁和小圖像都放在網站里。導出的網頁文件是不能用的。因為一個網站的頁面大小要求統一。因此,接下來的工作是在網頁製作軟體中製作表格。用分塊的思想來看整個網頁的布局,一個塊就是一個表格。把網頁看成是多個獨立的表格組成的。將導出的圖片插入到單元格中。日常工作中常用的圖形圖像處理軟體有Photoshop、Flash、Firework等,這些軟體中都有切片工具,但是在網頁製作時,圖形圖像處理軟體首選使用Firework。因為DREAMWEAVER中只要對圖像雙擊,系統會自動調用Firework軟體。
2 切圖原則
一張圖可以有多種相關的切圖方案,但不是所有的切圖方案都是合適網頁編程的。所以在切圖技術中,應該保證實現的是最佳切圖方案,因此切圖技術中還涉及了切圖的原則和切圖的技巧。
2.1 塊與切片的概念
在本文中所說的一個塊與切片概念是不同的。塊和切片都是網頁中的一部分,但是塊指的范圍比切片大。塊中可以包含一個或多個切片。塊是指在網頁上內容相關的'區域范圍。切片是從圖中相關范圍中分割出來的一小圖形。如果轉換成網頁後,塊對應了網頁中的表格,而切片對應的是表格中的單元格。
2.2 分塊的原則一:以相關內容為一塊
根據原圖中相關內容,確定整體的切分策略,即切分要有分塊的思想,把整個網頁看成是多個塊構成的,每個塊就是一個table,塊中每一個細節內容就是table中單元格中內容。即將整個網頁看成是由多個table組成的,然後在具體到每個table,去考慮裡面應該如何切。必須強調的是,應該把整個網頁看成是多個獨立的塊構成,切片是塊中的內容。依據這種思想去切圖,然後在網頁製作軟體中,插入多個表格。塊對應成了網頁中的表格,切片對應成表格中的單元格內容。在切圖時,同一塊中的內容是完整的,也就是說,要保證完整的一部分在一個塊內,例如某區域的標題文字,網頁的LOGO,網頁的廣告,網頁的導航區等可以分別是一個獨立的塊,這樣做的目的是方便日後網頁編程和修改。
2.3 分塊的原則二:盡量分成大行,平行的切
當一個網頁的內容比較多時,在顯示網頁時是有時間差的,這時要求內容的顯示是從上而下從左到右逐行顯示網頁的內容,決不允許一個網頁上的內容雜亂的跳出來。因此,在分塊時也應該貫穿逐行分塊的原則。切圖的時候要盡量平行的切,也就是說,分成大行,然後再逐行的切。如果一個網頁的顯示頁面是由多個表格構成的,這樣做的目的是當客戶端瀏覽一個網頁時,由於它是由多個表格構成的,因此,客戶端與網頁伺服器會生成多個request請求,多個表格同時下載信息,因此網頁下載的速度就會相對快。避免出現把網頁整個頁面看成一個塊,然後塊里又分塊,出現塊中嵌套塊。因為這種結構在由切片轉換成網頁後就出現了表格的嵌套,表格的嵌套影響了客戶端網頁瀏覽的速度。
2.4 切片的原則:以屬性相同為依據
一般切圖原則是:屬性相同的區域適合分為一個切片。屬性相同主要是指顏色和形狀都沒有變化,或者在X或在Y方向上沒有變化。屬性漸變的區域適合分為一個切片,漸變有兩種表現形式顏色漸變,形狀漸變。
3 切圖的技巧
切圖也有技巧。構成一張圖片的信息量是非常大的,因此在伺服器中存儲一張圖片時占的容量也是很大的,同時從伺服器里下載圖片到客戶端也需要時間也就相當長。因此,在利用切片轉換成網頁時,可以利用一些技巧,即減少切片個數和減小切片的大小,可以解決以上存在的問題。
3.1 減少切片的個數
網頁上的文字與圖片信息都是存儲在網頁伺服器上的,一個切片就是一張小的圖片。根據顯示的點陣原理可以知道,對於同一張大圖像來說,切片數減少,存儲在網頁伺服器上這張圖的信息量也就減少了,也就是說在網頁伺服器上占的空間減少。所以當切片的背景是單一顏色,切片的文字沒有效果,這時就可以採取這種特殊的處理方式對此切片進行處理。即可以將單一顏色和文字沒有效果的切片丟掉,在DREAMWEAVER中打開站點,插入表格,在對應的單元格中,利用DREAMWEAVER軟體提供的設置單元格的背景色,直接從鍵盤上輸入文字內容。這種做法實現了切片的效果,同時可以使網頁服務上存儲的切片數減少了。以「京東商城特賣新」網頁頁面為例,在實驗中保證網頁頁面效果相同的情況下,採用減少切片個數和未採用減少切片個數方法,可以得到下面表中的數據。從下面表中的數據可以看出兩種處理辦法造成的結果是:未採用減少切片個數方法時,圖片總容量為102MB,而採用減少切片個數方法後,圖片總容量為40.3MB,明顯前後圖片的總容量變化很大,值得提倡這種做法。
3.2 減小切片大小
大面積的顏色相同的,或者形狀相同圖塊,可以只從原圖中切出一個像素的切片,然後DREAMWEAVER裡面,用切片平鋪形成所需要的圖。
;『捌』 ps如何進行網頁切片要求
給你個最簡單的方法。
打開你的PSD圖-切片(手動切仔細點)-文件-存儲為WEB所用格式
-Ctrl+A(這是為了使所有切片的圖片都清晰)-選好切片圖片格式
-存儲-「保存類型為HTML何圖像」。PS的操作到這里就完了。
上傳這些切好的圖片到網路中,然後打開DW軟體,打開在PS里保存的HTML文件,最後是逐一替換換掉圖片地址就OK了!
對照著操作100%可行!