標籤: 暫無標籤

頁,是網站中的一「頁」,通常是HTML格式(文件擴展名為.html或.htm或.asp或.aspx或.php或.jsp等)。網頁通常用圖像檔來提供圖畫。網頁要透過網頁瀏覽器來閱讀。網站的一個重要組成部分,由文字、圖片甚至是視頻、動畫、音樂組成的一個單獨頁面,用於傳遞單方面信息。網頁是構成網站的基本元素,是承載各種網站應用的平台。通俗的說,您的網站就是由網頁組成的。如果您只有域名和虛擬主機而沒有製作任何網頁的話,您的客戶仍舊無法訪問您的網站。

1 網頁 -基本元素

網頁網頁
文字與圖片是構成一個網頁的兩個最基本的元素。你可以簡單的理解為:文字,就是網頁的內容,圖片,就是網頁的美觀。除此之外,網頁的元素還包括動畫、音樂、程序等等。
網頁網頁

在網頁上點擊滑鼠右鍵,選擇菜單中的「查看源文件」,就可以通過記事本看到網頁的實際內容。可以看到,網頁實際上只是一個純文本文件,它通過各式各樣的標記對頁面上的文字、圖片、表格、聲音等元素進行描述(例如字體、顏色、大小),而瀏覽器則對這些標記進行解釋並生成頁面,於是就得到你現在所看到的畫面。為什麼在源文件看不到任何圖片?網頁文件中存放的只是圖片的鏈接位置,而圖片文件與網頁文件是互相獨立存放的,甚至可以不在同一台計算機上。

網頁類型:.通常我們看到的網頁,都是以htm或html後綴結尾的文件,俗稱HTML文件。不同的後綴,分別代表不同類型的網頁文件,例如以CGI、ASP、PHP、JSP甚至其他更多。

網頁分類:網頁有多種分類,我們籠統意義上的分類是動態和靜態的頁面,原則上講靜態頁面多通過網站設計軟體來進行重新設計和更改,相對的比較滯后,當然現在有網站管理系統,也可以生成靜態頁面~我們稱這種靜態頁面為偽靜態。動態頁面通過網頁腳本與語言自動處理自動更新的頁面,比方說貼吧,他就是通過網站伺服器運行程序,自動處理信息,按照流程更新網頁。

關於網頁:當你每次上網時,都會在歷史紀錄里留下紀錄,保存在C盤主要文件的一個文檔里,刪除時只要右鍵刪除就可以了。

2 網頁 -主要名詞

網頁網頁
INTERNET︰一個全球資訊系統,簡單來說是一個連接起世界各地電腦的大型網路。
網頁︰就是我們現在準備要做出來的東西。
網站︰由一堆網頁所構成的完整內容,稱為網站。所謂網站(Website),就是指在網際網路(網際網路)上,根據一定的規則,使用HTML等工具製作的用於展示特定內容的相關網頁的集合。簡單地說,網站是一種通訊工具,就像布告欄一樣,人們可以通過網站來發布自己想要公開的資訊(信息),或者利用網站來提供相關的網路服務(網路服務)。人們可以通過網頁瀏覽器來訪問網站,獲取自己需要的資訊(信息)或者享受網路服務。
首頁︰就是當我們進去一個網站時,第一眼看到的頁面,通常都是目錄頁。
網址︰URL,即是網站的地址。
域名︰Domainname,也是網站的地址,大多是要付款的。
子域名︰SubDomainname,網站的次地址,假如你的域名是www.divhome.com,divhome.com便是www.divhome.com的子域名。
WWW︰WorldWideWeb,是由一堆網站所連結而成的。
HTML︰HyperTextMarkUpLanguage,超文件註標式語言,是流行的編寫網頁語言,為普通文件中某些字句加上標示的語言,其目的在於運用標記(tag)使文件達到預期的顯示效果。

3 網頁 -製作流程

