企業(yè)網(wǎng)站畢業(yè)設(shè)計(jì)論文(信息工程學(xué)院)

1、信息工程學(xué)院畢業(yè)設(shè)計(jì)（說明書）企業(yè)網(wǎng)站的設(shè)計(jì)與制作 HYPERLINK l _Toc9768 摘要： PAGEREF _Toc9768 2 HYPERLINK l _Toc12436 關(guān)鍵字： PAGEREF _Toc12436 2 HYPERLINK l _Toc26791 第一章 緒言 PAGEREF _Toc26791 3 HYPERLINK l _Toc4758 第二章 網(wǎng)站設(shè)計(jì)分析 PAGEREF _Toc4758 4 HYPERLINK l _Toc21956 2.1網(wǎng)站設(shè)計(jì)概述 PAGEREF _Toc21956 4 HYPERLINK l _Toc25337 2.2 開發(fā)工具的

2、選用及介紹 PAGEREF _Toc25337 4 HYPERLINK l _Toc10762 2.2.1 Dreamweaver8.0 PAGEREF _Toc10762 4 HYPERLINK l _Toc28663 2.2.2 Photoshop CS PAGEREF _Toc28663 5 HYPERLINK l _Toc22338 2.2.3 ASP動態(tài)網(wǎng)站腳本語言 PAGEREF _Toc22338 6 HYPERLINK l _Toc5854 2.3 關(guān)系型數(shù)據(jù)庫的選擇 PAGEREF _Toc5854 7 HYPERLINK l _Toc21885 2.3.1 Microsof

3、t Office Access簡介 PAGEREF _Toc21885 7 HYPERLINK l _Toc18293 3.1 網(wǎng)站定位 PAGEREF _Toc18293 9 HYPERLINK l _Toc13695 3.2 系統(tǒng)構(gòu)思 PAGEREF _Toc13695 9 HYPERLINK l _Toc30523 3.3 網(wǎng)站欄目簡介 PAGEREF _Toc30523 10 HYPERLINK l _Toc18283 第四章 詳細(xì)設(shè)計(jì) PAGEREF _Toc18283 11 HYPERLINK l _Toc11234 4.1 網(wǎng)站制作過程 PAGEREF _Toc11234 11

4、HYPERLINK l _Toc32732 4.1.1 logo的制作過程 PAGEREF _Toc32732 11 HYPERLINK l _Toc15997 4.1.2 banner的制作過程 PAGEREF _Toc15997 12 HYPERLINK l _Toc22235 4.1.3 主頁制作過程(詳見圖4-3) PAGEREF _Toc22235 13 HYPERLINK l _Toc17716 4.1.4留言板的設(shè)計(jì) PAGEREF _Toc17716 14 HYPERLINK l _Toc30530 4.2 數(shù)據(jù)庫的設(shè)計(jì) PAGEREF _Toc30530 16 HYPERLI

5、NK l _Toc16251 4.3 系統(tǒng)實(shí)現(xiàn)代碼 PAGEREF _Toc16251 17 HYPERLINK l _Toc2710 4.3.1 滾動文字特效（這里主要指網(wǎng)站左側(cè)的“公司公告”） PAGEREF _Toc2710 17 HYPERLINK l _Toc16672 4.3.2 圖片切換 PAGEREF _Toc16672 18 HYPERLINK l _Toc3171 4.3.3 首頁鼠標(biāo)特效代碼 PAGEREF _Toc3171 19 HYPERLINK l _Toc31403 結(jié)束語 PAGEREF _Toc31403 21 HYPERLINK l _Toc10636 參考

6、文獻(xiàn) PAGEREF _Toc10636 21 HYPERLINK l _Toc12778 致謝 PAGEREF _Toc12778 21摘要：本文就網(wǎng)站的主題內(nèi)容及網(wǎng)站的制作與設(shè)計(jì)這兩方面進(jìn)行描述與分析。本網(wǎng)站的主題知識產(chǎn)權(quán)服務(wù)，整個網(wǎng)站都是以法律性的內(nèi)容為主的，主要包括了首頁、公司簡介、法律服務(wù)、友情鏈接、法界動態(tài)、法律法規(guī)、在線留言、聯(lián)系我們、網(wǎng)站公告等欄目。在整個設(shè)計(jì)過程中主要是運(yùn)用Dreamweaver、ACCESS、ASP等編寫的。通過本網(wǎng)站系統(tǒng)，給想了解知識產(chǎn)權(quán)的人群提供了一個良好的平臺，同時(shí)也為有意愿注冊公司、注冊商標(biāo)、申請專利，卻無從咨詢的人提供了一個可以互動解決問題的平臺。

