Vyhľadávateľné rozbaľovacie zoznamy: Vytváranie dlhých zoznamov užívateľsky prívetivých

Rozbaľovací zoznam s 200 krajinami. Zoznam 50 štátov. Stovky možností produktov. Prechádzanie dlhými rozbaľovacími zoznamami je frustrujúce – a spôsobuje opustenie formulára.

Vyhľadávateľné rozbaľovacie ponuky Vyriešte to tak, že používateľom umožníte okamžité filtrovanie možností písaním. Namiesto rolovania napíšu „môže“ a navrchu uvidia Kanadu.

V tejto príručke sa dozviete, kedy používať rozbaľovacie ponuky s možnosťou vyhľadávania a ako ich nastaviť vo formulároch WordPressu.

Problém s dlhými rozbaľovacími ponukami

Štandardné rozbaľovacie ponuky sa stávajú nepoužiteľnými s pribúdajúcim počtom možností:

Problémy s používateľskou skúsenosťou

• Nekonečné rolovanie – Nájdenie „Spojené štáty“ v abecednom zozname krajín znamená prechádzanie cez viac ako 180 krajín
• Mobilná nočná mora – Malé oblasti posúvania na dotykových obrazovkách
• časovo náročné – Používatelia strávia hľadaním jednej možnosti viac ako 10 sekúnd
• Náchylná k chybám – Ľahko sa dá omylom vybrať nesprávna položka
• Frustrujúce – Opakuje sa pre viacero rozbaľovacích polí

Keď sa rozbaľovacie ponuky stanú problematickými

Ako fungujú vyhľadávateľné rozbaľovacie ponuky

Vyhľadávateľný rozbaľovací zoznam kombinuje textový vstup s rozbaľovacím zoznamom:

1. Používateľ klikne na rozbaľovacie pole
2. Zobrazí sa vyhľadávacie pole (alebo sa samotné pole stane vyhľadávateľným)
3. Používateľ zadá niekoľko znakov
4. Možnosti filtrovania v reálnom čase podľa vstupu
5. Používateľ vyberá z filtrovaného zoznamu

Príklad: Výber krajiny

Bez vyhľadávania: Prejdite si viac ako 200 krajín a nájdite „Nemecko“

S vyhľadávaním: Napíšte „ger“ → pozrite si Nemecko, Alžírsko, Nigériu → kliknite na Nemecko

Ušetrený čas: 10+ sekúnd → 2 sekundy

Bežné prípady použitia pre vyhľadávateľné rozbaľovacie ponuky

Výber krajiny

Klasický príklad. V 195+ krajinách je vyhľadávanie nevyhnutné:

• Napíšte „uni“ → Spojené štáty, Spojené kráľovstvo, Spojené arabské emiráty
• Napíšte „aus“ → Austrália, Rakúsko
• Napíšte „nový“ → Nový Zéland, Nová Kaledónia

Výber štátu/provincie

50 štátov USA, 13 kanadských provincií alebo regiónov po celom svete:

• Napíšte „cal“ → Kalifornia
• Napíšte „nový“ → New York, New Jersey, New Hampshire, Nové Mexiko

Kategórie produktov

E-commerce stránky so stovkami typov produktov:

• Napíšte „laptop“ → Notebooky, Príslušenstvo k notebookom, Tašky k notebookom
• Napíšte „telefón“ → Telefóny, puzdrá na telefóny, nabíjačky na telefóny

Pracovné pozície/odvetvia

Kariérne formuláre s rozsiahlymi zoznamami pracovných pozícií:

• Napíšte „inžinier“ → Softvérový inžinier, Stavebný inžinier, Strojný inžinier
• Napíšte „trh“ → Marketingový manažér, Trhový analytik, Špecialista na trhovisko

Jazyky

Jazykové preferencie s viac ako 100 možnosťami:

• Napíšte „span“ → španielčina
• Napíšte „brada“ → Čínština (zjednodušená), Čínština (tradičná)

