第一篇:數字媒體中網頁設計原則與制作技巧分析論文
在我國經濟與社會快速發展的今天,數字媒體作為一種新興工具,已經與我國網絡緊密的結合在一定,這種結合使得數字媒體本身與與我國民眾生活之間的聯系日漸緊密,而為了保證數字媒體能夠更好的為我國民眾提供服務,本文就數字媒體中的網頁設計原則與制作技巧進行了具體研究,希望這一研究能夠在一定程度上推動我國數字媒體網頁設計的相關發展。
前言:
得益于計算機與智能手機的普及,我國網民數量已達7億,而這一龐大的網民人口則標志著網絡與我國民眾生活之間聯系的日漸緊密。我國當下數字媒體的發展速度不斷提升,其本身也開始真正融入我國各行各業之中,但數字媒體本身在發展中也暴露出了一些問題,而本文就數字媒體中網頁設計原則與制作技巧展開的研究目的,正是為了解決其中一部分問題。
1.數字媒體概述
為了能夠較好的完成本文就數字媒體中網頁設計原則與制作技巧展開的研究,我們首先就需要對數字媒體進行深入了解。結合相關文獻資料與筆者自身對數字媒體的認知,本文將數字媒體定義為利用二進制數據處理和記錄,采取數字通信的原理,收集、存儲、傳輸各種矢量數字文本的過程,簡單的說數字媒體就是一種圖形、圖像、視頻、聲音、動畫等信息的載體與平臺。對于數字媒體來說,其本身具備著高效相互性、靈活多變性以及強大融合性等三方面的特點,這些特點也是其能夠較好發揮自身功能的原因所在。具體來說,高效相互性指的是數字媒體能夠通過自身的載體與平臺特性,使信息變為可感、可知、可管、可交互的狀態,這就使得信息的傳播的過程中能夠較好的實現作者與受眾的交流網絡影視、網絡游戲等都屬于這一特點的具體表現;而在靈活多變性這一特點中,這一特點使得數字媒體能夠將聲音、圖片、視頻、音頻、文字等創作要素進行較好的改變,這樣相關信息就能夠實現更好的創造;而在強大融合性這一特點中,這一特點使得數字媒體本身能夠與各類藝術方式實現較好的融合,這種融合由于往往能夠發揮“1+1>2”的作用,就使得數字媒體能夠更好的滿足各類受眾的需求[1]。
2.數字媒體中網頁設計原則
上文中我們深入了解了各類數字媒體,而在下文中筆者將結合自身實際工作經驗與相關文獻資料,就數字媒體中網頁設計原則進行詳細論述,希望這一論述能夠在一定程度上為我國數字媒體的進一步發展帶來一定幫助。
2.1明確網頁主題
在數字媒體的網頁設計中,為了保證這一網頁設計能夠較好的為受眾提供服務,我們首先就需要結合網頁內容確認網頁主題,而為了實現這一目標,網頁設計人員需要進行充分的市場調查,最大程度上了解網頁受眾的情況,這樣才能夠較好的確定整個網頁的風格與主題。而在確定了網頁的主題后,設計人員還需要在設計的過程中保證網頁本身的鮮明突出、要點明確,最終實現通過簡單的網頁頁面傳達不簡單的信息這一追求。值得注意的是,網頁還需要最大程度上保證自身的即時性,這樣才能夠更好的實現信息的傳達[2]。
2.2結合受眾需求
除了明確網頁主題外,網頁設計人員在進行數字媒體的網頁設計過程中,還需要細致了解網頁受眾人群的性別、年齡、職業以及受教育程度、生活習俗等方面的分布,并以此更好的結合網頁向受眾傳達某種情感,這樣就能夠更好的提高數字媒體中網頁信息的傳播效率。例如,對網頁受眾年齡的把握,使得設計人員能夠更好的抓住網頁設計的側重點,這樣就能夠保證該網頁設計傳達的信息更具備針對性,這自然就大大提高了網頁本身信息的傳達效率。值得注意的是,我們還需要在網頁設計中參考受眾的接受與理解信息的態度、愿望、需求以及情感等心理因素,這樣才能夠更好的為其提供服務[3]。
2.3保證風格統一
除了上述兩方面的原則外,設計人員還必須保證數字媒體中網頁設計的風格統一。具體來說,據筆者調查發現,我國當下很多數字媒體中的網頁設計存在著文字設計影響網頁質量、色彩運用與搭配影響網頁主題風格、圖片選用不合理等一系列問題,這些問題歸根結底屬于網頁設計中風格出現的問題,而這一問題也對數字媒體中網頁設計帶來了種種負面影響,為此設計人員必須在文字選擇、色彩搭配、圖片選用等方面注意保持整個網頁的風格統一,這樣才能夠更好的保證數字媒體中網頁設計的整體質量[4]。
3.數字媒體中網頁制作技巧
3.1首頁設計技巧
在數字媒體中的網頁設計中,網站的首頁一般存在形象展示型與信息羅列型兩種,一般來說信息羅列型較為適用于大、中型網站,也是我國當下最為主流的網站首頁設計選擇。在形象展示型的網站首頁設計中,設計人員需要在突出網站本身形象的同時向受眾傳達相關形象與氣氛;而在信息羅列型的網站首頁設計中,設計人員需要結合自身信息傳播特點,合理選擇“國”字、拐角、標題正文、左右框架、上下框架、封面、變化等型號的版面布局方式,這樣才能夠實現相關信息的較好傳達。
3.2風格統一技巧
上文中筆者提到了數字媒體中網頁設計必須遵循風格統一這一原則,而為了真正實現這一風格的統一,設計人員就需要從網頁設計的結構、色彩、導航欄等三個方面實現這一風格統一。具體來說,在網頁設計的結構統一中,設計人員需要保證整個網站除特殊網頁外,在網站布局、文字排版、裝飾性元素出現的位置、圖片的位置等方面呈現較高的統一性;而在色彩的統一中,設計人員需要盡量保證網站的主體色彩一致,并只在有需求的時候改變網站的部分色塊;而在導航欄的統一中,導航欄的位置與背景必須在大小、明暗、位置等方面實現統一,這樣才能夠較好的提高網站本身的特點,使更多的受眾對該網站產生深刻印象。
結論:
在本文就數字媒體中網頁設計原則與制作技巧展開的研究中,筆者詳細論述了數字媒體的概念、網頁設計的原則以及網頁的制作技巧,雖然受限于篇幅原因本文并未對數字媒體中網頁設計進行較為深入的研究,但還是希望本文論述的內容能夠在一定程度上推動我國數字媒體的相關發展。
引用:
[1]楊旭蘭.色彩在網頁設計中的應用研究[D].南京林業大學,2009.[2]張燕.多媒體素材的無障礙設計研究[D].浙江師范大學,2009.[3]黃曉乾,陳超.網頁設計原則與制作技巧[J].中國科技信息,2010,07:95-96.[4]鬲波飛.網絡媒體的視覺傳達設計研究[D].湖南大學,2002.
第二篇:網頁設計與制作-論文(本站推薦)
第一章
緒論
摘 要
本論文將對個人網頁設計與制作的方法、工具等展開研究和探討。在介紹網頁設計與制作語言的基礎上,著重使用JavaScript作為工具語言進行網頁設計與制作的實際操作,分別對基于對象的JavaScript語言、內部對象系統的使用及WEB頁面信息交互——窗口和框架進行詳細描述,并利用具體的實例進行驗證。
本論文主要章節如下,第一章:緒論,本章主要介紹網頁設計的相關知識。第二章:網頁設計語言概述,本章主要介紹網頁設計的語言——HTML,以及用于編輯HTML語言的軟件,為后續工作奠定基礎。第三章:基于對象的JavaScript語言,本章介紹了基于對象的JavaScript中常用內部對象屬性、方法的使用。第四章:內部對象系統的使用,本章主要介紹使用瀏覽器的內部對象系統,可實現與HTML文檔進行交互。第五章:WEB頁面信息的交互——窗體與框架,本章主要介紹實現網頁的動態交互,必須掌握有關窗體對象(Form)和框架對象(Frames)更為復雜的知識。
關鍵詞: 網頁制作;網頁設計;HTML;ASP
第一章
緒論
第一章 緒論
隨著21世紀的到來,人們更深切地感受到計算機在生活和工作中的作用越來越重要,越來越來的職業需要具有計算機的應用技能。掌握計算機是職業的需要,更是事業發展的需要。網頁設計與制作是計算機能力的具體表現,本章主要介紹網頁設計的相關知識。
1.1 網頁設計概述
網站是企業向用戶和網民提供信息(包括產品和服務)的一種方式,是企業開展電子商務的基礎設施和信息平臺,離開網站(或者只是利用第三方網站)去談電子商務是不可能的。企業的網址被稱為“網絡商標”,也是企業無形資產的組成部分,而網站是INTERNET上宣傳和反映企業形象和文化的重要窗口。
1.2 網頁設計的要素
網頁設計的兩大要素是:整體風格和色彩搭配。
一、確定網站的整體風格
在這里,我提供給大家一些參考經驗:
1.將你的標志logo,盡可能的放在每個頁面上最突出的位置。2.突出你的標準色彩。
3.總結一句能反映貴站精髓的宣傳標語!
4.相同類型的圖像采用相同效果,比如說標題字都采用陰影效果,那么在網站中出現的所有標題字的陰影效果的設置應該是完全一致的!
二、網頁色彩的搭配
1.用一種色彩。這里是指先選定一種色彩,然后調整透明度或者飽和度,這樣的頁面看起來色彩統一,有層次感。
2.用兩種色彩。先選定一種色彩,然后選擇它的對比色。
3.用一個色系。簡單的說就是用一個感覺的色彩,例如淡藍,淡黃,淡綠;或者土黃,土灰,土藍。
1.3 大作業目的和意義
本大作業主要是對網頁設計與制作的語言基礎上進行探討,主要內容如下:通過已經做好的網頁,分析html網頁設計技術、XML技術、Java Applet技術和Javascript技術在網頁設計中的應用。
第一章
緒論
1.4 要分析的網頁
第一章
緒論
第一章
緒論
第二章
HTML網頁設計技術的應用
第二章 HTML網頁設計技術的應用
2.1 HTML語言介紹
HTML(HyperText Mark-up Language)即超文本標記語言或超文本鏈接標示語言,是目前網絡上應用最為廣泛的語言,也是構成網頁文檔的主要語言。
HTML文本是由HTML命令組成的描述性文本,HTML命令可以說明文字、圖形、動畫、聲音、表格、鏈接等。HTML的結構包括頭部(Head)、主體(Body)兩大部分,其中頭部描述瀏覽器所需的信息,而主體則包含所要說明的具體內容。
2.1.1 HTML語言的特點
HTML文檔制作不是很復雜,且功能強大,支持不同數據格式的文件鑲入,這也是WWW盛行的原因之一,HTML語言的特點如下:
1、簡易性,HTML版本升級采用超集方式,從而更加靈活方便。
2、可擴展性,HTML語言的廣泛應用帶來了加強功能,增加標識符等要求,HTML采取子類元素的方式,為系統擴展帶來保證。
3、平臺無關性。雖然PC機大行其道,但使用MAC等其他機器的大有人在,HTML可以使用在廣泛的平臺上,這也是WWW盛行的另一個原因。
2.1.2 HTML語言的編輯軟件
HTML的本質是文本,需要瀏覽器的解釋,HTML的編輯器大體可以分為三種:
1、基本編輯軟件,使用WINDOWS自帶的記事本或寫字版都可以編寫,當然,如果你用WPS來編寫,也可以。不過存盤時請使用.htm或.html作為擴展名,這樣瀏覽器就可以解釋執行了。
2、半所見即所得軟件,這種軟件能大大提高開發效率,它可以使你在很短的時間內做出Homepage,且可以學習HTML,這種類型的軟件主要有HOTDOG,還有國產的軟件網頁作坊。
3、所見即所得軟件,使用最廣泛的編輯器,完全可以一點不懂HTML的知識就可以做出網頁,這類軟件主要有Frontpage,DREAMWEAVER、Delphi、Eclipse、UltraEdit。
2.1.4 html語言在網頁設計中的應用
第二章
HTML網頁設計技術的應用
2.2.3JavaScript技術在網頁設計中應用
一、JavaScript概述
JavaScript是一種基于對象(Object)和事件驅動(Event Driven)并具有安全性能的腳本語言。使用它的目的是與HTML超文本標記語言、Java 腳本語言(Java小程序)一起實現在一個Web頁面中鏈接多個對象,與Web客戶交互作用。從而可以開發客戶端的應用程序等。它是通過嵌入或調入在標準的HTML語言中實現的。它的出現彌補了HTML語言的缺陷,它是Java與HTML折衷的選擇,具有以下幾個基本特點:
1、是一種腳本編寫語言
JavaScript是一種腳本語言,它采用小程序段的方式實現編程。像其它腳本語言一樣,JavaScript同樣已是一種解釋性語言,它提供了一個易的開發過程。
它的基本結構形式與C、C++、VB、Delphi十分類似。但它不像這些語言一樣,需要先編譯,而是在程序運行過程中被逐行地解釋。它與HTML標識結合在一起,從而方便用戶的使用操作。
2、基于對象的語言。
JavaScript是一種基于對象的語言,同時以可以看作一種面向對象的。這意味著它能運用自己已經創建的對象。因此,許多功能可以來自于腳本環境中對象的方法與腳本的相互作用。
3、簡單性
JavaScript的簡單性主要體現在:首先它是一種基于Java基本語句和控制流之上的簡單而緊湊的設計, 從而對于學習Java是一種非常好的過渡。其次它的變量類型是采用弱類型,并未使用嚴格的數據類型。
4、安全性
JavaScript是一種安全性語言,它不允許訪問本地的硬盤,并不能將數據存入到服務器上,不允許對網絡文檔進行修改和刪除,只能通過瀏覽器實現信息瀏覽或動態交互。從而有效地防止數據的丟失。
5、動態性的
JavaScript是動態的,它可以直接對用戶或客戶輸入做出響應,無須經過Web服務程序。它對用戶的反映響應,是采用以事件驅動的方式進行的。所謂事件驅動,就是指在主頁(Home Page)中執行了某種操作所產生的動作,就稱為“事件”(Event)。比如按下鼠標、移動窗口、選擇菜單等都可以視為事件。當事件發生后,可能會引起相應的事件響應。
6、跨平臺性
JavaScript是依賴于瀏覽器本身,與操作環境無關,只要能運行瀏覽器的計算機,并支持JavaScript的瀏覽器就可正確執行。從而實現了“編寫一次,走遍天下”的夢想。
實際上JavaScript最杰出之處在于可以用很小的程序做大量的事。無須有高性能的電腦,軟件僅需一個字處理軟件及一瀏覽器,無須WEB服務器通道,通過自己的電腦即可完成所有的事情。
總之,JavaScript 是一種新的描述語言,它可以被箝入到 HTML 的文件之中。JavaScript語言可以做到回應使用者的需求事件(如:form的輸入),而不用任何的網路來回傳輸資料,所以當一位使用者輸入一項資料時,它不用經過傳給伺服端(server)處理,再傳回來的過程,而直接可以被客戶端(client)的應用程式所處理。
第二章
HTML網頁設計技術的應用
第五章
色彩在網頁中的應用
第五章 色彩在網頁中的應用
5.1色彩在網頁中的應用
色彩是藝術表現的要素之一。在網頁設計中,我們的設計師根據和諧、均衡和重點突出的原則,將不同的色彩進行組合.搭配來構成美麗的頁面。根據色彩對人們心理的影響,合理地加以運用。
先選定一種色彩,然后調整透明度或者飽和度,這樣的頁面看起來色彩統一,有層次感。簡單的說就是用一個感覺的色彩,例如淡藍,淡黃,淡綠;或者土黃,土灰,土藍。
在網頁配色中不要將所有顏色都用到,盡量控制在三至五種色彩以內。背景和前文的對比盡量要大以便突出主要文字內容。
5.2主頁色彩的處理
色彩是人的視覺最敏感的東西。主頁的色彩處理得好,可以錦上添花,達到事半功倍的效果。色彩總的應用原則應該是“總體協調,局部對比”,也就是:主頁的整體色彩效果應該是和諧的,只有局部的、小范圍的地方可以有一些強烈色彩的對比。在色彩的運用上,可以根據主頁內容的需要,分別采用不同的主色調。因為色彩具有象征性,例如:嫩綠色、翠綠色、金黃色、灰褐色就可以分別象征著春、夏、秋、冬。其次還有職業的標志色,例如:軍警的橄欖綠,醫療衛生的白色等。色彩還具有明顯的心理感覺,例如冷、暖的感覺,進、退的效果等。另外,色彩還有民族性,各個民族由于環境、文化、傳統等因素的影響,對于色彩的喜好也存在著較大的差異。充分運用色彩的這些特性,可以使我們的主頁具有深刻的藝術內涵,從而提升主頁的文化品位。
5.3常用的配色方案
1.暖色調。即紅色、橙色、黃色、赭色等色彩的搭配。這種色調的運用,可使主頁呈現溫馨、和煦、熱情的氛圍。
2.冷色調。即青色、綠色、紫色等色彩的搭配。這種色調的運用,可使主頁呈現寧靜、清涼、高雅的氛圍。
3.對比色調。即把色性完全相反的色彩搭配在同一個空間里。例如:紅與綠、黃與紫、橙與藍等。這種色彩的搭配,可以產生強烈的視覺效果,給人亮麗、鮮艷、喜慶的感覺。
第五章
色彩在網頁中的應用
最后,還要考慮主頁底色(背景色)的深、淺,這里借用攝影中的一個術語,就是“高調”和“低調”。底色淺的稱為高調;底色深的稱為低調。底色深,文字的顏色就要淺,以深色的背景襯托淺色的內容(文字或圖片);反之,底色淡的,文字的顏色就要深些,以淺色的背景襯托深色的內容(文字或圖片)。這種深淺的變化在色彩學中稱為“明度變化”。當然,色彩的明度也不能變化太大,否則屏幕上的亮度反差太強,同樣也會使讀者的眼睛受不了。
5.4合理搭配網頁色彩
網頁的色彩是樹立網站形象的關鍵之一,網頁的背景、文字、圖標、邊框、超鏈接等都要用到色彩。不同的色彩會使瀏覽者有不同的心理感受。合理的搭配色彩,會更好的表現主題,吸引用戶的注意力。網頁色彩涉及到藝術知識,讓美術教師參加網頁色彩設計,可能會出現比較理想的效果。在色彩搭配上要注意色彩的鮮明性、獨特性、合適性、聯想性。背景色和前景色對比要大,以突出主要內容
網站給人的第一印象來自視覺沖擊,不同的色彩搭配產生不同的效果,并可能影響到訪問者的情緒。“標準色彩”是指能體現網站形象和延伸內涵的色彩,要用于網站的標志,標題,主菜單和主色塊。給人以整體統一的感覺。至于其它色彩也可以使用,但應當只是作為點綴和襯托,絕不能喧賓奪主。一般來說,一個網站的標準色彩不超過3種,太多則讓人眼花繚亂。適合于網頁標準色的顏色有:藍色,黃/橙色,黑/灰/白色三大系列色。
第五章
色彩在網頁中的應用
第六章 WEB頁面信息的交互——窗體與框架
要實現網頁的動態交互,必須掌握有關窗體對象(Form)和框架對象(Frames)更為復雜的知識。
6.1窗體基礎知識
窗體對象可以使設計人員能用窗體中不同的元素與客戶機用戶相交互,而用不著在之前首先進行數據輸入,就可以實現動態改變Web文檔的行為。
6.1.1窗體對象
窗體(Form):它構成了Web頁面的基本元素。通常一個Web頁面有一個窗體或幾個窗體,使用Forms[]數組來實現不同窗體的訪問。
在Forms[0]中共有三個基本元素,而Forms[1]中只有兩個元素。窗體對象最主要的功能就是能夠直接訪問HTML文檔中的窗體,它封裝了相關的HTML代碼:
6.1.2 窗體對象的方法窗體對象的方法只有一個--submit()方法,該方法主要功用就是實現窗體信息的提交。如提交Mytest窗體,則使用下列格式:
document.mytest.submit()
第五章
色彩在網頁中的應用
6.1.3 窗體對象的屬性
窗體對象中的屬性主要包括以下:elements name action target encoding method。除Elements外,其它幾個均反映了窗體中標識中相應屬性的狀態,這通常是單個窗體標識;而elements常常是多個窗體元素值的數組,例:
elements[0].Mytable.elements[1] 6.1.4 訪問窗體對象
在JavaScript中訪問窗體對象可由兩種方法實現:(1)通過訪問窗體
在窗體對象的屬性中首先必須指定其窗體名,而后就可以通過下列標識訪問窗體如:document.Mytable()。
(2)通過數組來訪問窗體
除了使用窗體名來訪問窗體外,還可以使用窗體對象數組來訪問窗體對象。但需要注意一點,因窗體對象是由瀏覽器環境的提供的,而瀏覽器環境所提供的數組下標是由0到n。所以可通過下列格式實現窗體對象的訪問:
document.forms[0] document.forms[1] document.forms[2]...6.1.5 引用窗體的先決條件
在JavaScript中要對窗體引用的條件是:必須先在頁面中用標識創建窗體,并將定義窗體部分放在引用之前。
6.2 窗體中的基本元素
窗體中的基本元素由按鈕、單選按鈕、復選按鈕、提交按鈕、重置按鈕、文本框等組成。
在JavaScript中要訪問這些基本元素,必須通過對應特定的窗體元素的數組下標或窗體元素名來實現。每一個元素主要是通過該元素的屬性或方法來引用。其引用的基本格式見下:
formName.elements[].methadName(窗體名.元素名或數組.方法)formName.elemaent[].propertyName(窗體名.元素名或數組.屬性)下面分別介紹:
(1)Text單行單列輸入元素
功能:對Text標識中的元素實施有效的控制。基本屬性:
Name:設定提交信息時的信息名稱。對應于HTML文檔中的Name。Value:用以設定出現在窗口中對應HTML文檔中Value的信息。defaultvalue:包括Text元素的默認值 基本方法:
blur():將當前焦點移到后臺。
第五章
色彩在網頁中的應用
select():加亮文字。主要事件:
onFocus:當Text獲得焦點時,產生該事件。OnBlur:從元素失去焦點時,產生該事件。Onselect:當文字被加亮顯示后,產生該文件。onchange:當Text元素值改變時,產生該文件。例:
...(2)textarea多行多列輸入元素功能:實施對Textarea中的元素進行控制。基本屬性
name:設定提交信息時的信息名稱,對應HTML文檔Textarea的Name。Value:用以設定出現在窗口中對應HTML文檔中Value的信息。Default value:元素的默認值。方法:
blur():將輸入焦點失去 select():將文字加亮后 事件:
onBlur:當失去輸入焦點后產生該事件 onFocus:當輸入獲得焦點后,產生該文件 Onchange:當文字值改變時,產生該事件 Onselect:當文字加亮后,產生該文件(3)Select選擇元素
功能:實施對滾動選擇元素的控制。屬性:
name:設定提交信息時的信息名稱,對應文檔select中的name。Length:對應文檔select中的length options:組成多個選項的數組 selectIndex;該下標指明一個選項
select在中每一選項都含有以下屬性: Text:選項對應的文字
selected:指明當前選項是否被選中 Index:指明當前選項的位置 defaultselected:默認選項 事件:
第五章
色彩在網頁中的應用
OnBlur:當select選項失去焦點時,產生該文件。onFocas:當select獲得焦點時,產生該文件。Onchange:選項狀態改變后,產生該事件。(4)Button按鈕
功能:實施對Button按鈕的控制。屬性:
Name:設定提交信息時的信息名稱,對應文檔中button的Name。Value:用以設定出現在窗口中對應HTML文檔中Value的信息。方法:
click()該方法類似于一個按下的按鈕。事件:
onclick當單擊button按鈕時,產生該事件。例 :
........(5)checkbox檢查框功能:實施對一個具有復選框中元素的控制。屬性:
name:設定提交信息時的信息名稱。
Value:用以設定出現在窗口中對應HTML文檔中Value的信息。Checked:該屬性指明框的狀態true/false.defauitchecked:默認狀態 方法:
click()該方法使得框的某一個項被選中。事件:
Onclick:當框的選被選中時,產生該事件。(6)radio無線按鈕
功能:實施對一個具單選功能的無線按鈕控制。屬性:
Name:設定提交信息時的信息名稱,對應HTML文檔中的radio的name相同 Value:用以設定出現在窗口中對應HTML文檔中Value的信息,對應HTML文檔中的radio的name。
length:單選按鈕中的按鈕數目。defalechecked:默認按鈕。
checked:指明選中還是沒有選中。
第五章
色彩在網頁中的應用
index:選中的按鈕的位置。方法:
chick():選定一個按鈕。事件:
onclick:單擊按鈕時,產生該事件。(7)hidden:隱藏
功能:實施對一個具有不顯示文字并能輸入字符的區域元素的控制。屬性:
name:設定提交信息時的信息名稱,對應HTML文檔的hidden中的Name。
Value:用以設定出現在窗口中對應HTML文檔中Value的信息,對應HTML文檔hidden中的value。
defaleitvalue:默認值(8)Password口令
功能:實施對具有口令輸入的元素的控制。屬性:
Name:設定提交信息時的信息名稱,對應HTML文檔中password中的name。Value:用以設定出現在窗口中對應HTML文檔中Value的信息,對應HTML文檔中password中的Value。
defaultvalu:默認值 方法:
select():加亮輸入口令域。
blur():使這丟失passward輸入焦點。focus():獲得password輸入焦點。(9)submit提交元素
功能:實施對一個具有提交功能按鈕的控制。屬性:
name:設定提交信息時的信息名稱,對應HTML文檔中submit。
Value:用以設定出現在窗口中對應HTML文檔中Value的信息,對應HTML文檔中value。
方法
click()相當于按下submit按鈕。事件:
onclick()當按下該按鈕時,產生該事件。
6.3窗體對象實例
下面我們演示通過點擊一個按鈕(red)來改變窗口顏色,點擊“調用動態按鈕文檔”調用一個動態按鈕文檔。
test8_1.htm
調用動態按鈕文檔第三篇:網頁設計與制作課程學習論文
《網頁設計與制作》課程學習論文
作為一個二十一世紀的大學生,學習如何設計與制作網頁變為一個必不可少的過程。經過這幾個星期的學習,我開始對網頁設計與制作有了初步的認識,并且學習了一些網頁設計與制作的基礎。隨著時代的發展,網站建設越來越接近于一門藝術而不僅僅是一門技術。網站設計日有必要的益被重視,學習網頁設計與制作這門學科是非常。
作為網頁設計的初學者,我對網頁設計非常感興趣,一心想設計出一個美觀、實用、內容豐富的個人網頁。我通過自己動手、動腦,通過網絡資源,老師的指導,在不斷發現問題和解決問題的過程中學到了很多知識,也增強了我的創作能力和動手能力,在網頁設計過程中,從構思到設計、完善、維護,整個過程我都全身心投入,使我真正學到了網頁設計的知識。
互聯網成為人們快速獲取、發布和傳遞信息的重要渠道,它在人們政治、經濟、生活等各個方面發揮著重要的作用。網頁設計伴隨著網絡的快速發展而快速興起,作為上網的主要依托,由于人們使用網絡的頻繁而變得非常的重要。網頁講究的是排版布局,其功能主要就是提供一種形式給每個上網者,讓他們能夠了解網站提供的信息。
網頁設計與制作包含視聽元素于版式設計兩項內容,以主題鮮明、形式與內容統一、強調整體為設計原則,具有互交性與持續性、綜合性、版式的不可以控性、藝術與技術的結合的緊密型等特點。美和功能都是為了表達網站的主題。我認為在一個網站中,最重要的頁面當屬主頁,所以在此以主頁為例,說明在網頁制作中版面設計的問題。從版面設計來講,一個有特色的主頁,必須包含有四個要素:文字,圖片,排列方式和主色調,這四者相輔相成,缺一不可。圖片要素
要設計出漂亮的主頁,首先要成為計算機圖形高手,僅這一點就可以讓初學者花上一年半載的時間。排列方法要素,主頁的第二個要素是排列方法,即網頁布局。色彩在網頁所占比重很大。有了合理清新的色調,會彌補主頁上的其它不足。頁面的色彩搭配是與網站的主題分不開的,一個網站必須有一種或兩種主題色。不至于讓瀏覽者迷失方向,也不至于單調乏味。一般來說,頁面的主體文字應盡量使用黑色等較深的顏色,與背景對比明顯,按鈕、邊框等使用彩色。例如教育類網站使用藍色為主題色,再用紅色和黑色作為配色,就能表達出嚴肅、穩重的效果。網頁作為一種版面,既有文字,又有圖片;文字有大有小,還有標題和正文之分;圖片頁有大小而且有橫豎之別。圖片和文字都需要同時展示給觀眾,不能簡單地將其羅列在一個頁面上,否則會搞得雜亂無章。關于具體的網頁布局,常見的有“國”字型、拐角型、標題正文型、左右框架型、上下框架型、綜合框架型、封面型、Flash型、變化型等,關于它們,在網頁設計的相關書籍中或者在網絡上都可以看到詳細的敘述
網頁作為傳播信息的一種載體,同其他出版物如報紙、雜志等在設計上有許多共同之處,也要遵循一些設計的基本原則。但是,由于表現形式、運行方式和社會功能的不同,網頁設計又有其自身的特殊規律。網頁的藝術設計,是技術與藝術的結合,內容與形式的統一。一般的來說,絕大多數普通受眾圖形,插件,applets和其它有關的高級Web瀏覽器特性。對我們來說,頁面的實用可能比漂亮更重要,對于用戶來說,沒有什么比頁面能夠快速下載更重要了,簡而言之,精簡你的站點,這是一條最佳的捷徑。就站點設計而言,的確能夠通過成功的圖形設計招徠或者丟失訪問者。并非所有的訪問者可以完全看到圖片,某些人為了加快存取網絡的速度已經關閉了瀏覽器端的圖形。簡而言之,圖形并不能正確的在客戶端加載。然而,圖形經常被用來作為導航按鈕。使用可以把一個瀏覽器分成幾個不同的窗口,對于站點的結構的把握是一個不錯的方法。但是,你還是必須知道,還是有人在使用不支持幀的瀏覽器。在你開始打算設計一個幀的時候,你該仔細的考慮考慮你是否的確真的需要。經常,你這樣的需求可以通過表格來組織站點的結構。網頁設計涉及到對多種軟件、多種知識的學習和應用,以及個人的審美觀等等。所以要想制作出漂亮的網頁,需要一個逐步學習和經驗積累的過程。
隨著互聯網的不斷發展和中國網絡人口的日益增長,建立個人網站,不但可以很好的展示自己,而且可以提高自己在計算機應用方面的能力。個人在設計時考慮的多為個人的興趣喜好,而不注重商業的展示。內容以反映個人為中心,從而使個人網站真正的成為展示自己的網絡名片。一張完美的主頁設計需要積累豐富的知識以及掌握大量的技巧。
由于平時課程比較繁忙,學習時間比較少,對于網頁設計軟件的強大功能運用得還不夠。不知不覺網頁設計的課程將要結束了,這門課程所包含內容的豐富是讓我從沒有想到的。在整個的學習過程中,我學習了Flash、Fireworks、Html語言、IIS、網站建設的基本思想等重要內容。在網頁設計過程中,由于沒有網頁制作代碼的知識,所以在設計時也遇到了很多麻煩,有時插入一個特效腳本也是很麻煩。在網頁制作過程中,想提高設計水平,想有個理想的網頁,必須學會代碼的運用,我將在以后的學習過程中不斷加強這方面的學習,希望老師能簡單介紹一下代碼,讓我也對它有個初步的認識,以后再加強學習也才會有所提高。
總體來說,通過今次的對網頁設計的學習,有收獲也有遺憾、不足的地方,但我想,我已經邁入了網頁設計的大門,只要我再認真努力的去學習,去提高,憑借我對網頁設計的熱情和執著,我將來設計出的網頁會更加專業,更完善。也希望老師在今后的日子里多指導。網頁設計還有更多的技巧,有待于我們去挖掘和研究。
第四篇:網頁設計與制作簡答題
1、簡述Web瀏覽器打開一個Web文件的工作過程。
2、描述網頁設計的一般步驟。
3、簡述網頁設計的基本準則。
4、簡述規劃網站目錄結構時應遵循的原則。
5、描述版面布局的步驟。
6、什么是“HTML”?HTML“標記”又是什么?
7、簡述“HTML”文檔的基本結構。
8、簡述以下一段HTML代碼中各對標記的作用。〈html〉
〈head〉
〈title〉網頁設計〈/title〉 〈/head〉
〈body〉
〈h2〉北國風光〈/h2〉
〈/body〉 〈/html〉
9、如何進行本地網頁的測試?
10、網站管理和維護的主要工作有哪些?
11、什么是Web瀏覽器?
12、簡述網頁設計中所需要注意的通用規則。
13、簡述DHTML的概念及主要組成。
14、簡述使用FrontPage在網頁中插入一個日歷的過程。
15、簡述色彩的三原色的概念及每種顏色的調配范圍。
16、為什么要采用DHTML技術?客戶端動態網頁技術有哪些優點?
17、網站欄目劃分的原則是什么?
18、XML與HTML相比的主要優點有哪些?
19、請簡述一下網站的設計流程?
20、簡述FireWorks的特點。
21、網頁制作的步驟是什么?
22、怎樣讓鏈接沒有下劃線?
23、怎樣在網頁中加入多媒體播放?
24、怎樣讓網頁的背景圖像不滾動?
25、怎樣定義網頁的關鍵字?
26、什么是Web瀏覽器?
27、網頁上所說的重心平衡指的是什么?
28、什么是DHTML?DHTML技術主要由哪幾部分組成?
29、在CSS中,對字體的的設置所涉及到的屬性有哪些?
30、用HTML語言回答一個HTML文件應具有的基本結構。
31、比較GIF格式和JPG格式的原理與各自的適用范圍。
32、為什么要采用DHTML技術?客戶端動態網頁技術有哪些優點?
33、簡述站點的概念以及虛擬目錄和實際目錄之間的對應關系。
34、什么是Web安全色?
35、簡述虛擬主機的概念和功能。
36、簡述Dreamweaver的工作窗口由哪些部分組成。
37、在Dreamweaver中,插入圖像的方法有哪些?
38、在Fireworks中,如何使文字附加于路徑?
39、在Flash MX中可以創建哪些類型的元件?各元件的含義是什么?
40、HTML中
標記和
標記有何區別?
41、簡述在網頁中插入背景音樂的方法。
42、怎樣在網頁中插入Flash影片?
43、簡述設計Web站點的一般步驟。
44、簡要說明html的基本工作原理。
45、簡要說明表格與框架布局的區別。
46、舉例說明在網頁中使用CSS樣式表的三種方式(都使用對p標記符應用color屬性為例),并簡要分析各自的特點。
47、簡要說明使用網頁圖像時應注意的問題
48、簡要回答選擇符的作用及分類。
49、XML的主要特征有哪些?
50、FrontPage的主要功能有哪些?
51、簡答HTML文件的基本標記組成。
52、簡答Java與JavaScript的主要區別。
53、簡述網站的開發流程。(10分)
54、簡述靜態網頁的執行過程。(7分)
55、簡述在Dreamweaver MX中制作以插件方式播放音樂的頁面的步驟。
56、簡述網頁制作有哪些基本流程。
57、在Dreamweaver MX中,目標端點的鏈接有哪幾種?
58、簡述在Fireworks中,可以做哪幾個方面的環境設置。
59、在Flash MX中,幀有哪幾種類型?各自的含義是什么?
參考答案:
1、簡述Web瀏覽器打開一個Web文件的工作過程。
1)
Web瀏覽器向服務器發出頁面請求
2)
服務器接收頁面請求,并將搜索到的頁面發給Web瀏覽器
3)
Web瀏覽器接收并顯示頁面
2、描述網頁設計的一般步驟。
1)
設計主題
2)
設計網頁的總體結構
3)
資料的收集和整理
4)
選擇網頁的設計方法
5)
注意一些基本問題,如:標題要簡明、圖片最好加說明等
3、簡述網頁設計的基本準則。
需要遵循的藝術原則主要有:
1)
對比原則
2)
協調原則
3)
平衡原則
4)
趣味原則。
還包括統一、連貫、分割、對比、和諧、易讀、易找、清晰、精選。
4、簡述規劃網站目錄結構時應遵循的原則。
在創建目錄時需要注意:
(1)不要將所有文件都存放在根目錄下。
(2)目錄層次不要太深,建議不要超過三層。
(3)不要使用過長的目錄名和盡量不要使用中文目錄名。
5、描述版面布局的步驟。
步驟:
1)
繪制網頁草圖
2)
粗略布局
3)
定案
6、什么是“HTML”?HTML“標記”又是什么?
HTML是一種建立網頁文件的語言,透過標記式指令,將影像、聲音、圖片和文字等連接起來。
在HTML中用于描述功能的符號稱為“標記”,它是用來控制文字、圖形等顯示方式的符號。
7、簡述“HTML”文檔的基本結構。
HTML網頁的基本結構。
HTML文件開始
文件頭開始
文件頭
文件頭結束
文件體開始
文件體
第五篇:網頁設計與制作教案
《網頁設計與制作教案》
教師:系部:信息技術工程系專業:計算機應用班級:計機
湄洲灣職業技術學院
2008-2009學年第一學期
唐 俊 奇
電子信息
07(1)信息07(1)08(2)
1.3 網頁中所使用的技術
1.3.1 HTML語言和XML語言
1、HTML語言
?HTML只使用SGML中很小一部分標記
?HTML語言(Hyper Text Markup Language 超文本標記語言)
?HTML是純文本的語言,其源代碼可以用各種文本編輯工具進行編輯,常用的網頁制作軟件如FrontPage、Dreamweaver等實際上是自動生成HTML源代碼的工具
2、XML語言
XML(eXtensible Markup Language)1.3.2 動態網頁
1.3.3 多媒體技術的應用 1.3.4 Web服務器端程序
1.4 制作網頁的基本方法
1.4.1 制作網頁的基本步驟
1、確定網頁的內容
2、設計網頁的組織結構
3、資料的收集與整理
4、選擇網頁的設計方法
1.4.2 制作網頁時要注意的問題
1、網頁的標題要簡潔,明確。
2、在文本中要使用水平線,以分割不同部分。
3、對重點段落要強調顯示。
4、網頁中插入的圖片要盡量的小。
5、圖形要附加文字說明,以便關閉圖像時查看。
6、網頁中引用的資料及商標(或圖標),不能侵犯版權。【課后小結】
通過學習,認識網絡、網站、網頁及相關信息,理解網頁制作的流程及了解相應開發工具,為設計網頁做準備。
第二講 HTML的基本標志與格式標志
【教學內容】
講解HTML基本標志對和格式標志。【教學目的】
使學生標志對與格式標志對的使用。【教學重點】
格式標志的使用。【教學難點】
* 使學生掌握超級鏈接標志的使用。【教學重點】
* 字體、圖片和超級鏈接標志的使用。* 網頁中特殊符號的輸入。【教學難點】
* 理解特殊符號對應的標志。* 理解img標志中屬性的意義。* 理解書簽超級鏈接的意義。【教學方式】
討論式、案例分析式、練習式。【教學參考】
1、《網頁設計與制作》楊尚森 曲宏山 賈文峰等著 電子工業出版社。
2、《WEB網站設計》Joel Sklar著 高等教育出版社。
3、《HTML網頁制作教程》材義語編著 鐵道出版社。【新課內容】
2.2 插入文字
2.2.1 劃分段落 格式
段落內容
2.2.2 插入標題文字 格式設置基準字號:
2.2.6
文本修飾
......,文字以粗體顯示。......,文字顯示為斜體。......,顯示下劃線。
...... STRIKE>,中心線貫穿文字。< EM>...... EM>,強調文字,通常用斜體。
< STRONG>...... STRONG >,特別強調的文字,通常用黑體。
2.3.2 圖片的屬性
2.4 建立超級鏈接
2.4.1 指向一個目標
1、建立超級鏈接
2、為圖片建立超級鏈接
3、鏈接到郵件和多媒體文件 鏈接到郵件
請與我聯系 2.4.2 使用錨點
?使用錨點可以使用戶在一個較長的文檔中跳轉,方便地找到要閱讀的內容。?建立錨點:
?錨點文字 ?使超級鏈接指向已定義的錨點。?文字 ?文字 2.4.3 新窗口和基準鏈接
1、打開新窗口 Target=“window-name”>開一個新窗口
2、基準鏈接
在
與 之間設定BorderColor=“#008000“ >
2.7.3 子窗口屬性設置
-2.7.4 常見的框架窗口劃分方法(1)標題和正文,分為上下兩部分(2)層次結構,分為上中下三部分
(3)目錄和標題,分為左上、左下、右三部分
(4)標題、目錄和正文,分為上、左下、右下三部分(5)嵌套目錄,分為左、右上、右下三部分 2.7.5 不支持框架的網頁