1、如何用photoshop製作網站頁面
1.先做圖,這個需要很好的PS功底才行
2.切圖,要知道網頁結構才能切圖
3.生成網頁,PS本身能另存為網頁
4.優化網頁,需要使用DW軟體來優化修改去掉多餘的空白區域,背景優化。
5.製作成模板,如果要應用到相應的cms中需要加入CSS代碼和標簽代碼調用。
6.上線測試瀏覽器兼容性看是否錯位,經過不停的修改後達到滿意效果。
做網頁不容易,做網站更不容易,做個好網站是難上加難,如果是愛好學習一下也罷,如果想用在商業上最好專業人員來做,你只付錢就行了。
2、如何製作網頁模板
首先你要明白網頁製作的流程:
1、網頁設計師(主要是用PS)先將網頁設計出來。
2、進行網頁製作,就是切片,div+css布局,將圖片變成網頁。
3、後台製作。可以自己開發,也可以套用cms,如dedecms,phpcms。等
4、具體步驟就是這樣。詳細的牽扯到一些技術,就是html,div+css,js,(jquery,js框架)。
後台目前流行PHP語言。這些都是基礎
5、需要學習的有,html,div+css , js (jquery) , php等。
教程網站,百度「W3C」,即可
如果你只是製作模板,那麼就學習html,div+css , js (jquery)即可
3、PSD網頁模板怎麼用?
用photoshop打開後,編輯修改部分圖片或文字,符合自己需要後,點菜單上的-文件-存儲為web所用格式,輸出就是html網頁。
你要保存為GIF或JPEG在粘到現有網頁中去也隨你,那要就要用網頁編輯軟體了,比如常見的Dreamweaver、FrontPage 。
推薦幾個現國內比較知名的素材網站吧
大圖網 一個非常優秀的免費素材網站,優點是素材的質量比較好,而且素材更新速度也比較快。
愛圖網 一個很老的素材網站 素材也比較多 素材比較全,素材比較多,大部分是免費的,圖片素材很多都是打包的素材。
思緣論壇 非常多的影樓素材,PS素材,和設計素材,國內素材論壇發展最好的一個,還可以學習PS教程和設計技巧
4、怎樣用psd模板做網頁啊
首先先建立一個PSD文檔 色彩模式RGB 72像素 尺寸根據你網站的大小制定
然後就在PS里設計你的網站 就當一個平面圖設計
需要放數據文字的模塊先放一個框子空著他
這樣貼好圖後 就直接切 你在PS里切的一塊塊的 到dreamweaver 里就是一個方框的 自動分開的
基本上平面部分在PS里就能做這么多了
然後拖到dreamweaver 做鏈接 做效果 等等
簡單直白的說就是用PS的方便快捷的操作給你的網站打框架 做美工
5、在PS中切網頁模板,如何能使用網頁當前樣式
切片主要切的是需要的圖片,有的只需要切一個像素然後平鋪就可以了。文字部分肯定是用html寫的。psd設計的作品跟網頁完全不一樣呢。比如網頁中的一個文本框邊框顏色用css就能寫出來。能用CSS實現的就用,就不要用切片的圖片。這樣網頁所佔用的空間少,連接時載入速度就快
6、用PS做一個網頁設計圖
挺簡單的,現在fireworks中做下PSD圖,然後在DW中處理一下就行了
我也有現成的,加些分留個郵箱可以發給你。。。。
網站分為好多類型,像個人主頁、門戶、論壇等,你可以選擇其中的一個來做。。如果你是新手的話,那就做個個人主頁吧,比較自由,做成什麼樣的都可以。。。。
如果你的程序搞的比較好的話,那就做個論壇吧、
7、網頁製作中如何使用PSD模版
其實標準的網製作完成的工作實際是:psd to html,一般情況下,我們會拿到美工的psd,這時候不同的人會有不同的做法:
1.打開fireworks將圖片切割導出為html。
2.直接在dreamweaver之類的工具去拖拉布局,導入相關的圖片,flash資源。
3.先在ps中完成切圖後,在文本編輯器中看著效果圖一步步的製作。
以上是大多被採用的方法,但都不好:
第一種方法最為不好,這樣的代碼根本不具維護性和可讀性。
第二種方法也不好,代碼難免會有冗餘,做出來的東西基本需要排查一遍。
第三種方法也不好,因為你需要看效果圖一點點的拼,也就是說寫html標簽的時候,你在不斷的假設這塊要怎麼去顯示。
正確的做法是:
1.拿到psd後,先不要做別的,直接在文本編輯器中將網頁的框架寫出來,不要假設這塊將來css要去怎麼渲染,完全自然化的標簽,不加任何的css。
2.寫完之後在各個瀏覽器運行之後確保大體定位都沒有問題。
3.書寫總體css,這里的css只負責大塊的定位及樣式。
4.切出需要的圖片資源,在寫好的框架中一點點的去構造,不斷的調試,最終為成品。
5.最後,為自己的代碼添加註釋,在css,html中都要合適的為自己的代碼添加註釋。
要想做出能靈活切換皮膚,讓css主導表現,還有很多要注意的地方,但大體的流程就是這樣的,當然我們一開始不能直接就做到先寫html,但起碼要有這個意識,循序漸進。。。
謝謝熱心會員"linxz"提供實際經驗,我貼上來供大家參考:
PSD出網站從兩個大點考慮
一、一個獨立的頁面
1、分析這個頁面,先在腦袋中或者草稿紙上描繪大概的結構
2、根據設計稿的的情況,分析背景圖的分布、ICO圖的分布等
3、切割相應的圖片,導出、合並圖片
4、在編輯器中寫整體結構XHTML代碼,包括頁面中出現的所有元素的結構
5、編寫CSS樣式中的整體以及模塊代碼
6、細節調整
7、收工,瀏覽器驗證是否正確
二、由多個頁面組成的小站點或者大站點
1、瀏覽所有設計稿,統一規劃站點模塊、圖片、文件分布
2、開始第一點的操作,但規劃站點的內容分布很重要
整體考慮點:
圖片的合並,減少請求量
結構的合理性,語義化
樣式的簡潔,便於後期維護
多為後期的維護以及程序開發著想,如何簡單實現效果
8、網頁設計模版是什麼,怎麼利用網頁設計模版?
網頁模板就是已經做好的網頁框架,使用網頁編輯軟體輸入自己需要的內容,再發布到自己的網站。每個網頁模板壓縮包內包含:PSD圖片文件(可用Photoshop、ImageReady或Fireworks修改),按鈕圖片PSD文件、Flash源文件和字體文件,推薦使用Dreamweaver軟體向網頁模板添加內容。
創建和設置
1)模板的概念:作為創建其它文檔的樣板的文檔。創建模板時,可以說明哪些網頁元素不可編輯,哪些元素可以編輯。其擴展名為.dwt。
2)模板的作用:有利於保持網頁風格的一致;提高工作效率。
1.創建模板
1)創建一個全新的模板:在模板面板中,使用快捷菜單按鈕或單擊面板上的新建按鈕
模板面板的打開:Window菜單--Templates
2)創建基於文檔的模板:File菜單-Save As Template
2.設置模板頁面屬性
1)用模板創建的文檔繼承模板的頁面屬性,頁標題除外。
2)設置:Modify菜單-Page Properties
3.定義模板的可編輯區
1)定義模板的可編輯區
在模板文檔中選定對象、Modify菜單、Templates、New Editable Region
2)取消可編輯區標記
Modify菜單-Templates-Remove Editable Region
應用和更新
1.應用模板創建文檔
1)應用模板創建文檔
使用模板創建新文檔:File菜單-New From Template
或:File菜單-New-從模板面板中拖一個模板到文檔
對現有文檔應用模板:Modify菜單-Templates-Apply Template to Page-模板面板中選定模板-單擊Select
或:從模板面板中拖一個模板到文檔中
或:從模板面板中選定一個模板,單擊Apply
2)可編輯區和鎖定區
在應用了模板的文檔中,只有可編輯區的內容才可以修改。
3)把頁面從模板中分離出來
如果要對應用了模板的頁面的鎖定區進行修改,必須先把頁面從模板中分離出來。
具體操作:Modify菜單-Templates-Detach From Template
2.修改模板
在模板面板中選定模板、單擊編輯按鈕或雙擊模板名稱或使用快捷菜單的Edit、編輯完成後保存
3.更新站點中使用模板的所有文件
Modify菜單-Templates-Update Pages
9、如何用Photoshop製作網頁模板
網頁中的元素有很多,像Banner條、文本框、文字、版權、Logo、廣告等。盡量把這些相對獨立的元素放在不同的圖層中,這樣方便以後的再編輯。 不過圖層一多,就顯得很凌亂,可建立多個圖層組來進行管理。單擊圖層面板右上角的小三角按鈕,從彈出菜單中選擇「新建組」,在隨後出現的對話框中為新建組取一個名稱(如:「網頁頂部」),確定即可。這時圖層面板中多出一個文件夾圖標,即圖層組。把相關聯的圖層都拖放到同一組中,比如網頁頂部的所有元素,標題、菜單、Logo等都放到「網頁頂部」組中(見圖1)。同樣方法可以建立多個組,在組的下面還可以建立子組。 點擊圖層組前面的小三角,就可以像文件夾一樣展開或折疊它,這樣圖層面板就顯示干凈利落得多,要修改某個元素也能很容易找到。對同一組中的所以圖層可以方便地進行統一操作,如整體復制、刪除、隱藏、合並等。 小提示: ★如果你想借鑒某個網頁的設計,不妨把它截成圖片放在最下面的圖層中,再拉出多個參考線劃出網頁的大致版式,再在此基礎之上邊參考邊製作自己的網頁。 從Photoshop到Dreamweaver的轉換 在Photoshop中設計好之後,下面就要用切片工具把它轉換成網頁。有些人在切片之前喜歡合並圖層,其實沒有必要,合不合並圖層對最終生成的網頁沒有多大影響,反而會妨礙以後的編輯修改。 第1步:我們最終需要的,只是Photoshop中製作的圖形和框架。選擇切片工具(快捷鍵為K),把需要的每個圖形獨立切分出來。每切分出一個圖形,在它的左上角會顯示出切片編號(見圖2)。 第2步:在工具箱右擊切片工具,從彈出菜單中選擇「切片選擇工具」,用它可以選取、移動切片,並可以調整切片的大小。右擊某個切片還可以刪除或劃分這個切片。
10、怎麼弄網頁模板設計?
從網上下載網頁模板基本都是Psd格式的,如果想用PS來設計的話可以切磋下,加我Q就行了