網頁網頁
主題構思:第一步當然要先構思網站的內容、主題及操作介面。
編寫工具:
準備寫網頁的工具、圖片製作工具、上傳工具。編寫工具準備寫網頁的工具、圖片製作工具、上傳工具。
編寫網頁:
開始動工,編寫網頁,最累、最有成就感的時候。
找個空間:寫好網頁就要放上網路,得找個免費空間來放,當然你可以用付費的空間。
上傳網頁:
有了網頁空間,就將寫好的網頁上傳到網路上。上傳網頁:有了網頁空間,就將寫好的網頁上傳到網路上。
維護網頁:
不斷地維護更新網頁內容,保持網頁的新鮮度。

4 網頁 -設計特點

網頁網頁
網頁設計的兩大要點是:整體風格和色彩搭配。

確定網站的整體風格:網站的整體風格及其創意設計是最難以學習的。難就難在沒有一個固定的模式可以參照和模仿。給你一個主題,任何兩人都不可能設計出完全一樣的網站。
風格(style)是抽象的。是指站點的整體形象給瀏覽者的綜合感受。這個「整體形象」包括站點的CI(標誌、色彩、字體、標語)、版面布局、瀏覽方式、交互性、文字、語氣、內容價值、存在意義、站點榮譽等等諸多因素。舉個例子:我們覺得網易是平易近人的,迪斯尼是生動活潑的,IBM是專業嚴肅的。這些都是網站給人們留下的不同感受。

網頁色彩的搭配:無論是平面設計,還是網頁設計,色彩永遠是最重要的一環。當我們距離顯示屏較遠的時候,我們看到的不是優美的版式或者是美麗的圖片,而是網頁的色彩。
1.用一種色彩。這裡是指先選定一種色彩,然後調整透明度或者飽和度,這樣的頁面看起來色彩統一,有層次感。
2.用兩種色彩。先選定一種色彩,然後選擇它的對比色。
3.用一個色系。簡單的說就是用一個感覺的色彩,例如淡藍,淡黃,淡綠;或者土黃,土灰,土藍。
在網頁配色中,還要切記一些誤區:
1.不要將所有顏色都用到,盡量控制在三至五種色彩以內。
2.背景和前文的對比盡量要大(絕對不要用花紋繁複的圖案作背景),以便突出主要文字內容。
網頁設計的工具:
1.dreamweaver,用與編輯HTML、ASP、JSP、PHP時的輔助工具
2.Frontpage跟dreamweaver一樣,不過個人感覺還是dreamweaver好。
3.FLASH網頁需要畫面流動時的首選擇
4.PS圖象處理軟體,一般網頁都需要有圖片相搭配,PS是款很強大的工具。
5.FW跟PS一樣都是圖象處理軟體,但FW偏向與對網頁的處理。

5 網頁 -設計要素

網頁網頁
設計一個網站,應該考慮下列基本因素,這些因素對網站的成功與否有著重要影響。

1.整體布局:
網站主頁就好象是宣傳欄或者店面——對訪問者產生第一印象,都希望盡量給人留下好的印象,一般來說,好的網站應該給人有這樣的感覺:乾淨整潔;條理清楚;專業水準;引人入勝。網頁應該力求抓住而不是淹沒瀏覽者的注意力,過多的閃爍、色彩、下拉菜單框、圖片等會讓訪問者無所適從——離開是最好的選擇,就象一些商店,播放震耳欲聾的發燒音樂,你要做的唯一決定就是離開那裡,越快越好。

2.信息:
無論商業站點還是個人主頁,你必須給人們提供有一定價值的內容才能留住訪問者,因為我們人類總是惟利是圖,第一個問題總是:「對我有什麼用處?」
所以你必須提供某些有價值的東西,當然並不是說必須提供某些免費的物品——免費書籍、免費入場券、免費度假等,這些「有價值的東西」可以是:信息;娛樂;勸告;對一些問題的幫助;提供志趣相投者聯絡的機會;鏈接到有用的網頁,等等。如果你經營的是企業網站,需要提供關於產品或服務的信息:容易理解;容易查詢;容易訂貨。