7、如今，在網(wǎng)絡(luò)技術(shù)的迅猛發(fā)展下，互聯(lián)網(wǎng)的不斷普及，讓人們都感受到網(wǎng)絡(luò)的方便快捷，從而大家都喜歡選擇從互聯(lián)網(wǎng)上獲取信息，因此，互聯(lián)網(wǎng)逐漸成為一個寬廣的信息發(fā)布平臺和獲取信息的平臺。本網(wǎng)站也需要通過Internet來對外宣傳、普及，從而幫助到更多想了解知識產(chǎn)權(quán)的人們。本網(wǎng)站主要是以建立Dreamweaver、ACCESS、ASP等技術(shù)的動態(tài)網(wǎng)站管理系統(tǒng)的前臺表現(xiàn)模塊，使用了ASP技術(shù)的動態(tài)網(wǎng)頁技術(shù)，加上ACCESS作為后臺數(shù)據(jù)庫，制作了一個簡單的服務(wù)性企業(yè)網(wǎng)站系統(tǒng)，實(shí)現(xiàn)了企業(yè)網(wǎng)站的基本功能，例如用戶注冊登錄，留言板的實(shí)現(xiàn)等。關(guān)鍵字：企業(yè)網(wǎng)站；ASP；知識產(chǎn)權(quán)緒言二十世紀(jì)進(jìn)入信息發(fā)展高速路，數(shù)碼化革命

8、給所有領(lǐng)域帶來新的改變。隨著電腦辦公自動化的普及，電子商務(wù)應(yīng)運(yùn)而生，一切都?xì)w功于internet的巨大貢獻(xiàn)，互聯(lián)網(wǎng)的世界里蘊(yùn)藏?zé)o限生機(jī)，這里只有想不到的、沒有做不到的。由于國際互聯(lián)網(wǎng)是一個不受時(shí)空限制的信息交換系統(tǒng)，所以它是目前最直接、最豐富和最快捷的聯(lián)系方式，信息溝通的高效率為企業(yè)帶來了最大的方便。所以在現(xiàn)今社會對于一個企業(yè)來說，網(wǎng)站已經(jīng)是不可缺少的一部分了。現(xiàn)今，知識產(chǎn)權(quán)越來越被人們關(guān)注，隨著就業(yè)壓力的加重，越來越多的年輕人選擇自己創(chuàng)業(yè)開公司，大學(xué)生也占了一定的比例，由于專業(yè)的限定，有些大學(xué)生在?；旧辖佑|不到知識產(chǎn)權(quán)的知識，當(dāng)然在社會上的人群也不一定都了解知識產(chǎn)權(quán)。同時(shí)隨著互聯(lián)網(wǎng)的快速發(fā)

9、展和不斷普及，網(wǎng)站成了傳播信息最有效的平臺。所以我制作了一個專門針對知識產(chǎn)權(quán)行業(yè)的企業(yè)網(wǎng)站，給這些人群提供了一個了解和學(xué)習(xí)知識產(chǎn)權(quán)的平臺，當(dāng)然對于一個針對知識產(chǎn)權(quán)的服務(wù)性企業(yè)本身而言，這個網(wǎng)站將會對其自身帶來不可估量的效用。社會在發(fā)展，人們的思想觀念，生活方式也在發(fā)展，通過網(wǎng)站這種方式與企業(yè)或者他人交流已經(jīng)趨向普及第二章 網(wǎng)站設(shè)計(jì)分析網(wǎng)站的設(shè)計(jì)與制作需要用到網(wǎng)頁三劍客（Dreamweaver、fireworks、flash），IIS，photoshop等工具。所以首先我們要了解這些工具的功能與用處，然后要能夠熟練得掌握這些工具用法，只有你能熟練使用這些工具，你才能在設(shè)計(jì)過程中盡量避免技術(shù)上的問

10、題，提高效率，做到“事半功倍”。2.1網(wǎng)站設(shè)計(jì)概述網(wǎng)站首頁可以說是網(wǎng)站的門面，大家瀏覽你的網(wǎng)站首先看到的就是網(wǎng)站首頁，所以首頁不僅要做得美觀，引人瀏覽，還要有豐富的內(nèi)容。所以我們在首頁就首頁聚集了大量的信息，除了最基本的法律法規(guī)、法界動態(tài)、法律服務(wù)這些欄目外，我還將公司的公告用滾動文字的形式展現(xiàn)出來，這樣靜中有“動”的效果可以抓住人的眼球，吸引人去點(diǎn)擊。每頁左下方都有我們的聯(lián)系方式，這樣就不用轉(zhuǎn)到聯(lián)系我們這張頁面都能獲取到公司的聯(lián)系方式了，當(dāng)然若想更深入的了解就可以轉(zhuǎn)到聯(lián)系我們頁面。子頁面的框架基本上是符合整個網(wǎng)站的整體風(fēng)格的，banner，導(dǎo)航等都是和首頁一樣的，不一樣的只是正文的內(nèi)容，這個

