POST TIME:2018-12-03 21:32
文章介紹了當今主流瀏覽器及部分小眾瀏覽器的搜索框設計思路,希望大家可以從中獲取一些靈感。
在瀏覽器中,搜索框無疑處于相當重要的一環——瀏覽器滿足的核心需求是搜索,而搜索框正是打開這一基本功能的“鑰匙”。一個好的搜索框對用戶體驗的提升影響是很大的,從頁面布局到功能設計,如何做到滿足用戶需求甚至擊中用戶痛點都是需要仔細斟酌的。今天我在這里將介紹一下當今主流瀏覽器及部分小眾瀏覽器的搜索框設計思路,希望大家可以從中獲取一些靈感。
搜索框的基本功能在當前的手機瀏覽器中,搜索框已經和網址欄融為了一體,其滿足的基本需求正如同框里那七個灰字:“搜索或輸入網址”,用戶通過在搜索框里輸入關鍵字或網址的方式來找到本身希望獲取的信息。圍繞這一核心點,產品經理們在搜索界面上花費了不少心思使其使用體驗變得更好。在這個環節我將介紹一下搜索框基本的設計思路。
當我們在瀏覽器的主界面點擊搜索框時,瀏覽器通常會跳轉到搜索界面,輸入法自動彈出,搜索框高高在上左邊是搜索圖標右邊為取消按鈕,搜索記錄則不才方以列表的形式出現。清除搜索記錄的圖標是必不成少的,位置一般在搜索記錄的最下方但我更喜歡神奇瀏覽器的布局——刪除記錄以圖標的形式呈現并在記錄的右上方以便利用戶點擊。在輸入關鍵字時搜索框下方會出現一系列的聯想,而在點擊某條聯想右邊的箭頭后,我們會發現該聯想進入搜索框并引發了又一系列的聯想。在點擊前往按鈕/搜索記錄/聯想后我們將進入搜索結果頁面,搜索這一步驟正式完成。
從上述的描述中我們可以發現移動端瀏覽器與PC瀏覽器的搜索過程并紛歧樣,在傳統的瀏覽器中,沒有專門的搜索頁面也不會出現多次聯想,而在移動端這似乎成了標配。其實這也是不得已的舉措——與電腦比擬手機的屏幕實在太小,況且輸入鍵盤也會占掉將近一半的空間,瀏覽器必需得給予一個單獨的界面讓其實現搜索功能。事實上,如何在這個界面加入更多輔助搜索的功能,是很多人都在思考的問題。
搜索框的大眾功能如同上面講的那樣,越來越多的開發者開始在搜索框上添加一些功能來使得搜索變得更加便利與有效。如今一些主流的瀏覽器都會主動對搜索框做進一步的優化來提升用戶的體驗。
首先在搜索引擎方面,瀏覽器一般是允許點擊搜索框中最左邊的圖標來進行切換的。通常的搜索引擎是百度、谷歌、搜狗、必應、神馬與360,一般視瀏覽器開發公司與這幾家搜索公司的關系而定。值得一提的是小眾瀏覽器在引擎的選擇上比主流瀏覽器更多,甚至可以自定義搜索引擎。而一些自己就在做搜索業務的瀏覽器反而拘謹的多,好比百度瀏覽器只支持使用百度搜索。
其次一些瀏覽器會加入語音搜索和掃描,用戶通過說出關鍵字便可以進行搜索,語音搜索的技術要求比較高,所以在小眾瀏覽器上很難見到,主流瀏覽器雖然大都添加了這一功能但是效果并欠好。當前大部分的手機用戶并不習慣語音文字輸入而且語音識另外精度仍有待加強。二維碼掃描則是很多瀏覽器都附帶的功能,用戶可以通過掃描二維碼來進入詳情界面。但我個人并不看好這一功能——目前主流的二維碼掃描場景中大多都是有專門應用出現的,好比支付寶二維碼和微信的二維碼,瀏覽器的二維碼掃描在這些使用環境中顯得相當雞肋。
最后在大部分瀏覽器中都會有這樣一個比較不顯眼的功能——用戶復制文字后,在搜索框中長按會出現粘貼并搜索這一選項。在UC瀏覽器中,復制的文字會自動出現在搜索框中,更是進一步精簡了搜索步驟,但隨之而來也出現了一個問題——假如用戶復制了一大段并不準備搜索的文字,搜索框中同樣會出現這一段文字,用戶還得去刪掉它。這樣一看,又無形中為用戶增添了負擔,所以如何更好地優化“粘貼搜索”是一個值得探討的問題。
搜索框的特色功能經過上面的講述,你可能以為搜索框在瀏覽器中其實是同質化比較嚴重的設計點。但在目前的主流瀏覽器中,搜索框其實是有屬于它們本身的獨特優勢的。
在QQ瀏覽器里,用戶可以選擇添加搜索標簽。好比搜索“乒乓球”,添加“熱點”標簽后的搜索結果會是當前關于乒乓球的熱點新聞,而選擇“應用”標簽則會出現一系列的關于乒乓球的應用。從圖中我們可以看到騰訊憑借著強大的內容生態圈將瀏覽器打造成了拉升其他產品流量的入口。
上一篇:APP設計:手機端搜索控件的探索
下一篇:臨摹,是設計師入行的敲門磚