3.速度:
我們都知道,頁面下載速度是網站留住訪問者的關鍵因素,如果20—30秒還不能打開一個網頁,一般人就會沒有耐心。至少應該確保主頁速度儘可能快,最好不要用大的圖片。應該時時提醒自己,網站首頁就象一個廣告牌。當開車經過一個廣告牌時,沒有時間閱讀上面的詳細說明,也不可能讚賞其複雜的圖案,廣告標誌從眼前一閃而過,必須在一瞬間給人留下印象。網上訪問者也是「一閃而過」,保證你的首頁簡單而快速。網上有許多關於如何增加速度的文章——檢查下載速度,放棄一切顯著減慢主頁速度的資料。

4.圖形和版面設計
圖形和版面設計關係到對主頁的第一印象,圖象應集中反映主頁所期望傳達的主要信息。
如果有系列商業站點,你不必讓過分顯眼的動畫出現在首頁——但如果你的網站是遊戲站點,動畫將是必不可少的一部分內容。圖片是影響網頁下載速度的重要原因,根據經驗,把每頁全部內容控制在30K左右可以保證比較理想的下載時間。圖象在6—8K之間為宜,每增加2K會延長1秒鐘的下載時間。
顏色也是影響網頁的重要因素,不同的顏色對人的感覺有不同的影響,例如:紅色和橙色使人興奮並使得心跳加速;黃色使人聯想到陽光,是一種快活的顏色;考慮到你希望對瀏覽者產生什麼影響,請為網頁選擇合適的顏色。
閱讀西方格式文本時,眼睛從左上方開始,逐行瀏覽到達由下方,插入圖象時不要忘記這種特性。任何具有方向性的圖片應該放置在網頁中對眼睛最重要的地方,如果在左上角放置一幅小鳥的圖片,鳥嘴應該放在把瀏覽者目光引向頁面中部的地方,而不是把視線引走。
這種思路可以用於所有圖片:面部應該「看」網頁的中部;汽車的「停靠」面向網頁中部;道路、領帶等等圖片的放置都應該在有助於吸引目光從左向右、從上向下移動。一般總是把網站導航條放置在頁面左邊,也是出於這種考慮——不斷地出現在瀏覽者的視野之中。

5.文字的可讀性:
我們仍然用廣告牌的比喻來說明,文字要在廣告牌上突出,周圍應該留有足夠的空間。也許你曾到過一些網站,要麼擁擠不堪的文字覺得好象只有把腦袋鑽進去才能閱讀,要麼深色的背景給人的感覺好象處於非常狹窄的空間里,而且讓人的心情感覺很壓抑。某些背景色的令人閱讀困難;紫色、橙色和紅色讓人眼花繚亂。
文字的顏色也很重要,不同的瀏覽器有不同的顯示效果,有些在你的瀏覽器上很漂亮的顏色在其他瀏覽器上可能無法顯示。
參考報紙的編排方式,為方便或快速閱讀將你的內容分欄設計,甚至兩欄也要比一滿頁的視覺效果要好。
另一種能夠提高文字可讀性的因素是你所選擇的字體,通用的字體(Arial,TimesNewRoman,GaramondandCourier)最易閱讀,特殊字體用於標題效果較好,但是不適合正文(試想瀏覽整頁的Gothic,Script,Westminster,orCloister會是怎樣的感受)。因為閱讀費力,你的眼睛很快就會疲勞,不得不轉移到其他頁面。

6.網頁標題的可讀性:必須盡量使你的網頁易於閱讀,除了分欄之外(將頁面縱向分割),也需要利用標題和副標題將文檔分段。為所有標題和副標題設置同一字體,並將標題字體加大一號,所有標題和副標題都採用粗體,這樣便於識別標題(字體加大加粗)和副標題(粗體,與正文字體大小相同),使瀏覽者一眼就可以看到要點,以便找出並繼續閱讀有興趣的內容。標題的重要性可見一斑,要認真寫好每個標題,也可以將整句採用粗體或用不同的顏色突出某些內容,不過不要用難以閱讀的顏色。

