本地網頁設計

1、網頁設計製作詳細流程

分析如下：

1、首先下載安裝Dreamweaver，打開後，新建一個網頁，一般選擇「HTML」建立網頁。選擇「經典」界面，有助於我們更便捷使用這個軟體。

2、下面選擇這三個界面，代碼、拆分、設計，一般默認設計界面，對於新手這個功能具有可視化，能更好的製作網頁。

3、下面我們來製作網站站點，在電腦上建一個文件作為根目錄。我們所建網站的所有文件和網頁都保存在這個文件中。站點的作用就是使你的網站網頁之間框架清晰。同時給站點起個名字。

4、然後再在站點根目錄下建立一個專門儲存網站圖片的文件，並設置默認。這樣你添加到這個網站的所有圖片都自動保存到這個文件，不會丟失。注意文件命名要用英文。下面我用我建立的（籃球資訊網）來介紹，點擊右下方籃球資訊網——下拉點擊管理站點——點擊高級設置——設置默認圖像文件夾為剛建立的images。保存。

5、下面我們來製作這個網站首頁，先學習添加圖片。插入——圖像——選擇素材添加。點擊圖片，下面屬性可以編輯修改圖片大小，添加超鏈接等等。下面我修改圖片大小做示範。

6、下面學習添加文本。編輯「籃球資訊網」，下面屬性可以設置文本字體、添加超鏈接等等，點擊頁面屬性，可以詳細編輯文本屬性。

7、網頁基本就是文字和圖片的組合，添加視頻還需要學習者好好搜索Dreamweaver 的使用視頻加以學習。最後製作完一個網頁要記得保存。左上角文件——保存。

8、最後我們學習添加超鏈接。我用建立的第二個網頁來做示範。選中籃球資訊網文本，點擊頁面下方屬性——鏈接——點文件小按鈕——選中第一個網頁，這樣籃球資訊網文本變成藍色。這是網站內部鏈接，相反就有外部鏈接。添加如圖，一定要寫http://......就可以了。

9、最後我們瀏覽網頁。左上角文件——在瀏覽器中瀏覽網頁，點擊網頁中兩個鏈接都能到達指定網頁。

(1)本地網頁設計擴展資料：

網頁設計

設計網站要注意兩個要點：整體風格和色彩搭配。

風格

網站的整體風格及其創意設計是最難以學習的。難就難在沒有一個固定的模式可以參照和模仿。給你一個主題，任何兩人都不可能設計出完全一樣的網站。

風格（Style）是抽象的。是指站點的整體形象給瀏覽者的綜合感受。這個「整體形象」包括站點的CI（標志、色彩、字體、標語）、版面布局、瀏覽方式、交互性、文字、語氣、內容價值、存在意義、站點榮譽等等諸多因素。

色彩搭配

無論是平面設計，還是網頁設計，色彩永遠是最重要的一環。當我們距離顯示屏較遠的時候，我們看到的不是優美的版式或者是美麗的圖片，而是網頁的色彩。

網頁配色小技巧：

1．用一種色彩：這里是指先選定一種色彩，然後調整透明度或者飽和度，這樣的頁面看起來色彩統一，有層次感；

2．用兩種色彩：先選定一種色彩，然後選擇它的對比色；

3．用一個色系：簡單的說就是用一個感覺的色彩，例如淡藍，淡黃，淡綠；或者土黃，土灰，土藍。

在網頁配色中，還要切記一些誤區：

1．不要將所有顏色都用到，盡量控制在三至五種色彩以內；

2．背景和前文的對比盡量要大（絕對不要用花紋繁復的圖案作背景），以便突出主要文字內容。

2、網頁設計如何加入本地圖片

用img啊
<img src="">雙引號中寫入你圖片的路徑。

3、如何進行網頁設計

網頁設計與平面設計的異同

設計傳達的方式

傳統的平面設計講究頁面構圖、版式布局、空間表現等，而網頁設計也適用這些要素。

網頁設計與傳統平面設計在視覺傳達方面很大的相似點，但是在技術方面又是有很大的區別。