Univerzity/školy

Zoznamy vzdelávacích inštitúcií:

• Napíšte „harvard“ → Harvardská univerzita
• Napíšte „MIT“ → Massachusettský technologický inštitút

Časové pásma

Viac ako 400 možností časových pásiem:

• Napíšte „tichomorský“ → Tichomorský/Auckland, Tichomorský/Honolulu, USA/Tichomorský
• Napíšte „new york“ → Amerika/New_York

Nastavenie vyhľadávateľných rozbaľovacích ponúk

Tu je postup, ako vytvoriť vyhľadávateľné rozbaľovacie ponuky pomocou Automatický tvorca formulárov:

Krok 1: Inštalácia automatického generátora formulárov

1. Prejsť Pluginy → Pridať nové
2. Hľadať "A.F.B.„(skrátený názov pre Auto Form Builder)“
3. Nájsť "AFB – Auto Form Builder – Vytvorenie formulárov pomocou funkcie Drag & Drop"
4. kliknite teraz inštalovať, Potom sa Aktivovať

Krok 2: Pridajte rozbaľovacie pole

1. Vytvorenie alebo úprava formulára
2. Presuňte rozbaľovací pole do formulára
3. Kliknutím otvoríte nastavenia

Krok 3: Pridajte svoje možnosti

Zadajte zoznam možností. V prípade dlhých zoznamov môžete:

• Zadajte ručne – Zadajte každú možnosť jednu po druhej
• Hromadné pridanie – Vložte zoznam možností (jednu na riadok)

Krok 4: Povoľte vyhľadávanie

V rozbaľovacích nastaveniach vyhľadajte Vyhľadateľné or Povoliť vyhľadávanie možnosť. Zapnite ju.

Rozbaľovacia ponuka bude teraz obsahovať vyhľadávacie/filtračné pole, ktoré filtruje možnosti počas písania používateľmi.

Krok 5: Konfigurácia správania vyhľadávania

V závislosti od vášho nástroja na tvorbu formulárov môžete mať k dispozícii možnosti ako:

• Minimálny počet znakov – Spustiť filtrovanie po zadaní X znakov
• Pozícia vyhľadávania – Zhoda od začiatku možnosti alebo kdekoľvek
• Zástupný text – „Zadajte text pre vyhľadávanie…“ alebo „Hľadať v krajinách…“

Najlepšie postupy pre rozbaľovacie polia

1. Vždy povoľte vyhľadávanie pre viac ako 20 možností

Ak má vaša rozbaľovacia ponuka viac ako 20 možností, povoľte vyhľadávanie. Je to také jednoduché. Používatelia vám poďakujú.

2. Použite text s jasným zástupným symbolom

Povedzte používateľom, že môžu vyhľadávať:

• „Vyberte krajinu (zadajte text pre vyhľadávanie)“
• „Vyberte si svoj štát…“
• „Hľadať alebo vybrať…“

3. Logické usporiadanie možností

Aj pri vyhľadávaní je poradie možností dôležité:

• abecedne – Najlepšie pre mená (krajiny, štáty)
• Najbežnejšie ako prvé – Umiestnite populárne možnosti na začiatok (USA, Spojené kráľovstvo, Kanada)
• zoskupené – Kategórie s oddeľovačmi

4. Uveďte bežné variácie

Používatelia môžu vyhľadávať:

• „USA“ alebo „Spojené štáty“ alebo „USA“ alebo „Amerika“
• „Spojené kráľovstvo“ alebo „Británia“ alebo „Anglicko“

Ak je to možné, uveďte bežné skratky alebo variácie, ktoré zodpovedajú rovnakej možnosti.

5. Testovanie na mobile

Vyhľadávateľné rozbaľovacie ponuky by mali na dotykových zariadeniach fungovať hladko:

• Vyhľadávací vstup je ľahko klepnuteľný
• Zobrazí sa klávesnica na písanie
• Možnosti sú dostatočne veľké na presné ťuknutie

