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