網頁設計是傳統平面設計的視覺傳達效果運用和網路技術的結合，所以可以說網頁設計綜合了平面設計藝術和網路技術。

網頁設計的重要特色就是動靜結合，這點在平面設計裏是無法實現的。

處理的差別

傳統平面設計的作品大多是以印刷的平面形式表現；而網頁設計作品則是透過顯示器表現，並且在傳輸的過程中受到網路頻寬的限制。

普通印刷是按照色素的減法原理進行的，設計時的顏色模式為 CMYK ，而電腦的顯示器的色彩原理則是以色光合成加法原理進行的，是 RGB 模式，使用同樣的顏色，但是在不同的顏色模式下，顯示的效果是會有色差的。

因為受到網路頻寬的限制，網頁設計中的圖像處理也不同於平面設計，為了加快下載速度，在保持圖像質量的前提下我們要盡可能的縮小其檔案大小，而不像平面設計那樣為了追求圖像的質量而不管其文件大小。

作為一名合格的網頁設計師，在處理網路圖形時，應做到在保持圖像清晰的前提下，盡可能縮小圖片的檔案大小。
網頁的構圖布局與平面構圖布局有著很大的相似之處，但是因為技術的局限，網頁構圖遠不如平面設計那樣揮灑自如。

在平面設計中想把某一物件放置到某一位置的時候只需要簡單的拖曳就可以完成。
但是在網頁設計中想對某一物件進行定位的話就必須有 HTML 語言的支援才行。

所以在進行網頁設計的時候，除了要有好的創意，還應該考慮到技術上的可行性。
網頁的構圖與傳統的平面構圖最大的區別就是技術的可行性。

在進行網頁設計時必需時時提醒自己，所設計的作品最終會通過網路傳輸到用戶端，經過下載，再用瀏覽器瀏覽，作品將受到頻寬和顯示器的限制。

而且，所有網頁的後端語言都是以 HTML 為基礎，輔以 JavaScript 或 VBScript 編寫的程式，有些動態特效實現起來會有較大的難度。
所以，網頁設計人員在構思創意時，要考慮到技術上是否能實現。

如果一味地追求視覺效果的創意，而忽略技術上的限制，顧此失彼，再好的構思也只好放棄。
ㄞ鄏b網頁設計中實現的創意，對網頁設計構圖來說是毫無價值的。

功能的不同

傳統平面的設計作品是以向人們傳達某種資訊或訴求為目的。而網頁設計網頁的設計必須是配合網站的內容設計，而不是單純地只為表現藝術而設計。

除了擁有平面設計作品的功能以外，還有重要的引導和連接功能，也就是網頁具有很強的可操作性和互動性。

網頁設計與傳統的平面設計最大的區別就是網頁的可操作性。
網頁的可操作性是通過頁面間的鏈結實現的。

所謂鏈結結構就是指網頁頁面間的相互鏈結關系。
選擇適當的鏈結結構，對整個網站的各個頁面設計將有很大的引導作用。

若鏈結的結構使用不良的話，會使得重要的資訊不能讓訪問者獲取，這將違背了網站設計者的初衷。

在製作一個網站的時候會有一個名為 index.html 的頁面，我們一般把它稱為 「首頁」 。

一般在瀏覽網站的時候，在瀏覽器的位址欄裏輸入網址後，直接打開的就是檔名為 index.html 的頁面，它的作用就與書本的目錄相同。

大家應該都有在書上找資料的經驗，一般來說我們都會打開書的目錄來查尋資料位置，以便較快找到資料。

同理，如果把我們的網站看成是一本書的話，那麼 「首頁」 就是書的目錄，它的作用就是使我們盡快的找到自己想找的資訊。

而很多人在設計網站的時候做出來的網站是很漂亮，但卻讓訪問的人無從下手來進行瀏覽。

想從這個網站裏找到自己有興趣的內容卻怎麼也找不到，雖然說這個網站裏有這些內容，但就是找不到或者找起來很麻煩。

這就說明了引導性和可操作性的重要。

4、網頁的設計有幾種方法

