在Internet飛速發(fā)展的今天,互聯(lián)網(wǎng)成為人們快速獲取、發(fā)布和傳遞信息的重要渠道,它在人們政治、經(jīng)濟、生活等各個方面發(fā)揮著重要的作用。面對日益加快的生活節(jié)奏和信息社會日新月異的變化,城市極需要一種快捷,便利的平臺來對外宣傳城市形象,介紹最新動態(tài)和發(fā)展?fàn)顩r。如何運用現(xiàn)代化信息技術(shù)完成這一目標(biāo),建立“一座城市與投資商之間暢通無阻的大橋”已成為城市中應(yīng)該解決的重要課題之一,本網(wǎng)站正是為這一目標(biāo)設(shè)計制作的。制作的特產(chǎn)網(wǎng)站是為了更好的宣傳城市的特色與美好,網(wǎng)頁內(nèi)容的設(shè)計簡潔明了,以瀏覽者為中心,整體顏色以淺藍色為主,主要通過運用Dreamweaver、Photoshop、Flash來更好的提高網(wǎng)站的生命力。
【關(guān)鍵詞】:城市網(wǎng)站;網(wǎng)頁設(shè)計;Dreamweaver;Flash
引 言
DweamweaverCs3制作的旅游門戶網(wǎng)站。DweamweaverCs3美國MACROMEDIA公司開發(fā)的集網(wǎng)頁制作和管理網(wǎng)站于一身的所見即所得網(wǎng)頁編輯器,它是第一套針對專業(yè)網(wǎng)頁設(shè)計師特別發(fā)展的視覺化網(wǎng)頁開發(fā)工具,利用它不僅可以輕而易舉地制作出跨越平臺限制和跨越瀏覽器限制的充滿動感的旅游網(wǎng)頁,還可以通過制作本網(wǎng)頁能更深入的了解網(wǎng)站的具體要求及步驟,同時在以后的運用中得心應(yīng)手。
一 網(wǎng)頁設(shè)計的原則:
1.1 制件網(wǎng)站的目標(biāo)
包括:1.永諦棗王產(chǎn)地的的介紹。2.網(wǎng)站欄目的描述。3.基本功能介紹。4.基本設(shè)計構(gòu)想。
1.2 總體設(shè)計方案主題鮮明
在目標(biāo)明確的基礎(chǔ)上,完成網(wǎng)站的構(gòu)思創(chuàng)意即總體設(shè)計方案。
1.3 網(wǎng)頁設(shè)計的要素
在一個網(wǎng)站中,最重要的頁面當(dāng)屬主頁,從版面設(shè)計來講,一個有特色的主頁,必須包含有四個要素:文字,圖片,排列方式和主色調(diào),這四者相輔相成,缺一不可。
1.4 網(wǎng)頁設(shè)計技巧
一張完美主頁設(shè)計需要積累豐富的知識以及掌握大量的技巧。
1.5 網(wǎng)頁形式與內(nèi)容相統(tǒng)一
將豐富的意義和多們的形式組織成統(tǒng)一的頁面結(jié)構(gòu),形式語言必須符合頁面的內(nèi)容,體現(xiàn)內(nèi)容的豐富含義。
1.6 內(nèi)容更新與溝通
企業(yè)Web站點建立后,要不斷更新內(nèi)容。站點信息的不斷更新,讓瀏覽都了解企業(yè)的必展和網(wǎng)上職務(wù)等,同時也會幫助企業(yè)建立良好形象。
1.7網(wǎng)頁設(shè)計經(jīng)驗談
網(wǎng)頁設(shè)計涉及到對多種軟件、多種知識的學(xué)習(xí)和應(yīng)用,以及個人的審美觀等等。所以要想制件出漂亮的網(wǎng)頁,需要一個逐步學(xué)習(xí)和經(jīng)驗積累的過程。網(wǎng)頁設(shè)計還有更多的技巧,有待于我們?nèi)ネ诰蚝脱芯俊?/p>
1.8網(wǎng)站界面
界面就是網(wǎng)站給瀏覽者的第一印象,往往決定著網(wǎng)站的可看性,在確定網(wǎng)站的界面時要注意以下兩點。
1、欄目與板塊編排
構(gòu)建一個網(wǎng)站就好比寫一篇論文,首先要列出題綱,才能主題明確、層次清晰。
盡可能刪除那些與主題無關(guān)的欄目;
盡可能將網(wǎng)站內(nèi)最有價值的內(nèi)容列出欄目上;
盡可能從訪問者角度來編排欄目以方便訪問者的瀏覽和查詢輔助內(nèi)容,如站點簡介、版權(quán)信息、個人信息等大可不必放在主欄目里,以免沖淡主題。
另外,板塊的編排設(shè)置也要合理安排與劃分。
2、設(shè)計網(wǎng)站色彩
網(wǎng)站給人的第一印象來自視覺沖擊,不同的色彩搭配產(chǎn)生不同的效果,并可能影響到訪問者的情緒。
1.9確定網(wǎng)站風(fēng)格
有風(fēng)格的網(wǎng)站與普通網(wǎng)站的區(qū)別在于:在普通網(wǎng)站上你看到的只是堆砌在一起的信息,你只能用理性的感受來描述,比如信息量多少,瀏覽速度快慢等;在有風(fēng)格的網(wǎng)站上你可以獲得除內(nèi)容之外的更感性的認(rèn)識,比如站點的品位,對瀏覽者的態(tài)度等??傊?,風(fēng)格的形成不是一次定位的,你可以在實踐中不斷強化、調(diào)整、改進。
二 網(wǎng)站制件的過程
2.1列出提綱:
列出自己網(wǎng)站建設(shè)方面的基本需求。
涉及內(nèi)容包括:
1、永諦棗王產(chǎn)地的簡介2、欄目描述3、特產(chǎn)基本功能介紹4、 網(wǎng)站設(shè)計構(gòu)想
2.2在網(wǎng)上搜集制件網(wǎng)站所需的文字內(nèi)容還有圖片
(例如:棗原產(chǎn)于我國,主要分布在黃河流域、大棗最突出的特點是維生素含量高等等)
2.3開始制件
首先要確定網(wǎng)站的整體風(fēng)格及布局設(shè)計
永諦棗王產(chǎn)地網(wǎng)站制件中
導(dǎo)航有五個欄目,分別是【首頁】【永諦棗王產(chǎn)地簡介】【紅棗和黃河的傳說】【特產(chǎn)展臺】【紅棗的藥用功效】
在紅棗分類欄目中,分別是【木棗】【灘棗】【蜜棗】【貢棗】【空心脆棗】
欄目設(shè)置完成后就要對和頁面填加具體內(nèi)容,根據(jù)各頁面特色填加不同內(nèi)容,再將各頁面之間做好鏈接,然后進行整理,即可。
2.4測試
通過在不同電腦、操作系統(tǒng)、瀏覽器下運行,檢驗所制件網(wǎng)站的兼容性。
三 HTML 網(wǎng)頁的實現(xiàn)
3.1 建立站點
點擊啟動Dreamwaver (從”開始菜單/程序“點擊啟動程序)。
新建站點名稱為【web1】,然后打開下載的網(wǎng)站,把它改成模版
布局網(wǎng)站
在布局之前,我們先要對這個網(wǎng)頁的布局結(jié)構(gòu)有一個大概的了解。
網(wǎng)站的上方右側(cè)先是一個搜索,第二行是給網(wǎng)站設(shè)計的logo第三行是一個導(dǎo)航欄。第四行是對不同品種棗的分類。
在了解對網(wǎng)頁的布局結(jié)構(gòu)有一定了解以后,我們開始制作這么一個網(wǎng)頁:
(1)我們把Dreamweaver打開,然后新建一個html網(wǎng)頁到C:\web1下。(2)然后我們在網(wǎng)站內(nèi)的文檔欄內(nèi)修改網(wǎng)頁的標(biāo)題為“永諦棗王產(chǎn)地”(3)下面開始布局第一個網(wǎng)頁:除了模版本身的內(nèi)容外,首頁:在正文部分有表格布局的層,第一個是制作這個網(wǎng)站的首選棗王產(chǎn)地介紹,點擊插入圖片,調(diào)整大小—寫入有關(guān)的內(nèi)容—鏈接。第二是紅棗和黃河的傳說,點擊插入圖片,調(diào)整大小—寫入有關(guān)的內(nèi)容—鏈接。然后其它都同樣的道理。
永諦棗王產(chǎn)地簡介:這個版塊,我用了層跟表格來布局,在可編輯域的左上方點擊層,進行布局然后插入圖片,在下方簡單的介紹該產(chǎn)品在空白域插入表格,鍵入關(guān)于我們縣紅棗的有關(guān)內(nèi)容跟我們本地的一些相關(guān)事物。
紅棗和黃河的傳說:這個版塊我用的表格,然后鍵入內(nèi)容,鏈接,調(diào)整大小力求美觀 ,大方。在下面插入圖片,可以更加清楚的知道我們縣的地理環(huán)境。
特產(chǎn)展臺:這個版塊用的層,然后鍵入內(nèi)容,鏈接,調(diào)整大小,最下方插入flash.。
紅棗的藥用功效:這個版塊用的表格,然后鍵入內(nèi)容,鏈接,調(diào)整大小。
交通通訊:這個版塊用的層,然后鍵入內(nèi)容,鏈接,調(diào)整大小。
在不同品種棗的分類中,用二行三列的區(qū)域塊劃分。
木棗:這個版塊用占用一小塊單元格,我先插入的是木棗的圖片,接著對木棗做簡單的介紹,為了讓更多人對木棗的詳解,對木棗進行鏈接。
灘棗:這個版塊用占用一小塊單元格,我先插入的是灘棗的圖片,接著對灘棗做簡單的介紹,為了讓更多人對灘棗的詳解,對灘棗進行鏈接。
蜜棗:這個版塊用占用一小塊單元格,我先插入的是蜜棗的圖片,接著對蜜棗做簡單的介紹,為了讓更多人對蜜棗的詳解,對蜜棗進行鏈接。其實兩個也是也是一樣的道理。
網(wǎng)站也可以在這得到更直接、快捷的反饋意見,更好,更快的改善。
3.2 模版
建立多個二級頁面
在站點文件夾下新建十個空白頁面,在dreamweaver中打開,然后打開站點文件夾下templates文件夾下的moban文件,在右側(cè)文件面板中打開“資源”面板,選擇“模板”然后使各個頁面都應(yīng)用于這一模板。然后全部保存。
參考文獻:
[1] 徐珂、苗彤、趙暉 《網(wǎng)頁視覺與設(shè)計》人民郵電出版社2001出版
[2] 任學(xué)文、范嚴(yán) 《網(wǎng)頁設(shè)計與制作》中國科學(xué)技術(shù)出版社2006出版
[3] 陳希 《網(wǎng)頁藝術(shù)設(shè)計》科學(xué)出版社 2009年出版
[4] 吳濤 《網(wǎng)站全程設(shè)計技術(shù)》清華大學(xué)出版社2006年出版