11、可以通過模板來實(shí)現(xiàn)。出于排除對模板可編輯區(qū)域排版的復(fù)雜性起見，我這里沒有運(yùn)用模板，而是用另存為的方式實(shí)現(xiàn)網(wǎng)頁風(fēng)格“統(tǒng)一化”的。在網(wǎng)站的各頁面制作好后，我在Dreamweaver中與Access數(shù)據(jù)庫建立連接，通過在Dreamweaver的一系列操作實(shí)現(xiàn)注冊登錄的功能，而留言板功能我是通過一張空白的寫有后臺代碼的頁面轉(zhuǎn)接過去的，名為handle.asp，用戶可以通過“在線留言”在網(wǎng)站上發(fā)表自己的見解或疑問，達(dá)到互動的效果。2.2 開發(fā)工具的選用及介紹2.2.1 Dreamweaver8.0Dreamweaver是創(chuàng)建和管理網(wǎng)頁的專業(yè)化可視編輯器，在網(wǎng)頁設(shè)計(jì)與制作領(lǐng)域中用戶最多、應(yīng)用最廣、功能最強(qiáng)

12、大的軟件，隨著Dreamweaver 8的發(fā)布，更堅(jiān)定Dreamweaver在該領(lǐng)域的地位。它集網(wǎng)頁設(shè)計(jì)、網(wǎng)站開發(fā)和站點(diǎn)管理功能于一身，具有可視化、支持多平臺和跨瀏覽器的特性，是目前網(wǎng)站設(shè)計(jì)、開發(fā)、制作的首選工具。1、靈活的編寫方式Dreamweaver具有靈活編寫網(wǎng)頁的特點(diǎn)，不但將世界一流水平的“設(shè)計(jì)”和“代碼”編輯器合二為一，而且在設(shè)計(jì)窗口中還精化了源代碼，能幫助用戶按工作需要定制自己的用戶界面。2、可視化編輯界面Dreamweaver是一種所見即所得的HTML編輯器，可實(shí)現(xiàn)頁面元素的插入和生成?；蛞暬庉嫮h(huán)境大量減少了代碼的編寫，同時(shí)亦保證了其專業(yè)性和兼容性，并且可以對內(nèi)部的HTML編輯

13、器和任何第三方的HTML編輯器進(jìn)行實(shí)時(shí)的訪問。無論用戶習(xí)慣手工輸入HTML源代碼還是使用可視化的編輯界面，Dreamweaver都能提供便捷的方式使用戶設(shè)計(jì)網(wǎng)頁和管理網(wǎng)站變得更容易。3、功能更多的CSS支持CSS可視化設(shè)計(jì)、CSS檢查工具4、動態(tài)跨瀏覽器驗(yàn)證當(dāng)保存時(shí)系統(tǒng)自動檢查當(dāng)前文檔的跨瀏覽器有效性，可以指定何種瀏覽器為測試用瀏覽器，同時(shí)系統(tǒng)自動檢驗(yàn)以確定頁面有沒有目標(biāo)瀏覽器不支持的tags或CSS結(jié)構(gòu)。動態(tài)跨瀏覽器有效性檢查功能可以自動核對tags和CSS規(guī)則是否適應(yīng)目前的主瀏覽器。5、強(qiáng)大的WEB站點(diǎn)管理功能6、內(nèi)建的圖形編輯引擎7、Dreamweaver的集成特性Dreamweaver

14、 8繼承了Fireworks、Flash和Shockwave的集成特性，可以在這些Web創(chuàng)作工具之間自由地切換，輕松地創(chuàng)建美觀實(shí)用的網(wǎng)頁。8、豐富的媒體支持能力可以方便地加入Java、Flash、Shockwave、ActiveX以及其他媒體。Dreamweaver具有強(qiáng)大的多媒體處理功能，在設(shè)計(jì)DHTML和CSS方面表現(xiàn)得極為出色，它利用JavaScript和DHTML語言代碼輕松地實(shí)現(xiàn)網(wǎng)頁元素的動作和交互操作。Dreamweaver還提供行為和時(shí)間線兩種控件來產(chǎn)生交互式響應(yīng)和進(jìn)行動畫處理。9、超強(qiáng)的擴(kuò)展能力Dreamweaver還支持第三方插件，任何人都可以根據(jù)自己的需要擴(kuò)展Dreamwe

15、aver的功能，并且可以發(fā)布這些插件。2.2.2 Photoshop CSPhotoshop CS是一款圖形、圖像編輯軟件，在網(wǎng)頁設(shè)計(jì)領(lǐng)域被廣泛得應(yīng)用。以下是其10大最新功能：1、改進(jìn)的文件瀏覽器使用功能強(qiáng)大文件瀏覽器的可以快速預(yù)覽、標(biāo)注和排序圖片；搜索或編輯圖像的數(shù)據(jù)元或關(guān)鍵詞；并且可以自動批量共享文件。2、匹配顏色命令可以迅速從一張圖片的顏色校正另外一張圖像的顏色。3、直方圖調(diào)色板隨時(shí)根據(jù)對圖像的調(diào)整更新直方圖調(diào)色板(Histogram Palette)。4、陰影/加亮區(qū)修正使用“陰影/加亮區(qū)修正(hadow/Highlight correction)”可以快速調(diào)整照片中曝光過渡或欠缺的區(qū)