第一、靠前、無邊框設計。無邊框設計在近幾年比較流行，在設計頁面的時候，將頁面中的風格線、邊框刪掉，用間距來代替的一種設計方法。無邊框設計一般是以大圖為主，圖片本來就是一種分割元素。而內容基本是有規律的，留白間距之間的內容一定要相對一致、重復、緊密，這樣用戶在瀏覽的時候才會認為這些內容是一體的。一般來說，小眾垂直的產品更適合使用無邊框設計。

第二、卡片設計。卡片的設計打破了傳統上固定的排版布局方式，提升了版面的使用率，可以給網站建設增加更多的驚喜。那麼卡片設計有哪些優勢呢？1、可以提高頁面的使用率。卡片就好像是一個容器，將類型不一樣的內容設置在不一樣的卡片中，這樣就可以很好地區分內容，還能夠統一頁面的風格。比如傳統列表，內容一般是縱向滾動的方式，能夠展示的內容比較有限，卡片式的設計採用的滑動方式，就可以有效地解決空間問題。2、區分卡片上的內容。卡片就好像是一個容器，將不同的內容放置在不同的卡片，更好地區分內容的類型。卡片的維度是不一樣的，而且相對獨立、有互相有聯系，所以通過卡片歸納網站的內容，整個網站就顯得更有秩序。3、卡片式設計可以提升可控性、提升體驗度。卡片式設計的使用范圍比較廣泛，可以覆蓋、滑動、堆疊，有良好的擴展性和可操作性。

第三、分割線的設計。這也是常見的一種頁面布局設計方式，可以更好地幫助用戶快速熟悉頁面的布局，有良好的內容組織性。分割線可以貫穿整個頁面，將不同的內容進行分割，成為獨立的信息。

網站建設中的頁面布局，有不同的設計方式，而且設計的趨勢不斷在變化，在設計頁面布局之前，就要考慮好合適的樣式，不能一味地追求潮流，根據產品的實際需求，選擇合適的設計方式。而分割線的設計，想要做得出色，就要處理好線的間距、粗細、顏色等等

5、如何實現網頁製作的本地測試

網頁製作本地化測試主要分為:
1、製作的是單頁面的html的話，那麼將網頁的代碼和素材源文件都在本地化儲存好，方便調用, 然後進行用瀏覽器打開html文件，在網頁中打開就可以實現訪問了；
2、如果是做成型的網站，開源程序的網站，那就需要在電腦上配置虛擬 主機，通過iis進行配置，然後實現本地化虛擬伺服器，然後進行通過埠號的形式進行訪問。

6、網頁設計怎麼編輯本地圖片

1、精準找圖
網頁設計之前，確定好網站的主題，以及要宣傳的品牌，提取關鍵詞來尋找圖片對象，圖片無需太復雜，最好能夠讓用戶一眼看出網站想要表達的主題，例如：企業宣傳電腦顯示器，以「畫質清晰，觸控」作為顯示器的關鍵詞，找到能突顯出產品功能的圖片最為最佳選擇。

2、選定風格
網頁設計的整體風格要一致，在選好的圖片中挑選符合網站主題的風格，每一種產品的主色調要協調，在突出產品特色的同時不失美的體驗，下面是在蘋果官網截取的圖片，每張圖片能充分展示不同的產品，加上宣傳詞彰顯產品特色，以暖色調為主，給人以舒心的感覺

3、圖片簡單化
有時候圖片的抽象是一種藝術，但這樣承擔的風險更大一些，因為不一定每個人都懂藝術，另外圖片太復雜不一定是豐富的體現，不能巧妙的使用往往會適得其反。因此在選擇圖片時盡量簡單化，不要讓用戶去猜測圖片的含義，最好一眼能明白圖片想要表達的意思。例如：下面一張圖是蘋果官網上IPAD的宣傳圖，藝術且讓人充滿想像。但是如果對於不了解產品的人來說，並不知道這張配圖想要表達什麼，效果則會相反。

網頁設計圖片的選擇講究的是對網站總體風格的敏銳度，以及對產品的深入了解程度，在設計之前確定好方向，再利用既定的關鍵詞搜尋圖片，獲得最佳的搭配方案，巧妙的抓住用戶的注意力，便可輕松選圖用圖。

7、如何在本地製作網頁