Kedy NEPOUŽÍVAŤ vyhľadávateľné rozbaľovacie ponuky

Vyhľadávateľné rozbaľovacie ponuky nie sú vždy riešením:

Užšie zoznamy (menej ako 10 možností)

Pre 5 až 10 možností je štandardný rozbaľovací zoznam rýchlejší. Netreba písať, keď vidíte všetko naraz.

Keď používatelia nepoznajú presný výraz

Vyhľadávanie vyžaduje, aby používatelia vedeli, čo majú písať. Ak prehliadajú/preskúmávajú možnosti, kategorizovaný zoznam alebo prepínače by mohli fungovať lepšie.

Áno/Nie alebo binárne možnosti

Použite radšej prepínače. Dve možnosti vôbec nepotrebujú rozbaľovací zoznam.

Číselné rozsahy

Pri výbere vekových kategórií alebo množstva zvážte:

• Pole na zadanie čísla
• slider
• Krátky rozbaľovací zoznam (1 – 10)

Alternatívy k vyhľadávateľným rozbaľovacím ponukám

V závislosti od vašich údajov zvážte tieto alternatívy:

Textové pole automatického dopĺňania

Používateľ píše voľne, návrhy sa zobrazujú nižšie. Je to vhodné, keď používatelia zadávajú hodnoty, ktoré nie sú vo vašom zozname.

Kaskádové rozbaľovacie ponuky

Rozdeľte jeden dlhý zoznam na dva kratšie:

• Prvý rozbaľovací zoznam: Vyberte kontinent
• Druhá rozbaľovacia ponuka: Vyberte krajinu (filtrované podľa kontinentu)

Prepínače s možnosťou „Iné“

Zobraziť prvých 5 – 7 možností ako prepínače s možnosťou „Iné“, ktorá zobrazí textové pole.

Zoskupené/kategorizované možnosti

Na usporiadanie možností podľa kategórie použite optgroups:

• Severná Amerika
  • Kanada
  • Mexiko
  • Spojené štáty
• Európa
  • Francúzsko
  • Nemecko
  • Spojené kráľovstvo

Vopred pripravené zoznamy možností

Nevynájdite koleso. Tu sú bežné zoznamy, ktoré budete potrebovať:

Krajiny

195 členských štátov OSN plus územia. Zvážte umiestnenie bežných krajín (USA, Spojené kráľovstvo, Kanada, Austrália) na začiatok a potom zoradenie podľa abecedy.

štátov USA

50 štátov plus DC a teritóriá. Abecedne zoradenie funguje dobre.

Kanadské provincie

13 provincií a teritórií. Dostatočne krátke, takže vyhľadávanie je voliteľné.

Časové pásma

Použite štandardné identifikátory časových pásiem (Amerika/New_York, Európa/Londýn). Zoskupte podľa regiónu.

Jazyky

Kódy jazykov ISO so zobrazovanými názvami. Bežné jazyky uveďte ako prvé.

Industries

Štandardné zoznamy klasifikácie odvetví (NAICS, SIC) alebo vlastné zoznamy pre vaše publikum.

Úvahy o výkone

Veľmi rozsiahle zoznamy (viac ako 1000 možností)

Pre extrémne rozsiahle zoznamy:

• Možnosti načítania na požiadanie – Načítava zo servera podľa toho, ako používateľ píše
• Nastaviť minimálny počet znakov – Pred vyhľadávaním je potrebné zadať 2 – 3 znaky
• Obmedziť zobrazené výsledky – Zobraziť 20 najlepších zápasov, nie všetkých 500

Vplyv načítania stránky

Dlhé zoznamy možností zväčšujú veľkosť stránky. V prípade zoznamov s viac ako 500 možnosťami zvážte:

• Možnosti načítania cez AJAX
• Rozdelenie do kaskádových rozbaľovacích ponúk
• Používanie vyhľadávania na strane servera