7.導航:由於人們習慣於從作到右、從上到下閱讀,所以主要的導航條應放置在頁面左邊,對於較長頁面來說,在最底部設置一個簡單導航也很有必要(只要兩項就夠了:主頁|頁面頂部)。確定一種你滿意的模式之後,最好將這種模式應用到同一網站的每個頁面,這樣,瀏覽者就知道如何尋找信息。

8.保護個人信息聲明和客戶推薦信:對於商業網站來講,最重要的事情之一是確保潛在客戶的信心,你應該明確地告訴人們,如何對其興趣、愛好,尤其個人隱私保密,很有必要專門用一個頁面詳細陳述你的保護個人信息聲明,包括對訪問者的email地址保密、如何接受定單、如何匯總信息、匯總這些信息的目的、誰可以看到這些信息等基本內容。訪問者也想知道你的產品或服務現有客戶的反映,所以如果能引用與你關係融洽的客戶對你的積極評價,對你的可信度將很有幫助。不要害怕向顧客索取推薦信——人們都願意自己的意見有價值。你可以把客戶的推薦信另設計為一個網頁,作為對客戶提供推薦信的回報,在這裡鏈接到客戶的網站——這也是一種「雙贏」。

9.詞語:一個網站如果只有漂亮的外觀而詞語錯誤連篇、語法混亂,同樣是失敗的,對於網站所有者和負責人將產生很壞的影響,人們會用許多貶義詞來評價你:粗心大意、懶惰、外行、沒水平等等。你願意把自己辛苦掙來的錢花在一個連自己的網站都馬馬虎虎的人嗎?你可以按照上述步驟改進你的網站製作技巧;你可以請人對你的工作進行校對、編輯;你也可以請人為你製作網頁;總之,上述步驟在很多方面對你會有所幫助,不要因為對某些步驟的疏忽而影響你的網站的整體效果。

6 網頁 -總體內容

網頁網頁
網頁設計總體方案主題鮮明:在目標明確的基礎上,完成網站的構思創意即總體設計方案。對網站的整體風格和特色作出定位,規劃網站的組織結構。Web站點應針對所服務對象(機構或人)的不同而具有不同的形式。有些站點只提供簡潔文本信息;有些則採用多媒體表現手法,提供華麗的圖像、閃爍的燈光、複雜的頁面布置,甚至可以下載聲音和錄像片段。好的Web站點把圖形表現手法和有效的組織與通信結合起來。為了做到主題鮮明突出,要點明確,我們將按照客戶的要求,以簡單明確的語言和畫面體現站點的主題;調動一切手段充分表現網站點的個性和情趣,辦出網站的特點。Web站點主頁應具備的基本成分包括:頁頭:準確無誤地標識你的站點和企業標誌;Email地址:用來接收用戶垂詢;聯繫信息:如普通郵件地址或電話;版權信息:聲明版權所有者等。充分利用已有信息,如客戶手冊.公共關係文檔.技術手冊和資料庫等。

網頁設計作為一種視覺語言,特別講究編排和布局,雖然主頁的設計不等同於平面設計,但它們有許多相近之處。版式設計通過文字圖形的空間組合,表達出和諧與美。多頁面站點頁面的編排設計要求把頁面之間的有機聯繫反映出來,特別要處理好頁面之間和頁面內的秩序與內容的關係。為了達到最佳的視覺表現效果,我們將反覆推敲整體布局的合理性,使瀏覽者有一個流暢的視覺體驗。

色彩在網頁設計中的作用:色彩是藝術表現的要素之一。在網頁設計中,我們的設計師根據和諧、均衡和重點突出的原則,將不同的色彩進行組合.搭配來構成美麗的頁面。根據色彩對人們心理的影響,合理地加以運用。如果您的企業有CIS(企業形象識別系統),我們將按照其中的VI進行色彩運用。

網頁設計形式與內容相統一:為了將豐富的意義和多樣的形式組織成統一的頁面結構,形式語言必須符合頁面的內容,體現內容的豐富含義。