由於目前所見即所得類型的工具越來越多，使用也越來越方便，所以製作網頁已經變成了一件輕松的工作，不像以前要手工編寫一行行的源代碼那樣。一般初學者經過短暫的學習就可以學會製作網頁，於是他們認為網頁製作非常簡單，就匆匆忙忙製作自己的網站，可是做出來之後與別人一比，才發現自己的網站非常粗糙，這是為什麼呢？常言道：「性急吃不了熱豆腐」。建立一個網站就像蓋一幢大樓一樣，它是一個系統工程，有自己特定的工作流程，你只有遵循這個步驟，按部就班地一步步來，才能設計出一個滿意的網站。

一、確定網站主題

網站主題就是你建立的網站所要包含的主要內容，一個網站必須要有一個明確的主題。特別是對於個人網站，你不可能像綜合網站那樣做得內容大而全，包羅萬象。你沒有這個能力，也沒這個精力，所以必須要找准一個自己最感興趣內容，做深、做透，辦出自己的特色，這樣才能給用戶留下深刻的印象。網站的主題無定則，只要是你感興趣的，任何內容都可以，但主題要鮮明，在你的主題范圍內內容做到大而全、精而深。

二、搜集材料

明確了網站的主題以後，你就要圍繞主題開始搜集材料了。常言道：「巧婦難為無米之炊」。要想讓自己的網站有血有肉，能夠吸引住用戶，你就要盡量搜集材料，搜集得材料越多，以後製作網站就越容易。材料既可以從圖書、報紙、光碟、多媒體上得來，也可以從互聯網上搜集，然後把搜集的材料去粗取精，去偽存真，作為自己製作網頁的素材。

三、規劃網站

一個網站設計得成功與否，很大程度上決定於設計者的規劃水平，規劃網站就像設計師設計大樓一樣，圖紙設計好了，才能建成一座漂亮的樓房。網站規劃包含的內容很多，如網站的結構、欄目的設置、網站的風格、顏色搭配、版面布局、文字圖片的運用等，你只有在製作網頁之前把這些方面都考慮到了，才能在製作時駕輕就熟，胸有成竹。也只有如此製作出來的網頁才能有個性、有特色，具有吸引力。如何規劃網站的每一項具體內容，我們在下面會有詳細介紹。 四、選擇合適的製作工具

盡管選擇什麼樣的工具並不會影響你設計網頁的好壞，但是一款功能強大、使用簡單的軟體往往可以起到事半功倍的效果。網頁製作涉及的工具比較多，首先就是網頁製作工具了，目前大多數網民選用的都是所見即所得的編輯工具，這其中的優秀者當然是Dreamweaver和Frontpage了，如果是初學者，Frontpage2000是首選。除此之外，還有圖片編輯工具，如Photoshop、Photoimpact等；動畫製作工具，如Flash、Cool 3d、Gif Animator等；還有網頁特效工具，如有聲有色等，網上有許多這方面的軟體，你可以根據需要靈活運用。

五、製作網頁

材料有了，工具也選好了，下面就需要按照規劃一步步地把自己的想法變成現實了，這是一個復雜而細致的過程，一定要按照先大後小、先簡單後復雜來進行製作。所謂先大後小，就是說在製作網頁時，先把大的結構設計好，然後再逐步完善小的結構設計。所謂先簡單後復雜，就是先設計出簡單的內容，然後再設計復雜的內容，以便出現問題時好修改。在製作網頁時要多靈活運用模板，這樣可以大大提高製作效率。

六、上傳測試

網頁製作完畢，最後要發布到Web伺服器上，才能夠讓全世界的朋友觀看，現在上傳的工具有很多，有些網頁製作工具本身就帶有FTP功能，利用這些FTP工具，你可以很方便地把網站發布到自己申請的主頁存放伺服器上。網站上傳以後，你要在瀏覽器中打開自己的網站，逐頁逐個鏈接的進行測試，發現問題，及時修改，然後再上傳測試。全部測試完畢就可以把你的網址告訴給朋友，讓他們來瀏覽。

七、推廣宣傳