Prístupnosť

Zabezpečte, aby boli rozbaľovacie ponuky s možnosťou vyhľadávania prístupné:

Navigácia pomocou klávesnice

• Stlačením klávesu Tab zaostrite na pole
• Ak chcete hľadať, zadajte
• Šípky na navigáciu v možnostiach
• Zadajte pre výber
• Únik pre zatvorenie

Čítačky obrazovky

• Správne označenia ARIA
• Oznámiť počet výsledkov
• Oznámiť vybranú možnosť

Vizuálne ukazovatele

• Jasné stavy zaostrenia
• Zvýraznená aktuálna možnosť
• Indikátor načítavania počas vyhľadávania

Často kladené otázky

Koľko možností mám, kým budem musieť vyhľadávať?

Povoľte vyhľadávanie pre ľubovoľnú rozbaľovaciu ponuku s viac ako 20 možnosťami. Pre viac ako 50 možností je vyhľadávanie nevyhnutné. Niektorí používatelia oceňujú vyhľadávanie aj pre 10 – 15 možností.

Malo by sa vyhľadávanie zhodovať od začiatku alebo kdekoľvek?

Hľadanie výrazu „kdekoľvek“ je zhovievavejšie. Vyhľadávanie výrazu „york“ nájde výraz „New York“. Hľadanie iba na začiatku je rýchlejšie pre známe výrazy.

Môžu používatelia stále prechádzať všetkými možnosťami?

Áno, rozbaľovacie ponuky s možnosťou vyhľadávania zvyčajne zobrazujú celý zoznam. Vyhľadávanie ho filtruje, ale používatelia ho môžu stále posúvať, ak chcú.

Čo ak používatelia zadajú pri vyhľadávaní chybu?

Základné vyhľadávanie nezaoberá preklepmi. V prípade dôležitých polí (ako napríklad krajina) sa uistite, že sú zahrnuté bežné preklepy, alebo použite fuzzy zhodu, ak je k dispozícii.

Fungujú rozbaľovacie ponuky s možnosťou vyhľadávania na mobilných zariadeniach?

Áno, a na mobilných zariadeniach sú často lepšie ako štandardné rozbaľovacie ponuky, pretože písanie je rýchlejšie ako rolovanie dlhým zoznamom s malou oblasťou rolovania.

zhrnutie

Vytvorte dlhé rozbaľovacie zoznamy tak, aby boli užívateľsky prívetivé:

1. Identifikujte dlhé zoznamy – Ľubovoľná rozbaľovacia ponuka s viac ako 20 možnosťami
2. Povoliť vyhľadávanie – Umožniť používateľom filtrovať text zadaním
3. Použite jasné zástupné symboly – „Zadajte text pre vyhľadávanie…“
4. Logické usporiadanie – Najprv obľúbené položky, potom abecedne
5. Test na mobile – Zabezpečte plynulý dotyk
6. Zvážte alternatívy – Kaskádové rozbaľovacie ponuky, zoskupené možnosti

Záver

Dlhé rozbaľovacie zoznamy znižujú mieru dokončenia formulárov. Vyhľadávateľné rozbaľovacie ponuky transformujte zážitok – používatelia nájdu svoju možnosť v priebehu niekoľkých sekúnd namiesto nekonečného rolovania.

Či už ide o krajiny, štáty, produkty alebo akýkoľvek zoznam s viac ako 20 možnosťami, pridanie funkcie vyhľadávania zrýchli vaše formuláre a sprístupní ich používateľom.

Automatický tvorca formulárov umožňuje vytvárať rozbaľovacie polia s funkciou vyhľadávania, čo pomáha používateľom rýchlo nájsť to, čo potrebujú, aj v tých najdlhších zoznamoch.

Ste pripravení vylepšiť svoje formy? Stiahnite si automatický nástroj na tvorbu formulárov a urobte si rozbaľovacie zoznamy užívateľsky prívetivé ešte dnes.