16、域。5、沿路徑放置文本可以像在Illustrator中一樣把文本沿著路徑放置，并且你還可以在Illustrator直接編輯文本。6、支持?jǐn)?shù)碼相機(jī)的raw模式支持多款數(shù)碼相機(jī)得raw模式，讓用戶可以得到更真實(shí)的圖像輸入。7、全面支持16位圖像可以在主要功能、層、比刷、文字、圖形等中精確的編輯、潤飾16位的圖像。8、Layer Comps可以在一個文件中保存不同層的合并效果，以便對各種效果進(jìn)行快速察看。9、輸入Flash文件使用ImageReady可以創(chuàng)建flash矢量文件。10、自定義快捷鍵用戶可以按照自己的習(xí)慣定義Photoshop的快捷鍵。2.2.3 ASP動態(tài)網(wǎng)站腳本語言ASP是Activ

17、e Server Page的縮寫，意為“動態(tài)服務(wù)器頁面”。ASP是微軟公司開發(fā)的代替CGI腳本程序的一種應(yīng)用,它可以與數(shù)據(jù)庫和其它程序進(jìn)行交互，是一種簡單、方便的編程工具。ASP的網(wǎng)頁文件的格式是.asp，現(xiàn)在常用于各種動態(tài)網(wǎng)站中。ASP采用腳本語言VBScript（Java script）作為自己的開發(fā)語言。ASP是一種服務(wù)器端腳本編寫環(huán)境，可以用來創(chuàng)建和運(yùn)行動態(tài)網(wǎng)頁或Web應(yīng)用程序。使用 ASP 可以組合 HTML頁、VBScript腳本命令和JavaScript腳本命令等，以創(chuàng)建交互的 Web 頁和基于 Web 的功能強(qiáng)大的應(yīng)用程序。ASP網(wǎng)頁可以包含HTML標(biāo)記、普通文本、腳本命令以及

18、COM組件等。利用ASP可以向網(wǎng)頁中添加交互式內(nèi)容（如在線表單），也可以創(chuàng)建使用HTML網(wǎng)頁作為用戶界面的web應(yīng)用程序。ASP的文件后綴名為.asp，以區(qū)別于同樣可以包含Script的HTML 文件。一個.asp文件是一個文本文件，可以包括下列元素的任意組合： 文本（text）、HTML標(biāo)志（tags）、Script命令由于腳本程序是在服務(wù)器上而不是在客戶端運(yùn)行，傳送到瀏覽器上的 Web 頁是在 Web 服務(wù)器上生成的。所以不必?fù)?dān)心瀏覽器能否處理腳本：Web 服務(wù)器已經(jīng)完成了所有腳本的處理，并將標(biāo)準(zhǔn)的 HTML 頁面?zhèn)鬏數(shù)綖g覽器。由于只有腳本的結(jié)果返回到瀏覽器，所以服務(wù)器端腳本不易被別人復(fù)制

19、。用戶看不到創(chuàng)建他們正在瀏覽的頁的腳本命令。2.3 關(guān)系型數(shù)據(jù)庫的選擇2.3.1 Microsoft Office Access簡介Microsoft Office Access是由微軟發(fā)布的關(guān)聯(lián)式數(shù)據(jù)庫管理系統(tǒng),是集成在microsoft公司開發(fā)的產(chǎn)品更新?lián)Q代office系統(tǒng)中的集成軟件。它之所以被集成到Office中而不是Visual Studio中，是因?yàn)樗c其它的數(shù)據(jù)庫管理系統(tǒng)（如Visual FoxPro）相比更加簡單易學(xué)，一個普通的計(jì)算機(jī)用戶即可掌握并使用它。而且最重要的一點(diǎn)是Access的功能足夠強(qiáng)大，足以應(yīng)付一般的數(shù)據(jù)管理及處理需要。Assess能夠存取 Access/Jet、

20、Microsoft SQL Server、Oracle，或者任何 ODBC兼容數(shù)據(jù)庫內(nèi)的資料。ODBC（Open Database Connectivity開放式數(shù)據(jù)庫互聯(lián)）是微軟推出的一種工業(yè)標(biāo)準(zhǔn)，一種開放的獨(dú)立于廠商的API應(yīng)用程序接口，可以跨平臺訪問各種個人計(jì)算機(jī)、小型機(jī)以及主機(jī)系統(tǒng)。ODBC作為一個工業(yè)標(biāo)準(zhǔn)，絕大多數(shù)數(shù)據(jù)庫廠商、大多數(shù)應(yīng)用軟件和工具軟件廠商都為自己的產(chǎn)品提供了ODBC接口或提供了ODBC支持，這其中就包括常用的SQL SERVER、ORACAL、INFORMIX等，當(dāng)然也包括了Access。在ASP中可以通過三種方式訪問數(shù)據(jù)庫：1、IDC（Internet Databa