網頁做好之後，還要不斷地進行宣傳，這樣才能讓更多的朋友認識它，提高網站的訪問率和知名度。推廣的方法有很多，例如到搜索引擎上注冊、與別的網站交換鏈接、加入廣告鏈等。

八、維護更新

網站要注意經常維護更新內容，保持內容的新鮮，不要一做好就放在那兒不變了，只有不斷地給它補充新的內容，才能夠吸引住瀏覽者

一. 網頁設計軟體的選擇

設計主頁首先要選擇合適的工具軟體，現在比較流行的網頁製作軟體是 FrontPage 和 DreamWave。他們各有優缺點，FrontPage 是微軟出品的網頁編輯軟體，也是 Office 系列軟體的組成部分。最新的 FrontPage2000中文版 在 Office2000 的軟體包中可以找到。如果對 Office 有一定的基礎，會用 Word 的人，很開就可以學會使用 FrontPage ，它的最大優點之一就是易學易用。另外 FrontPage 製作的網頁在 IE 瀏覽器中的效果也特別好。但是，如果你希望網頁在 Netscape 或其他瀏覽器上有良好表現，那麼使用 FrontPage 就有些麻煩。不是說不可以，只是很容易出錯。在這方面 DreamWave 就好很多，畢竟是第三方的軟體。DreamWave是由 MacroMedia 公司出品的網頁製作軟體，最新版本是3.0，功能也同樣很強大。不過學習起來要難一些，而且 IE 瀏覽器的一些高級功能就無法實現了。各有所長，只有自己權衡了。另外不要將兩個編輯軟體交替使用，否則會出現混亂。

二. 網路服務商的選擇

現在提供免費主頁空間的網站非常多，當然也有收費的。選擇什麼好呢？千萬不要認為什麼「無限主頁空間」就是最好。這里的講究非常多的。首先要明確服務商提供的是什麼操作系統的伺服器，如果你使用 FrontPage 編寫主頁，最好選擇 Windows NT 伺服器，這樣效果最好。另外還有 Linux 和 Unix 的伺服器也很多見，用這些伺服器的話要注意一個問題，就是文件名的大小寫一定要清楚。一般的 Windows 用戶會覺得這不是問題，因為微軟的習慣，文件名大小寫是不區分的。但是 Linux 和 Unix 不是這樣，比如你有一個 top.jpg 的圖片上傳，然後在 HTML 超連接寫成了 top.JPG，擴展名寫成大寫了。在本地看這個 HTML 文件很正常，圖片顯示正確。但等你上傳到伺服器上，你會發現根本無法顯示文件。解決這個問題的最簡單辦法是所有的文件名和擴展名都用小寫英文字母，而且不要用長文件名。當然，如果是 Windows NT 伺服器，就不用擔心這個問題。
如果只是做簡單的主頁，那隻需要得到相應的主頁空間就可以了。但如果做高級一些到主頁，就牽涉到一些網路程序的執行，這就需要 CGI 許可權甚至資料庫許可權。一般的網路伺服器上是不會免費提供這些功能的，而且收費往往不低。對於一般的個人主頁完全沒必要苛求這些，不然維護費用會很大，除非確實想做出一個很好的站點。免費主頁空間的另外一個問題是服務商隨時有權關閉服務，因為不承擔任何承諾，這樣你的成果可能會白費，所以要找一些比較可靠的主頁空間，最好是已經提供較長時間服務，且有一定知名度的。
另外，不同的服務商使用的網路伺服器和線路也不盡相同，訪問的更新速度差異也非常大。要選擇線路速度快一些的主頁空間，不然會大大影響來訪者的興趣。最好使用本地的網路伺服器，因為跨區域的網路線路往往比較擁擠。
還有，網路服務商提供怎樣的主頁維護方式也很重要。如果提供 FrontPage 擴展的 HTTP 維護，那就最方便了。可以做到全自動維護。如果是傳統的 FTP 方式，也不錯。FrontPage2000 同樣可以用 FTP 自動上傳，而且也可以用許多 FTP 管理軟體。但還有一種是基於 WEB 的主頁維護，這種主頁空間只能到服務商的網站上按它特定方式編輯維護主頁。這樣很不方便，最好不要使用。

