1、網頁設計中的,網頁布局有幾種方式?哪種方式最快?
頁面布局就一種 就是HTML+CSS
看怎麼樣代碼越簡練越好
如果一個DIV 就能設定好LOGO的位置了 何必劃分那麼多個表格
如果文章列表裡有時間 作者等信息 甚至是一些類似EXCEL表的東西 需要每列對齊 那LI肯定排版不如表格來的方便 代碼頁簡練 那就用TABLE來做
盡量用最少的代碼 來做頁面就最好了
如果有上百個頁面 很多部分比較類似 就使用iframe嵌套的頁面 或者用程序里的include來包含頁面最好 比如頂部包含頁面 底部包含頁面 菜單頁面 左側頁面 右側頁面 都單獨獨立出來
2、我想為自己家鄉設計一個網站,就是想不出有創意的網頁布局,誰可以幫我設計一下頁面
網頁設計與網站建設 應用Macromedia DreamWeaver 8,Macromedia Flash 8,Macromedia FireWorks 8 設計網站至少包括5個欄目,整個站點的網頁數不少於10個,站點中使用圖片數不少於20個。主頁上最少有8個鏈接,其中必須包含5個以上站內鏈接。主頁名稱保存為index.html或index.asp,路徑保存在站點根目錄下,圖片保存在根目錄下images文件夾中。技術方面:HTML、表格、模板,框架、層、時間軸、超聯接、樣式、表單、行為、庫、導航條、下拉菜單、圖像查看器等
內容方面:文本、聲音、圖像、動畫、視頻、符號等積極健康向上的內容
其它:特效(時間、狀態、滑鼠、頁面過渡等)
主題突出,內容充實、健康向上,布局合理、結構清晰、規范;
色彩搭配合理、美觀,設計新穎,有創意;頁面布局盡可能平衡,色彩應用注意諧調,文本注意格式化
3、如何做好網站設計的主題網頁布局
這個問題說簡單也簡單,說復雜也復雜,為什麼簡單呢?因為就那幾個點,排版布局顏色留白等,難的在於如何排版如何選取顏色這些,排版可以根據喜歡的風格來選擇,禁忌密集化,多留點空白,顏色選取的話可以根據企業LOGO來選擇避免出現3種以上的顏色
4、描述網頁設計的一般步驟
一、網站結構設計
網站結構設計包含網站欄目設計和網站模塊設計以來確定網站提供服務的一種邏輯表現形式,也是網頁之間的層次關系。
1.網站欄目能起到提綱挈領額作用
2.網站欄目具有清晰導航的功能
3.網站模塊要做到順序清晰且緊密結合
二、網站主題設計
網站主題設計實際就是網站視覺呈現風格的設計。網站的主題風格要能充分吸引用戶的注意力,為用戶提供愉快的訪問體驗。
1.設計能反映網站內容的logo,並且將logo放在網站的醒目位置。
2.網站的顏色要統一,要突出網站的主調色彩。
3.相同類型的圖像要有相同的效果。
4.網站要有一句明晰的宣傳標語。
三、網站布局類型
1. 國字型布局
這種布局類型分為上邊欄、左邊欄、中間內容區、右邊欄和底部的頁腳區域,其形狀酷似一個「國」字。國字型結構是目前比較常用的一個網頁布局結構,它適用於信息分類繁多、需要良好組織的網站。
2. T字型布局
這種布局類型由上邊欄、左邊欄、內容區、下邊欄組成,其形狀有點像一個英文字母寫的「T」字。T字型結構網站目前在一些權威機構、企事業單位的公司網站出現得比較多。
3. 左右框架型布局
這類網站主要由左邊欄和內容區組成,組成比較簡潔,主要用於精彩內容的呈現,主要是很多個人站點、博客的首選。
4. 上下框架型布局
這類網站由上下邊欄組成,上邊欄用來放置logo和鏈接等信息,下邊欄用來放置網頁的內容。上下型網站經常用來進行個性化展示,在企業門戶網站的公司展示中也比較常用。
5. 標題正文型布局
這類網站的布局結構由上邊欄和內容區組成,上邊欄用於顯示文章的標題。主要用於顯示文章的標題,內容區放置文章的內容,這類布局在一些論文、學術網站的設計中比較常用。
網站設計都不會單獨使用以上列出的某一種布局結構,而是通過混合使用多種布局結構來實現自己想要的效果,這類布局通常稱為「綜合性布局」。
四、網站頁面設計
網站頁面是網站的最終表現形式。網站頁面由頁面內容的質量度和頁面的美觀度來決定。頁面設計應該遵循的原則如下:
1.符合企業的行業屬性和企業特點。客戶打開網站能直觀感受企業所傳遞的理念和特徵。
2.符合用戶的瀏覽習慣。根據網站內容的重要性進行排序,讓用戶花最短的時間能夠找到自己需要的信息。
3.符合用戶的使用習慣。將用戶經常使用的功能放在網站的醒目位置。
4.圖文搭配。
5.利於搜索引擎優化。減少圖片和動畫,多使用文字描述,以便於搜索引擎收錄,讓客戶更容易找到你。格子網路解答。
5、網頁設計的布局有哪幾種
網頁設計的布局有哪幾種?
1.「國」字型:
2.拐角型:
3.標題正文型:
4.左右框架型:
5.上下框架型:
6.綜合框架型:
7.封面型:
8.Flash型:網頁設計
9.變化型:網頁設計
6、如何對網站欄目進行設計和策劃 構思方法篇
當確定了一個方向後就可以開始圍繞這個方向去找相關文章。1.參考你認為跟你的網站類似的網站欄目,有些網站還是知名網站,他們不是傻子,分類欄目也經過了思考2.把你自己所想到的網站欄目作為關鍵字來搜索。你的欄目越特別,你越能找到不一樣的網站,發現不一樣的欄目3.看這些網站的關鍵字,這些關鍵字對於這些網站來說沒有重要到能成為欄目分類的程度,但是未必不適合你其實整個過程就是自己思考欄目分類+參考其他網站分類欄目的過程。目的是獲得足夠多的分類,來篩選,同時獲得足夠寬的思路,可能發現一些在沒看到他之前你不會想到,看到之後發現這才是真正適合你自己網站的欄目分類也不一定。舉例:這是我在查找過程中看到的一個相關網站的關鍵字:「產品經理,移動互聯網,核心競爭力,豆瓣,微博,it,項目管理,需求變更,客戶需求,pm,工作計劃,交互設計師,用戶體驗,產品規劃,產品設計,80後產品經理,求職,hr,產品標准,kpi,工作量,產品經理考核」你是不是發現了很多你沒想到的詞語?這些說不定正好適合我的網站,至少能開拓我的思路。這是我在其他網站獲得的跟我所想的相似的欄目分類名稱:「網站設計 網站定位 網站策劃 網站推廣 網站運營 網站規劃」這些分類各有相似之處,又各有不同,如何篩選?這就需要用到搜索引擎,我將會寫一篇文章講解如何利用SEO優化。
7、如何設計有效的網頁布局?麻煩告訴我
什麼是布局? 「布局」是指頁面內容的尺寸、間距及位置。有效的布局對於幫助用戶快速找到他們想要的內容至關重要,並可以在結構外觀上令用戶感到舒服。如何設計有效的布局?1.具有清晰的視覺層次。布局應當讓頁面各元素之間的關系和重要性一目瞭然。你可以通過適當使用下列屬性來實現視覺層次:焦點:指用戶首先關注的區域。形式上被賦予焦點屬性的UI元素一定要表達重要的內容。視覺流:指用戶關注區域的順序。可以根據任務邏輯和用戶的瀏覽習慣來設計恰當的視覺流。好的視覺流應該清晰、合理、順暢、自然。02020202020202
020202020202020202
關聯:在邏輯上相關的UI元素應具有清晰的視覺關系。0202020202020202020202020202 錯誤:02020202020202020202020202
02020202020202020202020202 邏輯上相關的UI元素在空間上被分隔,且沒有明顯的視覺關聯。對齊:使頁面工整,信息呈現有序,便於用戶掃視。02020202020202020202020202 錯誤:02020202020202020202020202
02020202020202020202020202 沒有對齊影響了頁面效果且不便於用戶掃視。不要因為功能需要和對極限情況的顧慮而輕易犧牲掉頁面的視覺展現。強調:可以根據UI元素間的相對重要程度進行強調。2.針對用戶的閱讀模式來設計布局。大部分人的閱讀習慣是從左向右,至上而下。閱讀分為沉浸式閱讀(immersive reading)和掃視(scanning),前者的目的在於理解,後者在於定位。02020202020202
020202020202020202
瀏覽網站時,用戶不會沉浸在UI本身,而是沉浸在他們的目標任務中,因此掃視是最常使用的閱讀模式。用戶只在確信必要時才仔細閱讀大量文本。針對掃視的布局設計可以適當強調主要的UI元素,弱化次要的。包括:020202020202020202020202 1)將主UI元素放在掃視路徑上。
020202020202020202020202 2)避免將重要信息放在左下角或者頁面底端或者需要滾動很多的控制項上。
020202020202020202020202 3)考慮使用漸進展開方式來隱藏次要的UI元素。
020202020202020202020202 4)將任務相關的重要信息要直接表現在控制項上。用戶更傾向於關注交互控制項上的標簽,而不是輔助型的靜態文本。
錯誤:
02020202020202020202020202 02020202 用戶必須閱讀輔助型文本後才能明確「確定」按鈕的作用。02 正確:
直接將按鈕的作用描述作為控制項標簽,便於用戶理解。02020202020202 5)不要展示大段文本,去除不必要的文本。多文本時格式化展示。註:常規模式也存在例外。眼動議實驗指出,真實用戶的行為很沒有規律。此模式的目的在於幫助你做出更好的決定,而不是精準的描述用戶行為。3.合理利用頁面空間。保持頁面的視覺平衡。避免擁擠和對空間的浪費。確保關鍵數據沒有被截斷,除非數據特別長。02020202020202020202020202 錯誤:02020202020202020202020202
02020202020202020202020202 邏輯上相關的UI元素在空間上被分隔,且沒有明顯的視覺關聯。控制項的尺寸和間距恰當,沒有不必要的滾動。一個任務盡量在一屏內完成。實際情況中,我們用戶的頁面空間要小於屏幕解析度,它會因各種因素而壓縮,如:非全屏操作(彈出窗口和對比瀏覽),瀏覽器本身及各種輔助欄對屏幕的佔用等,設計中要考慮這些情況。02020202020202
020202020202020202
4.不要讓布局本身成為突出的UI元素,保持視覺簡潔(visual simplicity)。減少內容和展現上的嵌套層級。減少控制項不同尺寸的數量,例如,在界面上只使用一兩種按鈕寬度。採用輕量級的分組和分割方式,可以用布局本身和分隔符代替分組框。使用盡量少的對齊線。5.選擇與頁面類型相匹配的版式。在設計之初,應充分考慮頁面承載的內容、功能和屬性,繼而選擇適合該頁面的版式。不合適的版式會造成用戶的閱讀困擾,降低任務的完成效率。標准和規范:1.柵格化:我們所說的柵格化是指在網頁設計工作中對柵格系統的建立和應用。網頁柵格系統來源於平面柵格系統,它以規則的網格陣列來指導和規范網頁中的版面布局以及信息分布。柵格化可以使信息呈現工整簡潔、美觀易讀,降低頁面開發和運維成本。它結構變化相對靈活,擴展性強。022.以8px為橫向柵格單位:以8px為橫向柵格單位,頁面所有元素寬度都可以是2的倍數,包括圖片和版塊寬度,這樣可以在一定程度上加快頁面(特別是對於J-PEG圖片)的渲染速度(基於計算機內部二進制的運算機制)。其在擴展和兼容性上也有一定優勢。在阿里巴巴中文站中,布局間距的最小單位為8px,布局區塊採用32px(8px*4)和24(8px*3)兩種粒度單位,分別組成以下兩種可實現的柵格系統:02020202020202 32px:適用於市場、社區等相關頁面
02020202020202
02020202020202 24px:適用於旺鋪相關頁面
3.頁面定寬:自適應可以根據瀏覽器顯示情況自動調整頁面寬度,但是因為用戶水平方向的聚焦范圍有限,所以當頁面過寬時,用戶的瀏覽和操作成本會增加;而當頁面過窄時(如用戶同時開啟兩個瀏覽器對比查看商品搜索結果),自適應則會導致布局變形和內容錯亂。給頁面規定寬度可以避免這些問題。在綜合考慮當下主流解析度情況、瀏覽器外觀對顯示空間的佔用、人機工程學中對水平視角和聚焦范圍的規定以及8px單位等多種因素後,我們認為960px是一個相對更加合理的頁面寬度。在阿里巴巴中文網站中,推薦使用定寬960px的頁面,去除左右各4px的邊距,中間的可視寬度為952px。更多
8、網頁布局設計九大類型的特點,每個類型哪些網站比較適合、好什麼好處?我是要寫論文用的,急求!!!
1、區塊型
為了網站優化的效果,目前區塊型布局現在出現非常頻繁,在網頁上各個區域具有封閉的邊界,經過合理放置顯得清晰美觀。但這種布局有一個缺點,就是由於片面固定,各區域很難根據其中的內容的多少而調整大小,因此該布局不太適用與那些區域內容長度經常變化的網頁。
2、國字型
國字形也可以稱之為是同字型,通常頂部是網站的標題,廣告橫幅,然後是網站的主體內容,而左右分別是一些較小的內容條,中間就是主要內容,最底部經常會展示網站的一些基本信息、聯系方式、版權聲明等,這種布局方式是目前網上最常見,出現頻率最高的。
3、門戶型
這種網頁布局最大的特點就是內容多,信息量大,圖片較少,一般都是通過文字排版產生視覺上的分區效果。這種版式小編個人很喜歡,但是以用戶角度分析的話,很容易讓用戶產生視覺疲勞,很可能會對用戶體驗造成影響。
4、Flash型
其實這種布局與下面要說的封面型很類型,但它與封面型不同的是,由於Flash強大的功能,因此它頁面所表達的的信息更加的豐富,器視覺效果機聽覺效果都非常棒,處理的很得當,絕對不亞於傳統的多媒體。
5、左右框架型
該框架結構是將左右分為兩頁,一般布局都是左邊是導航鏈接,最上面是一個小的標題或標致,而右面就是主要內容。通常論壇類的網站經常會採用此種布局,該布局的特點是結構清晰明了。
6、拐角型
其實,這種類型的網站布局與國字型有很多的相似之處,只是形式上不同而已。最頂部也是網站的標題以及網站的橫幅廣告條,最常見的類型就是最上面是標題及廣告,左側是導航鏈接。
7、封面型
這種類型最常出現的就是一些網站的首頁,多事精美的平面結合小動畫,另外在加上幾個簡單的鏈接或僅是一個「進入」鏈接,沒有任何的提示。
8、標題正文型
這種形式的網站布局也非常的常見,一般上面是網站的標題,或是類似的東西,接著就是網站的正文內容,例如一些文章或注冊登錄頁面。
9、上下框架型
這種局部類型與左右框架布局非常的類似,唯一的不同時這種類型是上下兩頁的框架。
10、綜合框架型
作為的綜合框架型其實就是左右框架和上下框架的結合體。