㈠ web版本的網頁設計有哪些應該怎麼做
1.確定網頁的主體色調風格。
我們製作自己的網頁首先應該對自己的網頁有一個整體的規劃，是建一個什麼類型的網站，網站主色調使用哪種顏色、設計布局採用什麼樣的方式等這些都需要有一個很好的規劃。
2.規劃網站的整體布局——導航、按鈕、圖片、文字的排版方式。
做什麼事都不能盲目的沒有目的的進行，那樣只能浪費時間浪費精力，在我們製作網頁之前一定要對網頁的基本元素進行一些設計。可以簡單的畫草圖，或者瀏覽幾個自己比較喜歡的網站學習借鑒。
3.准備和歸類素材——圖片、音頻、視屏、文章等。
製作一個網頁需要大量的文件，我們必須先將這些不同類型的文件進行歸類放置，整理到一個文件夾中。
打開Dreamweaver軟體，新建一個站點，然後在站點下建立不同的文件夾存放素材。
.4建立自己的主頁，按照之前的定的風格設計布局。
不要急著添加圖片和文字，先將導航欄，標題欄和內容欄都規劃好然後在進行素材的導入。注意無論是文件夾的名還是素材名最好使用英文而不是中文。中文狀態很容易報錯，文件添加後就不要更改文件路勁了，否則會導致文件的丟失。
5.製作網頁是一個非常復雜的過程，如果想從頭到尾自己製作一個網頁的話是很難說清楚的，所以這里就分享一個很簡單的方法。
找到一個適合自己風格或是自己比較喜歡的網頁，右擊滑鼠——另存為。
這時瀏覽器就會將這個網頁中的所有的元素都復制下來，存放到一個文件夾中。
6.打開Dreamweaver軟體代開剛剛下載的網頁，這時Dreamweaver中就會顯示你下載網頁的所有元素，不會出現丟失的情況。
7.替換網頁中的元素即可。
選擇需要進行修改的圖片或是文字直接更換即可。選擇一個元素然後在下面的屬性欄中進行更換即可。同時還可以更換圖片的大小和其他的屬性。
8.按下F12進行預覽效果即可。不滿意的地方進行修改，一定要注意隨時保存文件。
㈡ 移動開發中導航欄和搜索欄在設計中應該注意哪些問題
一、導航欄位置
在iOS上，導航欄是指顯示在應用程序頂部，位於狀態欄下方的容器區域，層級應高於當前頁面內容。在安卓上，Google公司在Material Design中也賦予了它同樣的定義，但是卻給了它另一個名稱，頂部應用欄（ Top App Bar）。
導航欄是用於構架當前屏幕的內容，闡述當前屏幕的狀態，並且起到連接父子級頁面層次結構的作用。很多人疑惑，為什麼標簽欄不能叫做底部導航？因為標簽欄是構架了多個屏幕之間平級頁面的內容切換，和導航的定義沒有任何關聯。
二、導航欄UI設計規范與實際項目的應用
基本的導航欄容器一般承載的信息可能會有：標題；導航按鈕；內容控制項按鈕；其他控制項（比如搜索欄、分頁標簽或分頁控制項等）；千萬別忘了還有分割線。
1、導航欄標題設計規范
2017年以前的移動端規范下的導航欄還是循規蹈矩的，樣式單一。但隨著iPhone X等一系列全面屏手機相繼問世後，移動設備在屏幕高度上有了進一步的擴展，界面設計在一屏內的發揮空間也隨之增加。iOS11發布後，大標題導航欄設計風格興起，隨後被引入平台規范。
於是現在iOS與Material Design在導航欄上也都定義了兩種導航欄標題規范：常規標題與大標題。
常規標題是指在高度為88px（iOS@2x下）的導航容器中，居中放置一個當前頁面的標題。標題字型大小一般為34px-38px（34px為iOS標准規范，但實際項目中可以在盡量在不小於34px標準的情況下根據設計需求確定）。
大標題是將導航欄欄高增加到192px（iOS@2x），保留高度為88px的導航容器來承載內容控制項按鈕，將標題下墜居左。iOS的標准規范定義大標題的字型大小為68px。但由於英文有大小寫區分，在視覺上有一定的層次表現，而中文因為缺少一定的層次結構，並且相同字型大小的中文視覺大小大於英文，所以大多數時候我們在進行大標題設計時，會適當縮小，一般為56px-64px居多。
大標題導航欄的優點毋庸置疑，頁面留白更多，呼吸感更強，大氣現代、更高，因為頁面標題巨大，能夠幫助用戶快速確認當前所處位置；採用統一的大標題，讓頁面布局風格快速統一。但缺點也顯而易見，因為增加了導航欄的高度，導致屏幕利用率降低，一些通過廣告變現或更加註重一屏內內容呈現的應用便中和了常規導航與大標題導航的優缺點，進行了風格改進。
2、導航按鈕及內容控制項按鈕設計規范
iOS規定導航按鈕位置僅能用於放置返回按鈕，可以添加一個層級的麵包屑，幫助用戶有效地明確當前頁面層級；Material Design中，則不僅可以放置返回按鈕，還另有作用，菜單圖標-用於打開導航抽屜 或者 關閉圖標-關閉工具欄。
與iOS的定義有著天壤之別，iOS非常明確地賦予了工具欄的定義，並且將導航欄和工具欄（Toolbars）徹底地分離開，典型案例就是Safari。在內容控制項上iOS與Material Design也大相徑庭，Material Design不去限制你的內容控制項多少，因為它提供了溢出菜單，並可以根據屏寬的變化，自適應釋出和收納溢出菜單中的控制項。
而iOS則規定我們，要給內容控制項按鈕足夠多的空間，必要的時候，隱藏導航欄標題也未嘗不可。真實的項目中我們經常為了快速落地，會存在一稿適配雙平台的情況。這時候我們應該遵從哪一個平台的規范呢？答案是：許多大廠的做法已經向我們驗證，規范不分家。
在iOS諸多的應用中溢出菜單早已普及，盡管這是Material Design提出的設計理念。雖然國內遵從Material Design進行Android應用設計的情況相對較少，但它提供的設計理念與方案卻並不局限在安卓平台。
3、分割線設計規范
分割線只是一種體現形式，我想要表達的是，別忘記區分導航欄與內容界面的視覺層級關系。Matetial Design提醒我們，頂部應用欄可以與內容位於同一高度，但滾動時，請增加導航欄的視覺高度，讓內容在其後方滾動。而iOS則默認採用了背景模糊的方式區分了導航欄與內容區域的層級關系。
4、其他控制項
關於其他控制項，iOS只在規范中提及到了分頁控制項。蘋果設計師考慮到部分場景在當前頁面中還存在信息層級結構劃分，此時建議可以在導航欄中使用分段控制項。
國內的應用程序早已將導航欄容器的作用發揮到極致，基於導航欄層級始終高於內容區域的特性，我們通常可以將分段控制項、分頁標簽、搜索欄等等用戶可能隨時使用的工具放在導航欄中。
導航欄用於構架當前屏幕的內容，闡述當前屏幕的狀態，並且起到連接父子級頁面層次結構的作用，在一個頁面發揮著重要作用，設計好導航欄不僅僅是視覺上的工作，表現的方式、承載的按鈕與組件、滾屏時的組合操作還能給用戶帶來極大的體驗增益。因此掌握好導航欄的設計技巧對一名設計師來說尤為重要！
搜索框
在視覺上以下兩點比較需要注意：
1、放大鏡圖標
使用圖標。我不想對其會增加找到搜索欄的速度進行強調。越簡單越好。越少的細節能夠保證用戶能快速地掃視它。雖然，只有一個圖標本身而沒有一個可輸入的容器或按鈕實際上會使搜索變得更加困難。人們通常會意識到，一個放大鏡圖標顯示的是一個搜索工具，即使它沒有標簽。但是糟糕的是，只有一個圖標則會使搜索更加困難。
2、一個真實的搜索按鈕
並非每個人都是學會在網上沖浪的千禧一代，這意味著，並不是每個人都知曉在他們輸入查詢之後需要按下Enter鍵。在搜索輸入旁邊添加一個實際的按鈕將幫助用戶確認他們的下一步行動，進而減少用戶所需的認知負荷。
輸入特色：
確保可輸入的長度不會太短。諾曼集團的相關研究表明，一個能輸入27個字元的輸入框，可以滿足90%的用戶需求。
添加佔位符可以幫助過濾用戶查詢行為
㈢ 怎樣用dw製作導航欄下拉菜單
1、先打開Dreamweaver。如果事先有好的web源文件，可以直接單擊「文件打開」打開web源文件。如果沒有，請單擊「文件」「新建」以創建新的web源文件。
㈣ 怎麼用web前端代碼實現這部分超鏈接的菜單欄
簡單明了，大概的思路就到這里，剩下的只能靠你自己了，自己思考過才知道裡面的奧秘！
<div class="xxx">
<ul>
<li>
<ul>
<li> <a href=「#」></a> </li>
<li> <a href=「#」></a> </li>
<li> <a href=「#」></a> </li>
<li> <a href=「#」></a> </li>
<li> <a href=「#」></a> </li>
<li> <a href=「#」></a> </li>
</ul>
</li>
<li>
<ul>
<li> <a href=「#」></a> </li>
<li> <a href=「#」></a> </li>
<li> <a href=「#」></a> </li>
<li> <a href=「#」></a> </li>
<li> <a href=「#」></a> </li>
<li> <a href=「#」></a> </li>
</ul>
</li>
</ul>
</div>
㈤ 在網頁和UI設計中提到有7±2法則，能詳細介紹一下嗎
1956年美國科學家米勒對人類短時間記憶能力進行了研究，他注意到年輕人的記憶廣度為5-9個單位，就是7±2法則。與席克定律類似，神奇數字 7±2 法則也經常被應用在移動應用交互設計上。
因為人腦處理信息的能力有限，所以它通過把信息分成塊和單元來處理復雜問題。7±2法則應用很廣泛，例如iPhone通訊錄中的手機號碼被分割成”xxx-xxxx-xxxx“的形式，還有銀行卡號、身份證號，我們總是喜歡把一長串數字拆分開來讀寫，目的就是降低記憶成本，提高信息的易讀性，從而達到視覺防錯的作用。
Web導航欄選項卡數量不超過9個
在設計網頁導航時，如果希望用戶記住導航區域的內容或者一個路徑的順序，那麼數量應該控制在7個左右（不超過9個），如蘋果、Dribbble、behance等網站的導航分類。
Web導航欄選項卡數量過多時
如果導航或選項卡內容很多，可以用一個樹狀層級結構來展示各級別關系，但要注意其廣度和深度的平衡。例如人人都是產品經理和Dribbble，把更多子類別收在二級目錄里。
移動端選項卡導航
在移動端應用設計中，常見的電商app例如奈雪和樂凱撒分類模塊，兩個產品的商品分類布局形式很相似，都是用了選項卡的方式來分類商品，層級明確，相應的提升了用戶找尋單品的效率。
Tabbar區標簽最多不超過5個
在移動應用設計中，底部Tabbar最少3個，最多為5個（幾乎沒幾個超過5個），這樣做除了減輕用戶記憶負擔，超過5個會降低視覺和操作上的體驗。事實上就算只有4個，我們也經常想不起微信底部的4個Tab分別是啥。
頂部導航欄頁簽
我們看到的大部分app頂部導航欄的頁簽數量都嚴格遵循了7±2法則，雖然在橫軸可無限滑動，
但在顯示區域只保持7±2法則的顯示數量，例如馬蜂窩、飛豬旅行等。
金剛區圖標不超過8個
我們常說的“八大金剛”就是一屏顯示8個圖標，超過的則放在第二屏。如果兩行10個，往往第十個是“更多”入口，總的來說也沒超過9個。
banner文案不超過9個字
產品運營banner文案字數通常控制在9個字以內，在設計時也通常把長標題一分為二排兩行，便於用戶快速閱讀，提升點擊率。
在交互設計中，7±2法則是減少用戶認知負荷，提升用戶體驗的重要環節。同時還強調了在設計過程中對產品的預見性，避免在不斷為產品添加功能時，破壞原有的視覺基礎。
㈥ 請問樹形導航欄的標准尺寸是多少 另請問在WEB設計規范中的相關尺寸信息，此問題為額外懸賞。
樹形結構的導航欄尺度要和你的頁面風格一致，如果你沒有這個標準的話，可以隨便打開一個網站看看他們的。（橫向）一般的高等為140px，寬度就看你的顯示數據了，（豎向）寬度就看你的字元多長了，高等自動
㈦ 網店視覺的導航設計是怎樣的
導航是用來瀏覽網頁的工具。它可以是按鈕或者是文字。在每個頁面上顯示一組導航，顧客就可以很快又很容易地找到他想瀏覽的網頁。導航是網頁設計中的重要部分，也是整個Web站點設計中的一個獨立部分。
現在有些賣家都有一個誤區，以為導航就是分類。其實不然，導航是一個功能型按鈕，在店鋪頁面中的作用是引導買家快速查看需要的產品。而分類是屬於包含與被包含的關系，但是我們可以理解為分類是導航的一種。設計出自己的導航後，我們會根據目標用戶群的搜索點擊對導航進行優化，這絕不僅僅是只把分類重新整理一下就可以了，而應從產品導航入口入手，進行優化。
通常按位置可以將導航劃分為以下三個區域：
（1）頂部導航：產品分類、搜索欄、自定義頁面（如品牌故事、會員專區、購物須知等）。
（2）左側欄導航：產品分類、在線客服、收藏店鋪按鈕、熱銷產品列表、商品推薦、其他超鏈接（如手機店鋪、加入幫派等）。
（3）自由導航：隨意地自由地編排導航，讓導航更具個性，給人耳目一新的感覺。一般很多設計師會把自由導航設計成產品類目圖片（文字）＋可以指向某一分類或自定義頁面，進行詳情頁跳轉等。
盡管導航的位置和形式都不同，但目的都是給顧客提供更直接的購買路徑。導航承載的信息內容有：基本營銷信息（如新品、熱賣、折扣等）；搭配套餐；主題營銷；官方活動（如淘金幣、聚劃算、淘畫報等）；產品分類（如功能、材質、季節、價格、人群歸屬等）；交互模塊（如幫派、微博、手機店鋪、店鋪收藏等）；輔助信息（如品牌故事、幫助中心、信用評價、會員中心、客戶承諾等）；客服支持（如客服旺旺、服務說明等）；搜索控制項（如搜索框、關鍵詞推薦等）。
導航在店鋪中承載著舉足輕重的作用，顧客進入店鋪能停留多久基本全靠它。當顧客進入店鋪時如果找不到方向的話，是不會繼續瀏覽網店的。其實網店導航並不復雜，就是通過讓產品的層次結構可視化，告訴我們店鋪里有什麼。在設計導航時應該遵循「快為先」的原則，不要為了頁面的美觀，特意將導航復雜化，設計為「精美圖片＋文本＋超鏈接」形式。從用戶體驗的角度來講，大多數買家已經習慣了簡單明了的導航，如果導航設計讓買家花時間去思考下一步該點什麼，那麼這個導航就是失敗的。所以導航的設計不要過於浮誇，應從用戶體驗出發，以最快速的方式讓顧客找到自己想要的東西。
㈧ web前端導航條怎麼做
導航條一般用ul li標簽+css樣式來做，具體導航內容根據你的需求來加，一般來說直接加後台欄目的調用碼，這樣方便你後面後台操作
㈨ WEB APP 下面添加一個 導航欄，怎麼實現求助。
這個導航欄，其實就是選項卡
㈩ web前端入門，導航欄右側放什麼按鈕合適
要看是企業站還是電商網站每個網站不同，設計規劃也不同，這是屬於UI設計師的工作
按鈕的話放什麼按鈕都可以主要還是看要什麼效果
按鈕直接用<buttom></buttom>就可以做
鏈接用<a></a>