三. 主頁內容的選擇

評價一個主頁的優劣，主要不是看外觀而是看內容。選擇適當的內容很重要，最好是自己比較感興趣的內容，否則會沒有長期維護的熱情。另外不要做太多的主題，沒有重點的四面出擊往往一樣也不吸引人。很多著名的個人主頁都是靠一個優秀的欄目而大受歡迎的，飛翔鳥硬體就是個很好的例子。維護主頁貴在堅持，一定要不斷上傳新的內容來充實更新網站。不過同樣要注意不要隨便抄襲別人的內容，如果對方的內容是可以轉載的自然沒問題，但如果是版權所有的，可能會遇到糾紛，甚至會強制關閉你的個人主頁。知識產權還是需要尊重的，因此在轉在其他網站的內容時，最好徵求對方的同意。
還有，主頁內容千萬不要有違法的成分，特別是不要有色情內容。

四. 主頁製作的技巧

主頁製作是一門綜合性技術，也是一門藝術，它包括策劃、美工、設計等等。這里只是說一些應該注意的問題。很多商業網站都有「廣告條」，點擊廣告可以為網站賺錢，甚至像 Yahoo 這樣的網路公司也主要靠這些廣告的收入維持。但是一般的個人主頁，建設初期最好不要放廣告條，特別是不能放很多。在訪問量不是很大的時候，廣告是賺不到錢的。反而會讓訪問者覺得主頁很亂，全是無聊的廣告，給人的印象就很差了。
還有些個人主頁因為訪問量很低沒面子，就修改網頁計數器，增加訪問量。這其實是自欺欺人，以後別人也不會相信你的主頁流量了。一個好的主頁，總會有越來越多的訪問者，如果沒質量的主頁，做手腳又有何用？
還有，如果是免費主頁空間，一般速度都不太快，空間也不大。最好不要提供過多的軟體下載，這樣會嚴重影響訪問速度。到頭來會得不償失的。一般較好的軟體下載站點都提供獨立的 FTP 線路下載軟體，這樣才能保證網站的訪問速度不受影響。同樣的，主頁上也不要使用解析度太大的圖片，一般一張圖片盡量控制在 20KB 一下。個人主頁中也不要過多使用 Java class 的小程序和過於復雜的 Java 腳本，這些只起到點綴的作用就行了，用得太多了，瀏覽網頁的速度也會變得非常遲鈍。
製作主頁時還要特別小心語言版本的問題，特別是中文。選用的內碼或字體錯誤的話，訪問時就會出現亂碼或字體扭曲等問題。

五. 域名和無形資產

每個個人主頁都有自己的域名，就像人總有個名字。起名字也有很多講究。很多人會模仿著名網站的名字，在別人的拼寫上改一改字母之類的。其實這樣並不好，沒有了自己的個性，反而不容易給人留下深刻的印象。還是自己取個好名字吧。另外常看到有人寫著「永久域名 xxx.yeah.net」之類的。其實這些都是二級域名，一些網路公司免費提供的而已。這些都稱不上永久域名，因為公司隨時可以停止服務的。最好是能擁有自己的國際頂級域名，這才是永遠屬於你自己的。其實這也並不是一筆非常昂貴的費用，但確是主頁長期發展的根本保障。當然，如果覺得沒必要，使用免費二級域名也不錯。

六. 宣傳上的要點

個人主頁總算做好了，然後就要向外界宣傳你的主頁了。宣傳的方法有很多，但注意不要虛張聲勢。大喊狼來了，這樣很沒意思，別人即使來看一眼也是搖頭便走。更大忌的是使用「垃圾郵件」的方式宣傳自己的主頁，這可以說是最無恥的行為之一了。

8、想自己做一個本地的網站，就是輸入一個自己自定義的IP地址能打開自己製作的網頁

本地的話，localhost/127.0.0.1是固定的本地地址，也可以使用host文件定義其他ip或者網址定向到本地。和網專頁的對應是用的本地服屬務器軟體，比如apach和iis或者其他伺服器軟體都會有本地目錄或者路由表，找到設置設置下或者編輯配置文件就行。