網(wǎng)站規(guī)劃與設計ppt課件

1、DreamweaverlDreamweaver 是美國MACROMEDIA 公司開發(fā)的集網(wǎng)頁制造和管理網(wǎng)站于一身的所見即所得網(wǎng)頁編輯器，它是第一套針對專業(yè)網(wǎng)頁設計師特別開展的視覺化網(wǎng)頁開發(fā)工具，利用它可以輕而易舉地制造出跨越平臺限制和跨越閱讀器限制的充溢動感的網(wǎng)頁。簡介簡介lDreamweaver、FLASH 以及在DREAMWEAVER 之后推出的針對專業(yè)網(wǎng)頁圖像設計的FIREWORKS，三者被MACROMEDIA 公司稱為DREAMTEAM(夢之隊)，足見市場的反響和MACROMEDIA 公司對它們的自信。說到DREAMWEAVER 我們應該了解一下網(wǎng)頁編輯器的開展過程，隨著互聯(lián)網(wǎng)(Int

2、ernet) 的家喻戶曉，HTML 技術的不斷開展和完善，隨之而產(chǎn)生了眾多網(wǎng)頁編輯器，從網(wǎng)頁編輯器根本性質可以分為所見即所得網(wǎng)頁編輯器和非所見即所得網(wǎng)頁編輯器那么原始代碼編輯器，兩者各有千秋。所見那么所得網(wǎng)頁編輯器的優(yōu)點就是直觀性，運用方便，容易上手，您在所見即所得網(wǎng)頁編輯器進展網(wǎng)頁制造和在WORD 中進展文本編輯不會感到有什么區(qū)別，但它同時也存在著致命的弱點.Dreamweaver優(yōu)點優(yōu)點l1最正確的制造效率Dreamweaver可以用最快速的方式將Fireworks，F(xiàn)reeHand，或Photoshop等檔案移至網(wǎng)頁上。運用檢色吸管工具選擇熒幕上的顏色可設定最接近的網(wǎng)頁平安色。對于選單，

3、快捷鍵與格式控制，都只需一個簡單步驟便可完成。Dremweaver能與您喜歡的設計工具，如Playback Flash，Shockwave和外掛模組等搭配，不需分開Dreamweaver便可完成，整體運用流程自然順暢。除此之外，只需單擊便可使Dreamweaver自動開啟Firework或Photoshop來進展編輯與設定圖檔的最正確化。 l2網(wǎng)站管理 運用網(wǎng)站地圖可以快速制造網(wǎng)站雛形、設計、更新和重組網(wǎng)頁。改動網(wǎng)頁位置或檔案稱號，Dreamweaver 會自動更新一切連結。運用援助文字、HTML碼、HTML屬性標簽和普通語法的搜索及置換功能使得復雜的網(wǎng)站更新變得迅速又簡單。 l3無可比較的控

4、制才干 Dreamweaver是獨一提供Roundtrip HTML、視覺化編輯與原始碼編輯同步的設計工具。它包含主流文字編輯器。幀(frames)和表格的制造速度快的令您無法想像。進階表格編輯功能使您簡單的選擇單格、行、欄或作未延續(xù)之選取。甚至可以排序或格式化表格群組，Dreamweaver 援助精準定位，利用可隨便轉換成表格的圖層以遷延置放的方式進展版面配置。所見即所得 Dreamweaver勝利整合動態(tài)式出版視覺編輯及電子商務功能，提供超強的援助才干給Third-party廠商，包含ASP， Apache，BroadVision， Cold Fusion，iCAT， Tango與自行開展

5、的運用軟體。當您正運用Dreamweaver在設計動態(tài)網(wǎng)頁時，所見即所得的功能，讓您不需求透過閱讀器就能預覽網(wǎng)頁。夢境樣版和XML Dreamweaver將內容與設計分開，運用于快速網(wǎng)頁更新和團隊協(xié)作網(wǎng)頁編輯。建立網(wǎng)頁外觀的樣版，指定可編輯或不可編輯的部份，內容提供者可直接編輯以款式為主的內容卻不會不小心改動既定之款式。您也可以運用樣版正確地輸入或輸出XML內容。 Dreamweaver缺陷缺陷l一、 難以準確到達與閱讀器完全一致的顯示效果。也就是說您在所見即所得網(wǎng)頁編輯器中制造的網(wǎng)頁放到閱讀器中是很難完全到達您真正想要的效果，這一點在構造復雜一些的網(wǎng)頁如分幀構造、動態(tài)網(wǎng)頁構造中便可以表達出來