靈活運用對比與調和、對稱與平衡、節奏與韻律以及留白等手段,通過空間、文字、圖形之間的相互關係建立整體的均衡狀態,產生和諧的美感。如對稱原則在頁面設計中,它的均衡有時會使頁面顯得呆板,但如果加入一些富有動感的文字、圖案,或採用誇張的手法來表現內容往往會達到比較好的效果。點、線、面作為視覺語言中的基本元素,巧妙地互相穿插、互相襯托、互相補充構成最佳的頁面效果,充分表達完美的設計意境。

三維空間的構成和虛擬現實:網路上的三維空間是一個假想空間,這種空間關係需藉助動靜變化.圖像的比例關係等空間因素表現出來。在頁面中,圖片、文字位置前後疊壓,或頁面位置變化所產生的視覺效果都各不相同。通過圖片、文字前後疊壓所構成的空間層次不太適合網頁設計,根據現有瀏覽器的特點,網頁設計適合比較規範、簡明的頁面,儘管這種疊壓排列能產生強節奏的空間層次,視覺效果強烈。網頁上常見的是頁面上、下、左、右、中位置所產生的空間關係,以及疏密的位置關係所產生的空間層次,這兩種位置關係使產生的空間層次富有彈性,同時也讓人產生輕鬆或緊迫的心理感受。現在,人們已不滿足於HTML語言編製的二維Web頁面,三維世界的誘惑開始吸引更多的人,虛擬現實要在Web網上展示其迷人的風采,於是VRML語言出現了。VRML是一種面向對象的語言,它類似Web超級鏈接所使用的HTML語言,也是一種基於文本的語言,並可以運行在多種平台之上,只不過能夠更多地為虛擬現實環境服務。

網頁設計中多媒體功能的利用:網路資源的優勢之一是多媒體功能。要吸引瀏覽者注意力,網頁的內容可以用三維動畫、FLASH等來表現。但要由於網路帶寬的限制,在使用多媒體的形式表現網頁的內容時不得不考慮客戶端的傳輸速度。

結構清晰並且便於使用:如果人們看不懂或很難看懂您的網站,那麼,他如何了解你的企業和服務呢?使用一些醒目的標題或文字來突出您的產品與服務。並且即使您擁有最棒的產品,如果客戶從您的網站上不清楚您在介紹什麼或不清楚如何受益的話,他們是不會喜歡您的網站的,這就是網頁設計的失敗。

導向清晰:網頁設計中導航使用超文本鏈接或圖片鏈接,使人們能夠在您的網站上自由前進或後退,而不會讓他們使用瀏覽器上的前進或後退。我們在所有的圖片上使用「ALT」標識符註明圖片名稱或解釋,以便那些不願意自動載入圖片的觀眾能夠了解圖片的含義。

快速的下載時間:很多的瀏覽者不會進入需要等待5分鐘下載時間才能進入的網站,在互聯網上30秒的等待時間與我們平常10分鐘等待時間的感覺相同。因此,我們會建議您在網頁設計中盡量避免使用過多的圖片及體積過大的圖片。我們通常會與客戶合作,將主要頁面的容量控制在50K以內,平均30K左右,確保普通瀏覽者頁面等待時間不超過10秒。

非圖形的內容:我們在必要時適當使用動態「Gif」圖片,為減少動畫容量,應用巧妙設計的Java動畫可以用很小的容量使圖形或文字產生動態的效果。但是,由於在互聯網瀏覽的大多是一些尋找信息的人們,我們仍然建議您要確定您的網站將為他們提供的是有價值的內容,而不是過度的裝飾。讓客戶明確您所能提供的產品或服務並讓他們非常方便地訂購是您獲得成功的重要因素。如果客戶在您的網站上產生了購買產品或服務的慾望,您是否能夠讓他們儘快實現嗎?是在線還是離線?測試實際上是模擬用戶詢問網站的過程,用以發現問題並改進網頁設計。我們通常與用戶共同安排網站測試。

