1、怎樣製作簡單的靜態的網頁設計
你好。首先下載Dreamweaver.exe並打開，選擇你使用的編輯語言，本案例用html
打開頁面後，選著設計窗口，如圖所示。設計窗口可以快速布局網頁，不需要自己編輯代碼。
打開你要設計的網頁的設計圖，本經驗是百度經驗首頁為例，首先我們製作頂上的搜索條，點擊插入—表格（如圖所示）。打開表格屬性編輯表格屬性。插入1行和5列，表格寬度為1130,（即為網頁的寬度），邊距，間距分別為0，此表格只是為了定位，因此不設邊框。
設置好表格後，可在表格裡面插入你的內容，首先我們插入logo,點擊插入—圖像—選擇你要插入的圖片。點確定即可完成logo插入。表格的小大高度都可根據設計圖需要調整，滑鼠移到表格邊框虛線即可拖拉調整高度或寬度。如圖所示
接下來我們來做搜索框，點擊插入—表單—插入文本域—確定。插入文本框後可點擊文本框調整文本框的屬性。根據設計圖，文本框上班還要添加內容，因此，可選擇單元格右擊選擇表格—拆分單元格，此處是需要添加一行的內容，因此拆分為兩行，如圖所示。
用同樣的辦法拆分上面的行，因為要添加10個選擇項，因此拆分為10列（右擊選中的行—拆分單元格—10列—確定）。拆分好後在小格裡面添加文字內容即可。表格大小可根據步驟四調整。
接下來我們做搜索按鈕，同樣根據設計圖要把表格拆分為兩行。點擊插入插入按鈕的圖片。
接下來給按鈕添加鏈接，本次經驗分享的是靜態網頁，因此在此先跟大家分享怎麼直接添加按鈕鏈接。同樣是點擊插入—添加超級鏈接,填寫你事先做好的頁面鏈接，或者其他網站鏈接。
剩下的內容都可根據方法步奏逐漸添加，調節細節即可完成你想要設計的網頁。如圖所示是上面步奏所做的靜態頁面，把所有做好的網頁用超級鏈接鏈接起來即可做成一個簡單的網站
另外我們還可以採用front page。也可以很容易的實現。
望採納。
2、靜態網頁製作步驟
以下流程適合於為靜態網頁初學者 1，軟體介紹，建立管理站點 網頁網站介紹，網站取名，設計風格，色彩運用，定位方向（理論） 素材收集，軟體啟用，功能性菜單工具介紹，頁面屬性設定，預覽網頁 2，創建新文件，設定文本圖片動畫格式 文本屬性，涉及到HTML樣式，圖片屬性，圖文超連接，圖文混排。 段落和行，有序無序列表，水平線，日期，特殊字元 圖片輪顯，導航菜單，插入Flash（.swf） 字體樣式的學習 3，創建超級連接 a，文本連接：到網路，到站內；b，圖片連接：整圖，熱點區域； c，郵件地址連接； d，下載打開對話框連接解釋； e，書簽錨點連接：到同頁到不同頁。 要求對絕對路徑和相對路徑的熟練掌握。 /Article/wysj/jzll/200510/404.htm 4，建立表格 表格的建立，格式化表格（顏色採用規則） 表格數據，排序表格 行和列的選取，行和列的填加刪除 矩形多單元格塊的相關操作 標准視圖和布局視圖，自動伸展表格 表格在網頁中的應用~！ 其他花樣表格介紹。 5，幀-框架頁面 框架的建立，保存，連接--個人站點的起步 以及iframe的運用。 6，層以及時間線的運用 滑鼠移到圖片時顯示隱含圖層 & 拖動圖層的應用 http://www.pconline.com.cn/pce/sj/wz/Dreamweaver/10111/14968.html 點擊按鈕出現隱含圖層 & 下拉菜單的實現 http://www.pconline.com.cn/pce/sj/wz/dreamweaver/10111/14982.html 如何賦予文字圖層特效 & Timeline 的基本應用 http://www.pconline.com.cn/pce/sj/wz/dreamweaver/10111/14992.html 一個比較復雜的Timeline例子 http://www.pconline.com.cn/pce/sj/wz/dreamweaver/10111/15019.html 7，FORM表單相關 8，CSS樣式表 9，Head頭部屬性 以下所有代碼全是在...之間，具體內容有： a，標題元素，幫助用戶更好識別文件，有且只有一個。 當作為首頁或收藏時做文件名。 b， …顯示本文檔和其它文檔之間的關系 c， 可以在文檔中包含風格頁。 文檔本身的內部樣式。 d， …為相對路徑定義絕對路徑url，讀者下載你的文檔後，也可知道從哪下的 e， 用於包含腳本（一系列腳本語言寫的命令）可以是 JavaScript 或 VBScript。 f， 10，動態HTML應用，行為樣式 11，模板和庫 12，發布設置上傳
求採納
3、什麼是靜態網頁??
靜態網頁與動態的區別
4、靜態網頁製作
方法/步驟
1、新建一個txt文本文檔，先不要急著修改文件後綴名，有基礎的朋友手動輸入HTML代碼，不會也沒有關系，百度搜索「網頁HTML代碼」。
代碼：
<!Doctype html>
<html>
<head>
<title>靜態網頁製作教程</title>
<meta charset="gbk" />
<link href="css.css" rel="stylesheet" type="text/css" media="all" />
</head>
<body>
</body>
</html>
2、基礎的靜態網頁代碼寫出來了，下面在<body></body>中間添加網頁需要的數據內容（文字、圖片、表格、視頻等），然後將txt文本文檔的後綴名.txt修改為.html。現在點擊打開看看效果！小編在body中間加入的文字：靜態網頁製作教程。
3、這樣的文字太單調了，需要用CSS樣式定義，小編在桌面上新建一個文件夾「web」，把index.html文件放進去，然後在web文件件裡面新建一個txt文本文檔，修改為「css.css」。
4、使用滑鼠右鍵「打開方式」，選擇txt文本文檔編輯css.css文件。用CSS定義網頁字體大小12像素，網頁背景色為紅色，字體顏色為白色。
代碼：
body{font-size:12px;background:red;color:white}
保存，然後打開web文件夾中的index.html文件，查看效果。
5、下面在web文件下面新建一個images文件夾，然後打開軟體Fireworks，設計自己需要的圖片（沒有就去百度搜索自己需要的圖片，使用QQ截圖功能，截取自己需要的圖片），把設計好的圖片存入web文件夾下面的images文件夾裡面。現在我們在body中放入圖片，讓圖片在網頁裡面居中。
代碼：
<div align="center">
<img src="images/pic.png" alt="logo" title="靜態網頁製作教程" />
</div>
把上面的代碼放入index.html的body中，保存後打開看看效果！
小編在這里省略了表格和視頻的製作，小夥伴不知道的話，可以百度搜索一下。
整個簡單的靜態網頁製作完畢。
5、簡單的靜態網頁設計
您好，說簡單也不簡單，如果你肯花時間的話，那總會學會，你可以去比較好的設計公司拿里看看他們的實例是怎麼做的，你就知道是什麼程度了，你可以去BBD公司看看，能幫到你的忙。
有種最簡單的方法，最多十分鍾就搞定一頁：一，用DW軟體，打開-插入-表格-（這里您已經有了要作一個什麼樣網頁的大致想法）幾行，幾列。寬度要在1000為好，這樣下面就會出現一個導航條，邊界設置為0。如：插入表格為1行3列-確定。在用滑鼠點擊第一空格，插入-圖片，尋找您要插入圖片的位置，確定（或保存），然後在用滑鼠點擊第二個空格，插入。。。。等。以此類推。然後再用滑鼠點擊您剛才插入表格的下沿。重復您剛才的動作——插入-表格。幾行幾列要根據您對頁面的構思而定。如果要在空格里插入文章，一定要把文章的格式轉換成純Word文檔，後綴為.doc。
6、靜態網頁設計製作中的布局模式
一、靜態布局（Static Layout）
即傳統Web設計，網頁上的所有元素的尺寸一律使用px作為單位。
1、布局特點：不管瀏覽器尺寸具體是多少，網頁布局始終按照最初寫代碼時的布局來顯示。常規的pc的網站都是靜態（定寬度）布局的，也就是設置了min-width，這樣的話，如果小於這個寬度就會出現滾動條，如果大於這個寬度則內容居中外加背景，這種設計常見與pc端。
2、設計方法：
PC：居中布局，所有樣式使用絕對寬度/高度(px)，設計一個Layout，在屏幕寬高有調整時，使用橫向和豎向的滾動條來查閱被遮掩部分；
移動設備：另外建立移動網站，單獨設計一個布局，使用不同的域名如wap.或m.。
在移動端開發中採用靜態布局的兩種方式：
（1）在viewport meta標簽上設置width=320，頁面的各個元素也採用px作為單位。通過用JS動態修改標簽的initial-scale使得頁面等比縮放，從而剛好占滿整個屏幕。（見前端開發-web app 變革之rem）
（2）設在viewport meta標簽上設置content"width=640,user-scalable=no，頁面的各個元素也採用px作為單位。由於640px超出了手機寬度，瀏覽器會自動縮小頁面至剛好全屏。
優點：這種布局方式對設計師和CSS編寫者來說都是最簡單的，亦沒有兼容性問題。
缺點：顯而易見，即不能根據用戶的屏幕尺寸做出不同的表現。
二、流式布局（Liquid Layout）
流式布局（Liquid）的特點（也叫"Fluid") 是頁面元素的寬度按照屏幕解析度進行適配調整，但整體布局不變。代表作柵欄系統（網格系統）。
網頁中主要的劃分區域的尺寸使用百分數（搭配min-*、max-*屬性使用），例如，設置網頁主體的寬度為80%，min-width為960px。圖片也作類似處理（width:100%, max-width一般設定為圖片本身的尺寸，防止被拉伸而失真）。
1、布局特點：屏幕解析度變化時，頁面里元素的大小會變化而但布局不變。【這就導致如果屏幕太大或者太小都會導致元素無法正常顯示】
2、設計方法：使用%百分比定義寬度，高度大都是用px來固定住，可以根據可視區域 (viewport) 和父元素的實時尺寸進行調整，盡可能的適應各種解析度。往往配合 max-width/min-width 等屬性控制尺寸流動范圍以免過大或者過小影響閱讀。
這種布局方式在Web前端開發的早期歷史上，用來應對不同尺寸的PC屏幕（那時屏幕尺寸的差異不會太大），在當今的移動端開發也是常用布局方式，但缺點明顯：主要的問題是如果屏幕尺度跨度太大，那麼在相對其原始設計而言過小或過大的屏幕上不能正常顯示。因為寬度使用%百分比定義，但是高度和文字大小等大都是用px來固定，所以在大屏幕的手機下顯示效果會變成有些頁面元素寬度被拉的很長，但是高度、文字大小還是和原來一樣（即，這些東西無法變得「流式」），顯示非常不協調。
三、自適應布局（Adaptive Layout）
自適應布局的特點是分別為不同的屏幕解析度定義布局，即創建多個靜態布局，每個靜態布局對應一個屏幕解析度范圍。改變屏幕解析度可以切換不同的靜態局部（頁面元素位置發生改變），但在每個靜態布局中，頁面元素不隨窗口大小的調整發生變化。可以把自適應布局看作是靜態布局的一個系列。
1、布局特點：屏幕解析度變化時，頁面裡面元素的位置會變化而大小不會變化。
2、設計方法：使用 @media 媒體查詢給不同尺寸和介質的設備切換不同的樣式。在優秀的響應范圍設計下可以給適配范圍內的設備最好的體驗，在同一個設備下實際還是固定的布局。
四、響應式布局（Responsive Layout）
隨著CSS3出現了媒體查詢技術，又出現了響應式設計的概念。響應式設計的目標是確保一個頁面在所有終端上（各種尺寸的PC、手機、手錶、冰箱的Web瀏覽器等等）都能顯示出令人滿意的效果，對CSS編寫者而言，在實現上不拘泥於具體手法，但通常是糅合了流式布局+彈性布局，再搭配媒體查詢技術使用。——分別為不同的屏幕解析度定義布局，同時，在每個布局中，應用流式布局的理念，即頁面元素寬度隨著窗口調整而自動適配。即：創建多個流體式布局，分別對應一個屏幕解析度范圍。可以把響應式布局看作是流式布局和自適應布局設計理念的融合。
響應式幾乎已經成為優秀頁面布局的標准。
1、布局特點：每個屏幕解析度下面會有一個布局樣式，即元素位置和大小都會變。
2、設計方法：媒體查詢+流式布局。通常使用 @media 媒體查詢 和網格系統 (Grid System) 配合相對布局單位進行布局，實際上就是綜合響應式、流動等上述技術通過 CSS 給單一網頁不同設備返回不同樣式的技術統稱。
7、靜態網頁設計
我把網上最主流的網頁/網站製作工具都列出來了
其中第1、2是主要製作工具，後面的多是輔助工具
3、6是比較容易上手的
另外最簡單的靜態頁面其實可以用word製作，保存成html就可以
你可以試試
1、FrontPage
FrontPage是一款優秀的網頁製作與開發工具之一，它本身也是Office2000中的一個重要組件，採用了與Office2000其他組件一致的界面和操作方式，只要您使用過Office軟體，就可以輕松掌握FrontPage的用法。
2、網頁製作三劍客
Flash、Dreamweaver、Fireworks合在一起被稱為網頁製作三劍客。這三個軟體相輔相承，是製作網頁的首選工具，其中Dreamweaver主要用來製作網頁文件，製作出來的網頁兼容性好、製作效率也很高，Flash用來製作精美的網頁動畫，Fireworks用來處理網頁中的圖形。
3、Photoshop
Photoshop是Adobe公司的王牌產品，無論是在平面廣告設計、室內裝潢，還是處理個人數碼照片方面，Photoshop都已經成為不可或缺的工具。在網頁製作方面，它多姿多彩的濾鏡和功能強大的選擇工具可以做出各種各樣的文字效果來。
4、Swishmax
Swish是一款非常方便的Flash文字特效製作工具，你只要點幾下滑鼠，就可以創造出形狀、文字、按鈕動畫，你也可以選擇內建的超過230種諸如爆炸、漩渦、3D旋轉以及波浪等預設的動畫效果。
5、PhotoImpact
PhotoImpact提供了多媒體時代專業影像設計者最直覺的創意空間、最方便的製作工具、及最寬廣的表達形式，整合了新時代的3D物件及文字特效與粒子效果、壓力筆支援、不同的自然筆觸、各式直覺操作的特效圖庫、以及網頁影像與辦公室文件的相容性，將構思到表達的過程完整組合，是專業網頁影像設計者不可或缺的利器。
6、Sound Forge
Sound Forge軟體是一款非常棒的音效編輯軟體,它除了音效編輯軟體的功能外,還可以讓你處理大量的音效轉換的工作,使你能夠輕松的完成各種看似復雜的音效編輯工作。如果下載的是英文版，可以用金山快譯永久漢化，但效果不是很盡人意。
7、碩思閃客精靈
碩思閃客精靈是一款用於瀏覽和解析Flash動畫的工具。它可以將.swf文件導出成.fla文件，還能將flash動畫中的圖片、矢量圖、聲音、視頻（*.flv）、文字、按鈕、影片片段、幀等基本元素完全分解，以及對動作腳本(ActionScript)進行解析，清楚的顯示其動作代碼，讓你對Flash動畫的構造一目瞭然。建議你趕快去下載吧！｝
8、Clipyard
你只要導入不同的Flash動畫文件，將其放在不同的層上，經調試效果，導出後就成了一個單獨的flash了，操作簡單，特別適合於將自己喜歡的Flash動畫加入祝福、簽名後贈送友人。
9、FlashFXP
是一款優秀的FTP工具，特別適合Web站點管理員使用。支持文件夾(帶子文件夾)的文件傳送、刪除；支持上傳、下載及第三方文件續傳；可以跳過指定的文件類型，只傳送需要的文件；可以自定義不同文件類型的顯示顏色；可以緩存遠端文件夾列表，支持FTP代理；具有避免空閑功能，防止被站點踢出；可以顯示或隱藏「隱藏」屬性的文件、文件夾；支持每個站點使用被動模式等。
10、FlaX
FlaX是一款製作Flash文字特效的小巧軟體。在以前若要製作文字繞圓圈的動畫，在Flash里一個一個字的慢慢調整位置，頗費時間，如果使用FlaX很快就可以就搞定。 FlaX有四個窗口面板：預覽窗口、影片屬性面板、文字屬性面板、特效屬性面板。
11、Web Animator
Web Animator(網頁動畫設計)是HomePage Builder附帶的創建動畫GIF的程序。所謂動畫GIF是GIF格式圖像文件的一種，組合幾個圖像象漫畫一樣連續運動。動畫GIF與普通的GIF圖像一樣可以粘貼到頁面。使用Web Animator可以完成如下工作：組合現有的圖像，創建類似於漫畫的動畫；給一個圖像添加動畫效果，創建具有效果的動畫；給指定的字元串添加動畫效果，創建字元動畫。
12.golive
Adobe收購mm之後推出的網頁製作工具,將代替Dreamweaver成為主流.
滿意請採納。