6、； l二、 頁面原始代碼的難以控制性，比如您在所見即所得編輯器中制造一張表格也要幾分鐘，但您要它完全符合您要求能夠需求幾非常鐘，甚至更多時間。而相比之下，非所見那么所得的網(wǎng)頁編輯器，就不存在這個問題，由于一切的HTML代碼 都在您的監(jiān)控下產(chǎn)生，但是由于非所見那么所得編輯器的先天條件就注定了它的任務低效率。如何實現(xiàn)兩者的完美結合，那么既產(chǎn)生干凈、準確的HTML代碼，又具備那么見那么所得的高效率、直觀性，不斷是網(wǎng)頁設計師夢想。在DREAMWEAVER之前，F(xiàn)RONTPAGE98不斷被人們以為是最好的所見即所得網(wǎng)頁編輯器，但是它同樣承繼了所見即所得的種種劣性。 規(guī)劃站點l1. 站點規(guī)劃的規(guī)那么l2.

7、 建立本地站點l3. 站點導入導出復制刪除一站點規(guī)劃的規(guī)那么一站點規(guī)劃的規(guī)那么普通來說，在規(guī)劃站點構造時，應該遵照以下一些規(guī)那么。(1).文檔分類保管 假設一個復雜站點，它有很多文件，我們必需運用分類保管是它更明晰。(2).合理地命名文件稱號為了方便管理，文件夾和文件的稱號最好要有詳細的含義。(3).本地站點與遠程站點構造一致為了方便管理，在設置本地站點時，應該將本地站點與遠程站點的構造設計堅持一致。二建立本地站點二建立本地站點 在建立站點之前，我們要知道一切的文件夾、資源和特定的文件都包含在站點中。因此，首先在硬盤上建立一個新文件夾作為本地根文件夾，用來存放相關文檔。如在F 盤根目錄下創(chuàng)建一

8、個名為MyWeb 的文件夾，在MyWeb 文件夾里再創(chuàng)建一個名為images 的文件夾，用來存放網(wǎng)站中甬道的圖象文件。(1).給站點起個名字，網(wǎng)址無所謂(2).不適用任何效力器端技術(3).選擇本地的副本(4).網(wǎng)絡銜接不需求(5).完成站點定義(6).定義默許圖像文件夾(以后的圖片均會自動存在這里)也可以運用高級定義站點，更加的方便。三導入和導出與復制刪除站點三導入和導出與復制刪除站點la) 站點導入、導出lb) 站點復制、刪除lc) 留意：不要刪除了站點源副本插入圖片l1. 插入圖像l a) 在常用工具欄點擊圖象按鈕，插入?；蛘卟藛尾迦雸D象l b) 點擊屬性設置圖象屬性l2. 圖像占位符l

9、3. 交互式圖像l4. 圖像背景插入圖片l1. 插入圖像l2. 圖像占位符l 當用戶制造網(wǎng)頁時，在頁面某個位置需求插入一幅圖片。但一時找不到本人喜歡適宜的圖片，這就需求用到Dreamweaver8 的占位符功能。圖象占位符并不是在閱讀器中顯示的最終圖象，它知識一種暫時的、替補的圖形。用戶不僅可以設置圖象占位符的大小和顏色，還可以為圖象占位符號提供文本標簽。插入圖像占位符- 找到交換的交換掉l3. 交互式圖像l4. 圖像背景插入圖片l1. 插入圖像l2. 圖像占位符l3. 交互式圖像l 用于創(chuàng)建交互式圖象的兩幅圖象大小必需一樣。否那么交換的圖象再顯示時會進展緊縮或展開以順應原有圖象的大小，這樣容

10、易呵斥圖象的失真。在網(wǎng)頁中運用交互式圖象，可是網(wǎng)頁更生動。插入鼠標經(jīng)過圖像- 選擇原始圖像和經(jīng)過圖像l4. 圖像背景插入圖片l1. 插入圖像l2. 圖像占位符l3. 交互式圖像l4. 圖像背景l(fā)在Dreamweaver 中，設置網(wǎng)頁背景有兩種方法：一種時設置背景顏色，另一種時設置背景圖象。l修正-頁面屬性Ctrl+J插入圖片l1. 插入圖像l a) 在常用工具欄點擊圖象按鈕，插入。或者菜單插入圖象l b) 點擊屬性設置圖象屬性l2. 圖像占位符l3. 交互式圖像l4. 圖像背景表格運用l1. 創(chuàng)建表格l2. 表格的運用la) 存放文本lb) 存放圖片l3. 選定表格、行、列、單元格元素l4.