內容更新與溝通:企業Web站點建立后,要不斷更新網頁內容。站點信息的不斷更新,讓瀏覽者了解企業的發展動態和網上職務等,同時也會幫助企業建立良好的形象。在企業的Web站點上,要認真回復用戶的電子郵件和傳統的聯繫方式如信件.電話垂詢和傳真,做到有問必答。最好將用戶的用意進行分類,如售前一般了解.售後服務等,由相關部門處理,使網站訪問者感受到企業的真實存在並由此產生信任感。注意不要許諾你實現不了的東西,在你真正有能力處理回復之前,不要懇求用戶輸入信息或羅列一大堆自己不能及時答覆的電話號碼。如果要求訪問者自願提供其個人信息,應公布並認真履行個人隱私保承諾。

7 網頁 -分類

靜態網頁
  靜態網頁,其內容是預先確定的,並存儲在Web伺服器之上。   

特點:  
1,製作速度快,成本低   
2,模板一旦確定下來,不容易修改,更新比較費時費事   
3,常用於製作一些固定板式的頁面。   
4,通常用於文本和圖像組成,常用於子頁面的內容介紹。

動態網頁
  動態網頁,是取決於由用戶提供的功能,並根據存儲在資料庫中的網站上的數據中創建的頁面。

8 網頁 -保存技巧

網頁網頁
在上網過程中遇到精彩的文章、圖片、flash常常會把它們保存下來已備日後查看。保存網頁的基本方法就是用瀏覽器帶的保存功能。點擊瀏覽器的菜單文件->另存為,輸入文件名,保存類型可以選擇網頁,全部(*.htm;*.html)Web檔案,單個文件(*.mht)文本文件(*.txt)。
保存網頁的過程中常見的問題:網頁不能保存、保存失敗,有些網頁禁止了滑鼠右鍵,不能複製。採用瀏覽器自帶的「另存為」保存網頁的時候,有時進度條前進速度非常緩慢,最後提示「保存網頁失敗」,這中情況主要是由於網速慢或對方的伺服器忙導致有部分文件不能下載引起的。網頁採用腳本禁止了"Ctrl+v"和右鍵菜單功能,有些網頁不僅禁止使用右鍵菜單功能,而且禁止使用了滑鼠拉選文字的功能。

除了採用瀏覽器自帶的「另存為」保存網頁之外還可以通過下列方法來保存網頁,可以有效解決網頁不能複製、保存失敗等問題。

將網頁保存為圖片。如果想要完整保存頁面,通過屏幕拷貝的方式將網頁保存為圖片不失為一種很好的方法,這特別適合做設計的人員,需要看的是網頁的整體。
保存部分有用內容。事實上我們保存網頁時往往是僅需保存網頁中的正文部分,整個網頁內容一大堆,正文也就一小部分。一種辦法就是用"拷貝"、"粘貼"的方法將正文複製到word然後保存。你想象過只要點一下滑鼠即可完成保存你需要的正文部分,不用你手工"拷貝"、"粘貼"呢?  
現在保存網頁也講人工智慧,智能化的網頁保存工具網童就實現了這樣的功能,他能夠自動識別並提取網頁正文內容,在瀏覽器中點擊滑鼠右鍵,選擇「網童,取網頁正文」,網頁正文在一個新的窗口中顯示可編輯、保存。還可以一鍵將網頁保存為word文件,保存的是乾乾淨淨的網頁正文,而且還包括下一頁,省去很多的複製、粘貼操作。
批量保存網頁內容。要想批量保存網頁內容那隻能採用第三方工具了,瀏覽器本身不提供這種功能。最常見的就是下載工具了,如網際快車、迅雷,建立一個網頁下載列表然後後下載工具下載。這種方法只能下載鏈接指向的html文件,不能下載關聯的圖片等文件。第二種方法就是網路爬蟲,這種工具可以把自動抓取網頁及其相關鏈接的文件。
上面這兩種方法都有一個問題就是只要是指向的鏈接都取,不能區分是否有用。批量保存網頁內容最好的方法就是採用智能型的網頁保存工具——網童。事實上我們保存網頁經常只需要網頁的正文內容,保存工具應當自動的智能化的識別網頁正文內容,然後自動提取這些信息。網童不但可以批量保存網頁而且自動提取正文內容並把網頁內容彙編在一起。

上一篇[瘋牛病]    下一篇 [比爾·蓋茨]

相關評論

同義詞:暫無同義詞