設計網(wǎng)站搜索框的注意事項
讓我們一起來看看設計師們設計了一個搜索框時,可能會面臨一些經(jīng)常反復出現(xiàn)的困難和問題。
在哪里放置搜索框?
有很多可能性,但只有一對夫婦的權(quán)利的。最方便的地方,用戶的每一頁頂部的左側(cè)或頂部的權(quán)利,在您的網(wǎng)站上,用戶可以在這里輕松地找到它使用通用的F-形掃描模式。然而,傾向于把一些博客的搜索框(左或右)邊欄的底部。這可能不是一個好主意,但可能是因為廣告的考慮。
什么名字“提交”按鈕,
這是很好的做法,讓一個有意義的名稱,如“搜索”或“查找”搜索“按鈕”,而不是“去”的搜索按鈕,從整體上搜索框的設計,用戶點擊。
為用戶的搜索按鈕,在下面的圖片是非?;靵y。他們將無法計算出,如果它是一個搜索框,還是其他什么東西,雖然它是在文本字段中顯示的描述。
在哪里放置搜索框的標題,
用戶需要知道,四四方方的前瞻性的事情是一個搜索框。做到這一點最簡單的方法是告訴用戶,這是,例如,給它一個章節(jié)標題。根據(jù)公布的UXMatters的眼動跟蹤測試,節(jié)的標題是搜索框上面的左上角區(qū)域的最佳位置。這似乎是一個合理的設計決定。
要分清楚哪些用戶可以搜索,
這是一個好主意,在輸入字段中包括一個示例搜索查詢,建議給用戶的功能,可用于。但要確保這段文字被刪除時,用戶關(guān)注的鼠標的輸入字段的幫助下,一點點的JavaScript代碼可以做到這一點。
許多網(wǎng)站實現(xiàn)谷歌網(wǎng)站搜索API,它得到了其從谷歌的索引中的搜索結(jié)果。如果您使用此功能,請一定要說出盡可能多的搜索框旁邊的。用戶不喜歡意外的結(jié)果,谷歌的搜索算法可能比你的網(wǎng)站的不同,從而打破了一致性原則。
搜索框展示
請注意,它不僅是重要的搜索框的設計,但更重要的是,搜索工作正常。作為Jakob Nielsen的國家,第一個結(jié)果頁是金:“用戶幾乎從來沒有超越搜索結(jié)果的第二頁。因此,這是重要的是,你的搜索優(yōu)先級以有用的方式,結(jié)果出現(xiàn)在第一頁上所有最重要的命中?!?/p>
1。古典文學
當涉及到搜索框,最簡單的設計通常是最好的。傳統(tǒng)的輸入字段和提交按鈕的外觀很容易理解為有經(jīng)驗和沒有經(jīng)驗的用戶,因此,設計人員通常使用默認的狀態(tài),不亂來的圣杯。
這里有兩個經(jīng)典雅各布尼爾森和Fontshop的,設計沒有改變,因為早期的Web。
2?!疤峤弧卑粹o脫穎而出
我們發(fā)現(xiàn),很多設計師選擇明確突出提交“按鈕,在搜索框中脫穎而出。很多時候,輸入字段的背景顏色,適合周圍的設計元素。因此,使框更加明顯,需要視覺指針。在這種情況下,“提交”按鈕往往被賦予更加鮮艷的顏色或形狀不規(guī)則。
除了 當前半島使用一個聰明的想法,在搜索框中脫穎而出。該網(wǎng)站的整體布局大多是白色的,只有右上部是相當豐富多彩的。搜索框被放置在這個區(qū)域的底部。
3。使用放大鏡
在過去的十年中,放大鏡已經(jīng)成為傳統(tǒng)搜索圖標,并仍然經(jīng)常使用,當設計師想要傳達的搜索元素的功能。放大鏡可以發(fā)現(xiàn)的左側(cè)或右側(cè),在輸入字段中或附近的“提交”按鈕,在搜索框中附近或遠離它。我們無法確定某種特定的趨勢,因此,在大多數(shù)情況下,設計師們找到最適合他們的位置。
Decodeunicode.org有一個非常有創(chuàng)意的設計-奇怪- 。點擊放大鏡以字母“A”以上的高級搜索選項,它會打開一個模態(tài)的彈出式窗口。不要嘗試在家里還是在工作中。
很好地集成提交放大鏡按鈕:
4。使用插圖
5。在搜索框中彎
出于某種原因,設計者仍然使用圓角輸入字段和提交按鈕。這兩個因素通常設計得非常仔細,注意小細節(jié),吸引力和感染力的搜索框。我們不知道,如果這種做法是有效的,但它肯定看起來更加人性化(搜索框的默認設計)。
6。使用箭頭
有時提交按鈕被標記的文本,但不與與一個符號或字符,例如,一個箭頭。箭頭指向正確的,在某些情況下,他們指出了(奇怪的是,相當不尋常的)。
箭頭的形式提交按鈕:
向下指的箭頭很少使用:
在Erweiterungen.de,精心整合的放大鏡圖像的輸入字段中。這是一個很好的解決方案,不刺激用戶,因為設計師小心地墊的形象和輸入的文本之間的空間。
tastebook
7。使用手工
手工反擊在這個搜索框的設計:
而在這其中:
此搜索框看起來不錯,但難以辨認。
一個微小的,無害的,謙遜的手寫搜索框。
這里使用的是一個提交按鈕“返回”鍵:
8。Boxy的設計
因為他們是所謂的搜索框,許多設計進行相應的。不幸的是,這樣的設計往往是相當枯燥的,而不是真正好看。
按鈕圖標;一個相當不尋常的設計:
9。實驗解決方案
網(wǎng)頁設計師創(chuàng)作民歌。因此,這也難怪,我們已經(jīng)發(fā)現(xiàn)了幾十真的不尋常的,奇怪的,有創(chuàng)意的,絕對不恰當?shù)脑O計。它是由你來建立新的想法,在上面介紹的設計師的想法。但是,請記住:可用性應具有最高的優(yōu)先級。形式如下的功能,而不是其他方式。
在搜索框中在Uxmag.com上,打開后,點擊“搜索”鏈接。
一個神秘的搜索框,由斯特凡布赫爾設計。
本文作者來自北京傳誠信,轉(zhuǎn)載請注明出處:北京傳誠信(m.jzztb.org.cn)
選擇北京網(wǎng)站建設公司-傳誠信,優(yōu)質(zhì)服務,絕對不容錯過 !