11、設置表格、行列、單元格屬性l5. 添加和刪除行或列l(wèi)6. 單元格的合并及拆分表格運用l1. 創(chuàng)建表格l2. 表格的運用l3. 選定表格、行、列、單元格元素l在對表格元素進展操作之前，必需先選定表格元素。l(1).選定整行l(wèi)(2).選定整列l(wèi)(3).選定整個表格；修正-表格-選擇表格， 左上右下角， 點擊標簽l4. 設置表格、行列、單元格屬性l5. 添加和刪除行或列l(wèi)6. 單元格的合并及拆分超級鏈接l1.什么是URLl2.途徑l3.創(chuàng)建各種超鏈接超級鏈接l超級鏈接是指站點內不同網(wǎng)頁之間，站點與Web 之間的鏈接關系。它可以使站點內的網(wǎng)頁成為有機的整體，還可以使不同站點之間建立聯(lián)絡。超級鏈接由兩部

12、分組成：鏈接載體(源端點)和鏈接目的目的端點。l一個完好的主頁是由多網(wǎng)頁文檔構成的，這些網(wǎng)頁文檔是分別獨立的，而將這些獨立的網(wǎng)頁文檔聯(lián)絡起來的組帶，就是超級鏈接。超級鏈接的目的可以是另外一個網(wǎng)頁，頁可以是同一網(wǎng)頁的不同位置。超級鏈接l1.什么是URLl URL 中文翻譯為一致資源定位器。URL 是Internet 上用來描畫信息資源的字符串。一個URL 分為3 個部分：協(xié)議代碼，裝由所需文件的計算機地址和主機資源的詳細位置。lschemehost:post/path/filenamelscheme 指的是http,ftp,file,mailto,news,gopher,telnet 七種lho

13、st 指的是IP 地址或計算機稱號lpost 指的是效力器端口lpath 指的是文件途徑lfilename 指的是文件名l:80/index.php超級鏈接l途徑途徑l 創(chuàng)建超級鏈接時必需了解鏈接與被鏈接的途徑。創(chuàng)建超級鏈接時必需了解鏈接與被鏈接的途徑。在一個網(wǎng)站中，途徑通常由在一個網(wǎng)站中，途徑通常由3 種表達方式：絕對種表達方式：絕對途徑，根目錄相對途徑，文檔目錄相對途徑。途徑，根目錄相對途徑，文檔目錄相對途徑。l(1) 絕對途徑絕對途徑: 163 cwindows/index.html(2) 根目錄相對途徑：根目錄相對途徑： /web/index.html(3) 文檔目錄相對途徑：文檔目錄

14、相對途徑：index.htm超級鏈接創(chuàng)建各種超鏈接創(chuàng)建各種超鏈接(1).網(wǎng)頁與網(wǎng)頁的銜接。網(wǎng)頁與網(wǎng)頁的銜接。(2).與互鏈網(wǎng)鏈接與互鏈網(wǎng)鏈接(3).電子郵件鏈接電子郵件鏈接(7).FTP 鏈接鏈接(4).創(chuàng)建空鏈接創(chuàng)建空鏈接(5).下載鏈接下載鏈接(6).錨記鏈接錨記鏈接表單l表單由兩個重要組成部分組成：一時描畫表單的HTML 源代碼；二時用于處置用戶在表單中輸入信息的效力器運用程序客戶端腳本，如JSP，ASP 等。下面主要向大家引見了表單的運用，希望讀者經(jīng)過對內容的學習，了解表單的組成，掌握表單與表單對象的創(chuàng)建。表單l1 表單的創(chuàng)建及修正l(1).執(zhí)行插入-表單或者表單快捷面板l(2).修正表單表單l2創(chuàng)建表單對象創(chuàng)建表單對象lDreamweaver 表單可以包括規(guī)范表單對象。表單可以包括規(guī)范表單對象。Dreamweaver 中的表單對象有文本域，文本中的表單對象有文本域，文本l區(qū)域，輸入框，按紐，圖象域，復選框，跳轉彩單等等。區(qū)域，輸入框，按紐，圖象域，復選框，跳轉彩單等等。l在創(chuàng)建表單之前，必需創(chuàng)建表單區(qū)域，將一切的表單對在創(chuàng)建表單之前，必需創(chuàng)建表單區(qū)域，將一切的表單對象放入其中象放入其中l(wèi)(1).文本域插入文本域文本域插入文本域l(2).插入多行文本域插入多行文本域l(