21、se Connector）方式；2、ADO（ActiveX Data Objects）方式；3、RDS（Remote Data Service）方式。這三種訪問方式對數(shù)據(jù)庫的訪問都是由Internet Information Server完成的。通過Web瀏覽器用HTTP協(xié)議向IIS（Internet信息服務(wù)器）發(fā)送請求，IIS執(zhí)行對數(shù)據(jù)庫的訪問，并返回一個HTML格式的文檔響應(yīng)。以下是Access的優(yōu)點(diǎn)：1存儲方式單一Access管理的對象有表、查詢、窗體、報(bào)表、頁、宏和模塊，以上對象都存放在后綴為（.mdb）的數(shù)據(jù)庫文件種，便于用戶的操作和管理。2面向?qū)ο驛ccess是一個面向?qū)ο蟮拈_發(fā)工

22、具，利用面向?qū)ο蟮姆绞綄?shù)據(jù)庫系統(tǒng)中的各種功能對象化，將數(shù)據(jù)庫管理的各種功能封裝在各類對象中。它將一個應(yīng)用系統(tǒng)當(dāng)作是由一系列對象組成的，對每個對象它都定義一組方法和屬性，以定義該對象的行為和外國，用戶還可以按需要給對象擴(kuò)展方法和屬性。通過對象的方法、屬性完成數(shù)據(jù)庫的操作和管理，極大地簡化了用戶的開發(fā)工作。同時(shí)，這種基于面向?qū)ο蟮拈_發(fā)方式，使得開發(fā)應(yīng)用程序更為簡便。3界面友好、易操作Access是一個可視化工具，是風(fēng)格與Windows完全一樣，用戶想要生成對象并應(yīng)用，只要使用鼠標(biāo)進(jìn)行拖放即可，非常直觀方便。系統(tǒng)還提供了表生成器、查詢生成器、報(bào)表設(shè)計(jì)器以及數(shù)據(jù)庫向?qū)?、表向?qū)А⒉樵兿驅(qū)?、窗體向?qū)А?bào)

23、表向?qū)У裙ぞ撸沟貌僮骱啽?，容易使用和掌握?集成環(huán)境、處理多種數(shù)據(jù)信息Access基于Windows操作系統(tǒng)下的集成開發(fā)環(huán)境，該環(huán)境集成了各種向?qū)Ш蜕善鞴ぞ?，極大地提高了開發(fā)人員的工作效率，使得建立數(shù)據(jù)庫、創(chuàng)建表、設(shè)計(jì)用戶界面、設(shè)計(jì)數(shù)據(jù)查詢、報(bào)表打印等可以方便有序地進(jìn)行。5Access支持ODBC（開發(fā)數(shù)據(jù)庫互連，Open Data Base Connectivity）。利用Access強(qiáng)大的DDE（動態(tài)數(shù)據(jù)交換）和OLE（對象的聯(lián)接和嵌入）特性，可以在一個數(shù)據(jù)表中嵌入位圖、聲音、Excel表格、Word文檔，還可以建立動態(tài)的數(shù)據(jù)庫報(bào)表和窗體等。Access還可以將程序應(yīng)用于網(wǎng)絡(luò)，并與網(wǎng)絡(luò)

24、上的動態(tài)數(shù)據(jù)相聯(lián)接。利用數(shù)據(jù)庫訪問頁對象生成HTML文件，輕松構(gòu)建Internet/Intranet的應(yīng)用。第三章 方案初選3.1 網(wǎng)站定位1網(wǎng)站主題本網(wǎng)站的主題是知識產(chǎn)權(quán)（包括公司注冊、商標(biāo)注冊、專利申請等等的法律知識），給想成立公司、注冊公司、申請專利、注冊商標(biāo)等的相關(guān)人群予幫助。2網(wǎng)站名稱該網(wǎng)站名為“君輝知識產(chǎn)權(quán)代理有限公司”，由此可見，這個企業(yè)網(wǎng)站以知識產(chǎn)權(quán)的相關(guān)知識為主，“代理有限公司”也突出了該企業(yè)的性質(zhì)即法律服務(wù)行業(yè)。一個網(wǎng)站的名字應(yīng)該要能反映出你想表達(dá)的意思，達(dá)到一望而知的效果。3網(wǎng)站的Logo與Banner網(wǎng)站的logo用藍(lán)色水晶球內(nèi)嵌著“junhui”標(biāo)志，既顯目又明確得表

