1、請教如何設計這樣一個頁面的布局結構
布局就是以最合適瀏覽的方式將圖片和文字排放在頁面的不同位置。不同的製作者會有不同的布局設計。網頁布局有以下幾種常見結構:
1.「同」字型結構布局
所謂同字型就夠就是指頁面頂部為「網站標志+廣告條+主菜單」或主菜單,下方左側為二級欄目條,右側為鏈接欄目條,屏幕中間顯示具體內容的布局。
這種布局的優點是充分利用版面,頁面結構清晰,左右堆成,主次分明,信息量大;缺點是頁面擁擠,太規矩呆板,如果細節色彩上缺少變化調劑,很容易讓人感到單調缺乏。
2.「國」字型布局
「國」字型布局是在「同」字型布局基礎上演化而來的,在保留「同」字型的同時,在頁面的下方增加一橫條狀的菜單或廣告,是一些大型網站所喜歡的類型。一般最上面是網站標題及橫幅廣告條,接下來就是網站的主要內容,左右分列一些兩小條內容,中間是主要部分,與左右一起羅列到底,最下面是網站的一些基本信息、聯系方式、版權聲明等。這種結構是在網上見到的最多的一種結構類型。
這種布局的優點是充分利用版面,信息量大,與其他頁面的鏈接切換方便,缺點是頁面擁擠,四面封閉,令人感到憋氣。
3.T型布局
這是一個形象的說法,是指頁面的頂部是「網站標志+廣告條」,左面是主菜單,右面是主要內容。這種布局的優點是頁面結構清晰、主次分明,是初學者最容易上手的布局方法;缺點是頁面呆板,如果不注意細節上的色彩,很容易讓人「看之無味」。
4.「三」字型布局
這種布局多用於國外站點,國內用得不多。特點是在頁面上有橫向兩條色塊,將頁面整體分割為但部分,色塊中大多放廣告條、更新和版權提示。
5.對比布局
顧名思義,這種布局採用左右或者上下對比的方式:一半深色,一半淺色。一般用於設計型站點。優點是視覺沖擊力強;缺點是將兩部分有機地結合比較困難。
6.POP布局
POP引自廣告術語,是指頁面布局像一張宣傳海報,一一張精美的圖片作為頁面的設計中心。這種類型基本上是出現在一些網站的首頁,大部分為一些精美的平面設計結合一些小的動畫,放上幾個簡單的鏈接或者僅是一個「進入」的鏈接,甚至直接在首頁的圖片上做鏈接而沒有任何提示。這種布局大部分出現在企業網站和個人主頁,如果處理得好的話,會給人
帶來賞心悅目的感覺。
7.Flash布局
這種布局是指整個或大部分幅面的網頁本身就是一個Flash動畫,它本身就是動態的,畫面一般不叫絢麗、有趣,是一種比較新潮的布局方式。其實這與封面型結構是類似的,只是這種類型才採用了目前非常流行的Flash,與封面型不同的是,由於Flash強大的功能,頁面所表達的信息更豐富,其視覺效果及聽覺效果如果處理得當,絕不差於傳統的多媒體。
2、網站信息結構設計要求有哪些
如何創建一個好的網站。有一大堆的關於可用性、界面設計以及網站設計的書可以參考。如今,我們都知道一個好的站點應該有:非常好看的設計、友好的界面、毫無缺點的結構、智能化的後台處理以及非常優秀的內容。唯一被大多數人所忽視的可能是交互性。
在網站設計上經常使用的是一些文字的交互,但是文字交互的效果到現在位置還是非常模糊,除非你每日醉心於交互性設計,否則你根本難以描述什麼叫做"交互"。
如何把我們的注意力集中在交互性上還是繼續讓我們的想像力馳騁?我想,問題在於我們能把我們從媒體上獲得的一些簡單的理論用於我們的實踐。我們需要記得的是網站包含哪些內容?網站的結構是什麼?我們最初的目的是什麼?
不同於其它媒體的"網站交互"
不象其它大多數媒體,如我們看電視,聽收音機或者瀏覽雜志,網站它不是一個被動的媒體。
我們不能真正的觀看網頁。顯而易見,我們可以調出一個網站,然後坐在那裡目不轉睛的瀏覽,如果我們坐在那裡吃爆米花的話,網頁並不能夠自動的變化內容(當然,你可以在右手使用的滑鼠的同時,不停的用左手把爆米花塞到你的嘴裡,這里所述的意思是,如果你不幹預,訪問網站和看電視的最大區別是訪問網站需要根據你的主動選擇)。瀏覽網站的內容根據你的個人喜好,在眾多的連接和下拉菜單中選擇你喜歡或者關心的內容或者連接到另外一個站點。
網站具備大多數媒體所不具備的特殊性:用戶的選擇和主動性。
與此相反的是,許多的出版者的決定來自於意見反饋表、感覺或者來自於電視、收音機和出版物等所有信息的體驗。我們對正在播出的電視、收音機節目基本不具備控制的能力(當然,如果您是電台的工作人員除外),我們僅僅能作的是對你的電視或者收音機作些什麼,而對於內容控制,我們則無能為力。你可以調低音量或者調高音量,或者換個頻道,甚至關閉電視機或者收音機,去作其它的事情,比如到外面散散步,或者到四合院里和鄰居們聊天。
我們可以訂閱或者退訂報紙或者雜志,選擇我們喜歡閱讀的文章,或者給內容編輯寫信探討關於內容的見解或者疑問。但是這些選項還是和網站所能作的不能相比。但是,對於熱門內容的經常[此屬臟話,已被過濾:經典論壇]互,已經成為越來越清晰的表現出對這方面的需求。
不確定的網站交互周期
從應用的觀點來說,我們可以對某事作用於某人我們該做什麼什麼樣的交互給出一個簡單的定義。但,這的確是一個含糊的概念,所以對於某些特定某件事件的交互性的常常有很多的討論,意見多種多樣。
從開始連接上網開始,網站上有太多關於交互性的例子了。比如文本下的下劃線,靜態圖片或者諸如活潑的JavaScript翻轉動畫等動態精美圖片,面對這些令人炫目的特效,實質上呢,這些連接本質上也是靜態的。直到我們對那些連接感興趣的時候,我們才會決定用滑鼠去點擊。
一旦點擊,相關的頁面將出現文字,圖表,表格或者你感興趣的其它內容,這樣你就立刻可以得到滿足(當然,前提是該連接正確有效,而且該連接所在的伺服器和網路保持正常連接而且運行正常)。
網站的交互體現在,作為一種媒體,網站將會對你的選擇做出響應,然後訪問者就可以循環似的選擇,連接到其它的頁面。重復的作這些,繼續點擊,用戶的選擇就可以及時從伺服器得到響應,這是一個非常讓人愉快的過程。
這樣的通過訪問者的手就能夠控制的交互能力對於電視雜志來說是基本不可能實現的。交互性,也是一種"關系"。作為網站開發者或者設計者,學習如何讓我們的良好的視覺設計和技術開發能力和交互性兼顧,將讓網站的訪問者包括我們自己都會為此感到愉悅。
當然,連接不是交互性的全部,但的確是網站結構和設計的核心和靈魂,就象這個世界本身就令我們非常著迷一樣。
必須要理解網站結構
了解站點的結構是非常重要的,特別是對於你要處理大量的數據來說沒有比這個更重要的事情了。當網站的多個欄目有成百上千的文檔需要管理或者有規則的添加新文件的時候,了解站點的結構成為頭等大事。
了解了網站的結構,我們就可以通過網站結構達到控制文件管理的目的。接下來,通過我們理解的網站結構,我們不但要知道我們的網站將和訪問者的動作如何相互影響,而且要利用我們先進的後台技術,不留痕跡的讓這種交互過程變得強大和有效。
當然,我們知道最初的網站並不想成為一個圖形媒體。最初的想法是創建一個方便存取的文本文件以快速連接文件。舉例來說,如果一個醫生要發表一項關於內科的研究成果共同行參考,他或者她就可以在超級終端的純文本環境裡面,將他的論文的連接加入到一個醫學研究的相關目錄。雖然,今天的站點看起來和以前有很大不同,很多的網站有著非常漂亮的圖形界面,豐富的媒體格式和在線游戲等等,但是其本質並沒有改變。它僅僅是對我們未經訓練的眼睛來說有了明顯的變化。
互動式媒體現在被稱為"新媒體"。"新媒體"以它的交互性與常見的諸如報紙、雜志、書、收音機、標準的動畫片、電視和電影等靜態媒體區別開來。
網頁正快速的從純文本向圖形化過渡。一旦我們使用的圖形瀏覽器開始支持圖形文件格式,文本連接就變成了圖形連接。如今,通過使用形形色色的HTML,CSS和JavaScript(一種越來越廣泛使用無需連接大應用伺服器和資料庫就可以產生交互功能的編程語言)的連接越來越豐富。然而,需要強調的是,我們創作的時候依然要重視網站的基本結構。
最好的方法,是使用一個白板把你腦子裡面的想法畫出來。首先,先畫出站點的基本構成,然後就要考慮有那些令人感興趣的頁面可以可以鏈接到其它哪些頁面,依靠集體的力量最終完成該站點。使用更多的線性結構,可以對訪問者以更好的指引。
最終畫出仔細構思的網站結構
你面臨的最大的挑戰是將你的想法畫出來。如果你現在已經因工作的壓力快要發瘋的時候,建議你出去走走,坐在樹下,用草稿紙畫個草圖也許感覺會輕松一些。先畫出主要的部分,一開始不要使用文字,僅僅把需要重點表現出來的頁面或者站點單元按需要畫出框圖即可。然後,回過頭來想想有幾種可能關聯到那些部分,是否是唯一關聯的部分。按照這樣的方法,在創作的道路上,你可能最終得到令人驚喜的結果。其實,類似於這樣的考驗並不常有,但是對於站點製作人員來說,通過這樣的方法可以受益很多。全面使用你的大腦,你將得到一個更具可用性的站點。
3、如何將網站界面設計做到更好
想將網站界面設計做到更好需要有非常專業的知識,據我了解的是需要在下面的幾個知識中下很大的努力:
設計知識,沒有設計的基礎如何能設計好一個好的網站界面?
色彩搭配,色彩搭配都不會,那如何確定網站的主色調和如何根據網站的主題來搭配色彩?
結構知識,一個好的網站結構一定要好,不好的結構容易造成不知道用戶需要的內容在哪裡的感覺.
舒適性,先自己體驗自己設計的網站,問問自己覺得自己滿意沒有,如果自己都不滿意,那用戶怎麼會滿意,客戶怎麼會滿意?
其實網站界面主要如果不涉及到代碼方面的知識主要還是要看你的設計美術功底,所以學好設計美術才是能進一步提升網站界面基礎
4、網站頁面布局結構該怎麼寫
這一步很多時候可以省略掉,因為很多站都是設計好以後再去做SEO的。不過很多程序員或美工不太懂SEO,因此SEOer接手網站後還得去修改代碼。典型的就是企業站大量使用表格的問題,往往也是非常頭疼。除非你比較精通DIV+CSS,不然還是找專業人士修改代碼吧,值得注意的是SEO部門如何與技術部門配合好。 第二步,了解行業和產品(選擇好關鍵詞)不少SEOer為了SEO而SEO,殊不知在不了解某一行業和產品的情況下,即便你的網站SEO做的很牛。但是沒有轉化率,無法賣掉產品。導致網站沒有盈利,這樣SEO做的再好也是枉然。對於英文站來說,推薦使用Google AdWords Keyword Tool關鍵詞工具。不過也不能完全依賴於工具。也需要根據產品特點選擇更多的關鍵詞,對於產品網站來講長尾詞很重要,數量也比較多。這些關鍵詞選擇好後要整理成excel文件,方便記錄。 第三步,做好內容和關鍵詞布局(包括站內內鏈建設)內容是網站的基石,雖然說原創的內容有助於提高網站的權重,但是不一定就是用戶喜歡的。有時候即便是偽原創的文章,只要是用戶喜歡的,就是好內容。產品網站最根本的是用戶體驗和轉化率。關於關鍵詞的布局,我一直遵循「四處一詞」的原則:1、當前頁面的標題上出現這個關鍵詞。2、當前頁面關鍵詞標簽、描述標簽里出現這個關鍵詞。3、當前頁面的內容里,多次出現這個關鍵詞,並在第一次出現時,加粗。4、其他頁面的錨文本里,出現這個關鍵詞。 第四步,有計劃的做好網站外鏈建設我建議用最簡單有效的方式:換外鏈資源,多認識幾個同行,然後去和他們換些資源,當然都是純手工發的外鏈資源。國外的博客資源比較豐富,比如:wordpress、ELGG等。
5、網頁布局結構有哪些?
一、簡介:布局就是以最合適瀏覽的方式將圖片和文字排放在頁面的不同位置。不同的製作者會有不同的布局設計。
二、網頁布局有以下幾種常見結構:
【1】「國字」型布局:
「國」字型布局由「同」字型布局進化而來,因布局結構與漢字「國」相似而得名。其頁面的最上部分一般放置網站的標志和導航欄或Banner廣告,頁面中間主要放置網站的主要內容,最下部分一般放置網站的版權信息和聯系方式等。
【2】T型布局
T型布局結構因與英文大寫字母T相似而得名。其頁面的頂部一般放置橫網站的標志或Banner廣告,下方左側是導航欄菜單,下方右側則用於放置網頁正文等主要內容。
【3】標題正文型
標題正文型布局的布局結構一般用於顯示文章頁面、新聞頁面和一些注冊頁面等。
【4】左右框架型布局
左右框架型布局結構是一些大型論壇和企業經常使用的一種布局結構。其布局結構主要分為左右兩側的頁面。左側一般主要為導航欄鏈接,右側則放置網站的主要內容 .
【5】上下框架型
上下框架型布局與前面的左右框架型布局類似。其區別僅在於是一種上下分為兩頁的框架。
【6】綜合框架型
綜合框架型布局是結合左右框架型布局和上下框架型布局的頁面布局技術。
【7】POP布局
POP布局是一種頗具藝術感和時尚感的網頁布局方式。頁面設計通常以一張精美的海報畫面為布局的主體。
【7】FLASH布局
FLASH布局是指網頁頁面以一個或多個Flash作為頁面主體的布局方式。在這種布局中,大部分甚至整個頁面都是Flash。
6、網站建設頁面結構都有哪些
網站結構主要包括四方面:
一,友好的網站結構
1, 扁平or樹型:
2, 鏈接結構
1)首頁鏈接應該鏈向重要的頻道頁,頻道頁再鏈向下面的節點頁或普通頁面。同時,頻道頁、節點頁和普通頁面都應該可以鏈回到首頁
2)無論哪些頁面之間互相鏈接,都需要一個描述恰當的錨文本
3)鏈接不要放在js、flash等搜索引擎不可見的位置,使用圖片做鏈接入口應該完善alt標簽
二,通過導航讓百度更好地認識站點
對於用戶,導航要解決的問題是:我在網站的什麼位置,我想看上一級、甚至上上一級更多內容的入口在哪裡;對於spider,導航要解決的問題是:這個頁面屬於哪個領域,要表達的主題是什麼。所以說,清晰的導航系統不僅有助於提高用戶體驗,對seo的意義也是重大的,所有seo做得出色的網站基本都擁有清晰明確的導航。
三,合理的domain結構
除了在網站建設的時候站長會思考到底使用二級域名還是子目錄,在網站運營的過程中,也會考慮是否要把子目錄的內容拆分成二級域名。
四,url結構很重要
1,url結構規律化:同一個網頁有不同url,會造成多個url同時被用戶推薦導致權值分散;同時百度最終選擇展現的那個url不一定符合你的預期。站點應該盡量不把sessionid和統計代碼等不必要的內容放在url,如果一定要這樣做可以通過robots禁止百度抓取這些非規范url
2,最好能讓用戶從url即可判斷出網頁內容,便於蜘蛛解析的同時便於用戶間傳播
3,url盡量短
4,不要添加蜘蛛難以解析的字元
5,動態參數不要太多太復雜,目前百度對動態url已經有了很好的處理,但是參數過多過復雜的url有可能被蜘蛛認為不重要而拋棄
7、如何設計規劃企業網站的頁面布局及結構
布局就是以最合適瀏覽的方式將圖片和文字排放在頁面的不同位置。不同的製作者會有不同的布局設計。網頁布局有以下幾種常見結構:
1.「同」字型結構布局
所謂同字型就夠就是指頁面頂部為「網站標志+廣告條+主菜單」或主菜單,下方左側為二級欄目條,右側為鏈接欄目條,屏幕中間顯示具體內容的布局。
這種布局的優點是充分利用版面,頁面結構清晰,左右堆成,主次分明,信息量大;缺點是頁面擁擠,太規矩呆板,如果細節色彩上缺少變化調劑,很容易讓人感到單調缺乏。
2.「國」字型布局
「國」字型布局是在「同」字型布局基礎上演化而來的,在保留「同」字型的同時,在頁面的下方增加一橫條狀的菜單或廣告,是一些大型網站所喜歡的類型。一般最上面是網站標題及橫幅廣告條,接下來就是網站的主要內容,左右分列一些兩小條內容,中間是主要部分,與左右一起羅列到底,最下面是網站的一些基本信息、聯系方式、版權聲明等。這種結構是在網上見到的最多的一種結構類型。
這種布局的優點是充分利用版面,信息量大,與其他頁面的鏈接切換方便,缺點是頁面擁擠,四面封閉,令人感到憋氣。
3.T型布局
這是一個形象的說法,是指頁面的頂部是「網站標志+廣告條」,左面是主菜單,右面是主要內容。這種布局的優點是頁面結構清晰、主次分明,是初學者最容易上手的布局方法;缺點是頁面呆板,如果不注意細節上的色彩,很容易讓人「看之無味」。
4.「三」字型布局
這種布局多用於國外站點,國內用得不多。特點是在頁面上有橫向兩條色塊,將頁面整體分割為但部分,色塊中大多放廣告條、更新和版權提示。
5.對比布局
顧名思義,這種布局採用左右或者上下對比的方式:一半深色,一半淺色。一般用於設計型站點。優點是視覺沖擊力強;缺點是將兩部分有機地結合比較困難。
6.POP布局
POP引自廣告術語,是指頁面布局像一張宣傳海報,一一張精美的圖片作為頁面的設計中心。這種類型基本上是出現在一些網站的首頁,大部分為一些精美的平面設計結合一些小的動畫,放上幾個簡單的鏈接或者僅是一個「進入」的鏈接,甚至直接在首頁的圖片上做鏈接而沒有任何提示。這種布局大部分出現在企業網站和個人主頁,如果處理得好的話,會給人
帶來賞心悅目的感覺。
7.Flash布局
這種布局是指整個或大部分幅面的網頁本身就是一個Flash動畫,它本身就是動態的,畫面一般不叫絢麗、有趣,是一種比較新潮的布局方式。其實這與封面型結構是類似的,只是這種類型才採用了目前非常流行的Flash,與封面型不同的是,由於Flash強大的功能,頁面所表達的信息更豐富,其視覺效果及聽覺效果如果處理得當,絕不差於傳統的多媒體。