25、達(dá)了主題。Banner則形象得表達(dá)出我制作設(shè)計(jì)這個網(wǎng)站的用意，“君輝知識產(chǎn)權(quán)代理有限公司”幾個字居中，用大字體強(qiáng)調(diào)顯示，讓人更醒目，右邊小字體“知識產(chǎn)權(quán) 財(cái)富之源”是與主題相呼應(yīng)的，寓意為知識產(chǎn)權(quán)可以創(chuàng)造財(cái)富，而我們公司是代理知識產(chǎn)權(quán)的，所以要找到財(cái)富的源頭，就來“君輝知識產(chǎn)權(quán)代理有限公司” 網(wǎng)，讓我?guī)湍弥R產(chǎn)權(quán)創(chuàng)造財(cái)富。最后以透明flash覆蓋在banner上面，即實(shí)現(xiàn)了由“靜”到“動”的效果，也使原本略顯單調(diào)的banner變得豐富一些。4標(biāo)準(zhǔn)顏色本網(wǎng)站以藍(lán)白色漸變色為底，以藍(lán)色為主色調(diào)，藍(lán)白的相互點(diǎn)綴，給人一種傾心的感覺，藍(lán)色還是天空和海洋的象征，“廣闊無垠”的藍(lán)色也同樣象征著我們“知識

26、產(chǎn)權(quán)”給人們帶來的財(cái)富也“浩瀚無垠”。5標(biāo)準(zhǔn)字體正文字體主要用的是標(biāo)準(zhǔn)的宋體。3.2 系統(tǒng)構(gòu)思本網(wǎng)站前臺包括首頁、公司簡介、法律服務(wù)、友情鏈接、法界動態(tài)、法律法規(guī)、在線留言、聯(lián)系我們、網(wǎng)站公告等欄目。以下是系統(tǒng)構(gòu)思的圖解（如圖3-1）首頁后臺管理公司簡介法界動態(tài)法律法規(guī)網(wǎng)站公告在線留言法律服務(wù)友情鏈接聯(lián)系我們圖3-1網(wǎng)站垂直系統(tǒng)圖3.3 網(wǎng)站欄目簡介 本網(wǎng)站的欄目有首頁、公司簡介、法律服務(wù)、友情鏈接、法界動態(tài)、法律法規(guī)、在線留言、聯(lián)系我們、網(wǎng)站公告等欄目，下面是對各欄目的簡介：首頁： 我們的banner所要表現(xiàn)的就是希望大家能到我們大學(xué)生創(chuàng)業(yè)園來一起學(xué)習(xí)創(chuàng)業(yè)知識，交流創(chuàng)業(yè)經(jīng)驗(yàn)。因?yàn)檫@個作品是特

27、別為大學(xué)生設(shè)計(jì)的，所以我們的整個頁面都是顯示出一種大學(xué)生活潑、朝氣以及創(chuàng)業(yè)的激情。同時(shí)首頁包含了本站所涉及的主要內(nèi)容、組成元素、主要話題和網(wǎng)站精髓。公司簡介： 主要介紹公司的歷史文化及服務(wù)內(nèi)容。法律服務(wù)： 簡單羅列了公司受理的業(yè)務(wù)，如公司注冊、商標(biāo)注冊、專利申請、電子口岸、版權(quán)代理等等。友情鏈接： 這個欄目主要是為了方便用戶了解有關(guān)商標(biāo)、專利等知識產(chǎn)權(quán)方面的知識而與相關(guān)政府部門網(wǎng)站建立的友情鏈接。法界動態(tài)： 我們特別收集了國家知識產(chǎn)權(quán)網(wǎng)上的最新信息，讓大家能及時(shí)了解到我國知識產(chǎn)權(quán)的最新動態(tài)。法律法規(guī)： 這個欄目主要列舉了有關(guān)知識產(chǎn)權(quán)方面的相關(guān)法律及法規(guī)，如“中華人民共和國專利法”等，使用戶對專

28、利法等相關(guān)法律知識有一定的了解。在線留言： 此欄目設(shè)立的主要目的是為了提供給想了解知識產(chǎn)權(quán)的用戶一個互動的平臺，用以解決知識產(chǎn)權(quán)的相關(guān)問題。（如圖3-2）聯(lián)系我們： 通過這個欄目，可以讓用戶獲得我們的各種聯(lián)系方式，這樣可以更深一步的與其探討知識產(chǎn)權(quán)的問題。網(wǎng)站公告： 除了單獨(dú)設(shè)立這個欄目外，我還特意在每張頁面的左側(cè)做了一個由下而上的滾動公告欄來吸引大家的眼球，鼠標(biāo)滑過滾動文字停留，鼠標(biāo)點(diǎn)擊后超鏈接至“網(wǎng)站公告”這個欄目，內(nèi)容主要為公司的最新的動態(tài)。（如圖3-2）圖3-2 第四章 詳細(xì)設(shè)計(jì)4.1 網(wǎng)站制作過程4.1.1 logo的制作過程本網(wǎng)站的Logo是把從網(wǎng)絡(luò)上找到的一些素材圖片，通過用Ph

29、otoshop進(jìn)行編輯、修改、組合而完成的。為了突出該企業(yè)名稱“君輝”，特意把“junhui”標(biāo)志用藍(lán)色水晶球包圍，并且“junhui”中“J”這個字母用一個龍頭的形狀代替，自古以來龍?jiān)谌藗兊牡匚欢际侵粮邿o上的，同時(shí)也襯托出“知識產(chǎn)權(quán)”在當(dāng)今社會的重要地位。在整個以藍(lán)色為主色調(diào)的網(wǎng)頁中，調(diào)劑整體頁面的色調(diào)，使頁面看起來更鮮活，很是醒目，讓人一眼就看到這個logo，了解主題。（如圖4-1）圖4-1 網(wǎng)站logo4.1.2 banner的制作過程首先需要上網(wǎng)收集一些符合你的作品主題、創(chuàng)作思維以及整體風(fēng)格的網(wǎng)頁相關(guān)素材，對其進(jìn)行修改已獲得自己所需素材，或可在Photoshop中繪制出自己所需的圖片素

30、材。接著打開Photoshop，在Photoshop里面新建一個文件，調(diào)整底圖大小，根據(jù)網(wǎng)頁的總長度，調(diào)節(jié)banner的長度和寬度（一般banner不能太寬，不然會顯得頭重腳輕，當(dāng)然也不能太窄，都沒法讓人感覺到有banner存在，所以一定要調(diào)整至占整個網(wǎng)頁的適合比例。）設(shè)計(jì)banner的背景：選用一張藍(lán)色的微帶波橫的圖片為banner背景，將處理好的素材依次放入具體位子，像左邊的鏡頭光暈，右邊的發(fā)光矩形框等等，按具體需求做具體的改動和修改，這樣整個banner的背景就設(shè)計(jì)好了。具體內(nèi)容設(shè)計(jì)：先在banner左邊放入logo（這里為了美觀起見，我將logo放大放在了banner最左邊，若放在左上

31、角一塊窄小的地方，反而凸顯不出“junhui”這個標(biāo)志），按具體情況驚醒調(diào)整修改至適當(dāng)部分，處理好每一處細(xì)節(jié)，這樣整個靜態(tài)的banner部分就設(shè)計(jì)好了。添加動態(tài)的flash效果：動態(tài)的flash效果要等到整個網(wǎng)頁的基本布局都設(shè)計(jì)好之后，就可以在Photoshop中按Shift+Ctrl+Alt+S存儲切片后所有圖片，將頁面轉(zhuǎn)換成.html格式，然后使用Dreamweaver打開編輯，在banner的區(qū)域加入Flash，將Flash轉(zhuǎn)換為透明flash形式，這樣整個banner部分就完成了。（如圖4-2）圖4-2 網(wǎng)站banner4.1.3 主頁制作過程(詳見圖4-3)首先根據(jù)頁面要展示內(nèi)容的多

32、少，在photoshop中新建一個適合的網(wǎng)頁寬度和長度的文件（我設(shè)計(jì)的時(shí)候在寬屏的機(jī)子上，所以建的文檔較大，約為1280*1405）。在畫布上按自己的想法結(jié)合實(shí)際內(nèi)容，用各圖形工具在畫布上畫上整個網(wǎng)頁基本的布局。基本布局的設(shè)計(jì)定下之后再對各部分進(jìn)行具體設(shè)計(jì)，細(xì)化每個部分，特別是靜態(tài)的部分。在Photoshop里完成整個頁面的設(shè)計(jì)后，進(jìn)行切片，將要動態(tài)顯示的地方切出來，還有就是大的圖片要切一下，能提高網(wǎng)頁讀取速度。按Shift+Ctrl+Alt+S存儲為.html格式后，用Dreamweaver編輯，將需要作為背景的單元格中的圖片設(shè)為該單元格的背景，另存為index.asp。用相同的方法制作網(wǎng)站

33、分頁。將所有頁面，拷到所屬文件夾，然后與后臺數(shù)據(jù)庫連接起來，即可通過對后臺數(shù)據(jù)庫內(nèi)容的添加、刪除、修改來對網(wǎng)頁的相關(guān)內(nèi)容進(jìn)行操作，例如在數(shù)據(jù)庫注冊登錄表中刪除一個用戶信息，那么這個用戶再次用原先的登錄信息登錄時(shí)就無法登錄成功了。在Dreamweaver中網(wǎng)頁的左側(cè)類似“書卷”的區(qū)域插入一張表格，并在代碼相應(yīng)位置插入滾動文字特效的代碼，實(shí)現(xiàn)文字至下而上滾動，鼠標(biāo)移過文字時(shí)滾動停留的功能，鼠標(biāo)按下即跳轉(zhuǎn)到“網(wǎng)站公告”頁面；在網(wǎng)站首頁頂端插入滾動的歡迎字幕，方法同上。在Dreamweaver8.0里打開主頁面，在頁面中相對應(yīng)除插入圖片切換的代碼，實(shí)現(xiàn)新聞圖片的自動切換的效果。 8. 在Dreamwe

34、aver8.0里打開主頁面，切換到設(shè)計(jì)視圖，將雪花鼠標(biāo)特效代碼復(fù)制在之間，保存并預(yù)覽，完成首頁鼠標(biāo)特效。圖4-3 網(wǎng)站首頁4.1.4留言板的設(shè)計(jì)為了能讓大家有一個相互探討、分享知識產(chǎn)權(quán)方面的心得與經(jīng)驗(yàn)的平臺，為了能讓廣大人群更好、更深刻的了解知識產(chǎn)權(quán)，為此，我們特別設(shè)立了“在線留言”這一欄目，如果你有什么和知識產(chǎn)權(quán)有關(guān)的問題或者想法，可以在這里留言，我們將會有專門的指導(dǎo)老師或者有識之士會及時(shí)給予回復(fù)與解答，與此同時(shí)你也可以解答或回復(fù)他人遇到的問題。這樣就實(shí)現(xiàn)了多人的互動。總體來說，留言板功能是這個網(wǎng)站的主要功能之一，也是這個網(wǎng)站的亮點(diǎn)之一，它讓整個網(wǎng)站的功能得到提升，使其不單單只是一個簡單的單

35、純的信息發(fā)布的網(wǎng)站，增加了互動環(huán)節(jié)。（如圖4-4）（留言頁面）（查看留言內(nèi)容及回復(fù)頁面）圖4-4 留言板4.2 數(shù)據(jù)庫的設(shè)計(jì)使用Access 2003實(shí)現(xiàn)關(guān)系型數(shù)據(jù)庫，以下是數(shù)據(jù)庫中幾個主要的表的設(shè)計(jì)：登錄注冊管理存儲了注冊登錄用戶的基本信息，如用戶名、密碼、地址、郵箱等。（如圖4-5）圖4-5圖4-6留言板存儲了留言的檔案，其中id是關(guān)鍵字，主要實(shí)現(xiàn)用戶信息管理、留言及回復(fù)等。（如圖4-7）（留言信息存儲表）（回復(fù)信息儲存表）圖4-7創(chuàng)建好數(shù)據(jù)庫之后，我們來用ASP把程序和數(shù)據(jù)庫連接起來，以后就可以連接到數(shù)據(jù)庫、在ASP中顯示數(shù)據(jù)庫中的數(shù)據(jù)。4.3 系統(tǒng)實(shí)現(xiàn)代碼4.3.1 滾動文字特效（這里

36、主要指網(wǎng)站左側(cè)的“公司公告”） document.write ()document.write (公司公告)document.write ()document.write (1. 商標(biāo)轉(zhuǎn)讓君輝知識 )document.write (2. 法律服務(wù)簡介2010 )document.write (3. 我們的法律服務(wù)(最新）)document.write (4. 招聘專利代理人 )document.write (5. 本所代理中國馳名商標(biāo) )document.write (6. 賀本司商標(biāo)專利部喜遷 )document.write ()document.write ( ) 4.3.2 圖片切換4.

37、3.3 首頁鼠標(biāo)特效代碼BODYoverflow:scroll;overflow-x:hidden;.s1position : absolute; font-size : 12pt; color : blue; visibility: hidden;.s2 position : absolute; font-size : 20pt; color : green; visibility : hidden;.s3 position : absolute; font-size : 16pt; color : gold; visibility : hidden;.s4 position : absol

38、ute; font-size : 14pt; color : lime; visibility : hidden;*var nav = (document.layers);var tmr = null;var spd = 50;var x = 0;var x_offset = 5;var y = 0;var y_offset = 15;if(nav) document.captureEvents(Event.MOUSEMOVE);document.onmousemove = get_mouse;function get_mouse(e) x = (nav) ? e.pageX : event.

39、clientX+document.body.scrollLeft; y = (nav) ? e.pageY : event.clientY+document.body.scrollTop; x += x_offset; y += y_offset; beam(1);function beam(n) if(n0) if(nav)eval(document.div+n+.visibility=hidden); else eval(div+n+.style.visibility=hidden); n-; tmr=setTimeout(fade(+n+),spd); else clearTimeout(tmr);結(jié)束語經(jīng)過一段時(shí)間的學(xué)習(xí)與制作，企業(yè)網(wǎng)站的設(shè)計(jì)制作基本上已經(jīng)告一段落。總結(jié)這次制作畢業(yè)設(shè)計(jì)的過程，對我來說是一個將所學(xué)知識