Best Practices fyrir 6 Common User Interface Elements
Útlit og notagildi tiltekinna tengiaðilda og virkni eru mikilvæg til að ná árangri á öllum vefsíðum í markaðnum í dag.
Rannsóknir hafa sýnt fram á að jafnvel seinkunartíminn í hugsun á notanda mun veikja skynjun sína og áhuga á vefsíðu og að lokum lækka viðskiptahlutfall vefsvæðisins.
Í tilteknum veggskotum og atvinnugreinum er hægt að hafa fullkomlega viðunandi þætti í þættir sem eru ekki augljósar í notkun þeirra. Bloggið og vefur þróun iðnaður eru fullkomin dæmi.
En þegar við búum til notendaviðmót fyrir tæknilega kunnátta áhorfendur, sem venjulega er að ræða við vinnu við viðskiptavini, verðum við að tryggja að tilteknar notendaviðmótir séu ekki of langt frá því hvaða notendur eru vanir.
Þessi grein fjallar um nokkrar bestu starfsvenjur og nothæfi eiginleika sex notendaviðmóta og samninga fyrir hvert, þannig að forritarar geta búið til notendaviðbrögð sem eru bæði fallegar og einfaldar.
1. Útlit leitarreitarinnar
Á stórum upplýsinga-ríkur eða vara-þungur vefsíður, leit er konungur. Notendur hér afla venjulega hefðbundnar siglingar í hag í leitarreitnum.
Leitarreitur sem er ekki strax sýnilegur mun hafa eitt af tveimur áhrifum: 1) notandinn mun gera ráð fyrir að engin leitarniðurstaða sé til staðar, eða 2) notandinn finnur leitarniðurstöður eftir seinkaðan og hugsanlega pirrandi tíma.
Gakktu úr skugga um að leitarreiturinn á vefsíðunni þinni sé auðvelt að sjá. Myrkur bakgrunnur og ímyndaður grafík mun skila nothæfi , þannig að það sé hvítt eða ljós grátt er best. Gakktu úr skugga um að leitarreitinn sé nógu stór miðað við aðra mikilvæga þætti á síðunni, þannig að viðhalda stöðu sinni í sjónrænu stigveldinu.
The leita kassi á Ríki eftir IP passar sjónrænt þema vefsins vel, er appelsínugult og grafískt í samræmi við umhverfi þess. En ef leitarreitur á viðskiptabanka vefsíðunni var gefinn með þessari meðferð myndi það líklega vera erfitt að koma auga á.
Hönnunin er ekki hindrunarlaust á Domain by IP vegna þess að vefsvæðið hefur eina aðgerð: leit, sem er rétt á miðju síðunni. Auk þess að vera í tækni sess, hafa verktaki þess minna hvata til að standa við venju. En forðast skal þessa sköpunargáfu á stærri vefsíðum , en markhópur þeirra má ekki vera tæknilega kunnátta.
Ævintýra tími , á meðan, heldur leitarreiturinn hvítur, þægilegur stærð og auðvelt að finna á síðunni:
Þrátt fyrir að vera á erlendu tungumáli, hefur ævintýralegur tími mjög hreint leitarreit, jafnvel fyrir enskumælandi notendum. Stærð og litur kassans er bætt við stækkunarglerið, sem hefur orðið alhliða táknið fyrir leit á netinu. Notandi sem leitar að þessari virkni mun ekki hafa vandamál hér.
Þetta mynstur ætti að fylgja í öllum verkefnum sem miða að fjölbreyttri notendastöð.
Frekari lestur:
2. Augljóslega merktur samsvörun / útbreidd efni
Vefsíður njóta góðs af samanbrotnum spjöldum og fellilistanum vegna þess að þeir gera fyrir hreinni og minna ringulreiðar skipulag. Dulbúið efni í þessum viðmótsþáttum getur þó haft áhrif á nothæfi vefsvæðisins ef tilvist þeirra er ekki skýrt tilgreint.
Þegar notandi smellir á ber hlekkur eða hnapp, búast þeir við að taka á nýjan síðu. En þegar notandi smellir á tengil eða hnapp sem hefur falinn innihald vísir, búast þeir við að nýtt efni sé birt strax (með JavaScript eða AJAX) og hefur möguleika á að fela það síðar. Þannig ætti vefsíða að greina verulega milli eðlilegra tengla og tengla sem sýna nýtt efni í gegnum JavaScript .
Hægt er að tilgreina samanmöppanlegt efni, eins og í hliðarspjöldum og valmyndatré, með örvum, þríhyrningi eða Windows-eins og plús / mínusvísir. Spjaldið sem innskráðir notendur sjá á CSS Globe greinilega bendir til þess að það sé í lagi:
Hér fyrir neðan er sama síða eftir að spjaldið hefur verið stækkað til að sýna hóp virka:
Með innihaldi í spjaldið sem nú er stækkað er örin snúið 90 gráður og bendir til þess að sama efni geti nú verið falið eða hrunið. Sama meginregla er hægt að beita til að falla niður eða fljúga út valmyndir, þótt þessir myndu ekki þurfa að snúa ör. Furðu, þessi eiginleiki er oft sleppt, jafnvel á faglega hönnuðum vefsíðum.
Frekari lestur:
3. AJAX hleðsluvísir
Þegar þú bætir upplifun notenda með því að hlaða inn efni með ósamstilltum beiðnum, vertu viss um að upplýsa notandann um að AJAX beiðni sé unnin. Án þessa vísbendinga getur notandinn gefið upp bíða eða furða hvers vegna ekkert hefur gerst sem svar við smellinum.
Þú getur náð þessu á ýmsa vegu; Ein leiðin er að auðkenna "Hleðsla" eða svipuð skilaboð í eða nálægt því hvar aðgerðin mun eiga sér stað, eins og RSS lesandi Google gerir:
Efst á skjámyndinni er gulur hápunktur texti, sem birtist þegar "Merkja allt sem lesið" hnappurinn er smellt og segir notandanum að eitthvað sé að gerast.
Önnur leið til að gefa til kynna þetta er með hreyfimyndum eða glerhlaupi, sem þekki Windows notendur. An líflegur vísir er notaður á fjölmörgum vefsíðum, þar á meðal Twitter , þar sem notendur smella á "Meira" hnappinn til að skoða eldri kvak:
Þegar hnappurinn er smellt á og eftir því hraða tengingar viðskiptavinarins við miðlara birtist kunnugleg hreyfimyndræn grafík og segir notandanum að beiðni þeirra sé unnin.
AJAX hleðsla grafík er aðgengileg ókeypis frá ýmsum vefsíðum, þar af eru mörg sem leyfa þér að sérsníða grafíkina með stærð, lit og öðrum valkostum.
Þessi tegund sjónrænna vísbendinga er mikilvæg fyrir ósamstilltar beiðnir sem veita ekki vísbendingar viðskiptavina um hvaða starfsemi er hleðsla.
AJAX-líkur vísir gæti einnig verið notaður til að auka non-AJAX virkni sem hegðar sér eins og AJAX og tekur tíma til að hlaða. Þetta gæti falið í sér myndasafn sem hleðst stærri mynd þegar smámyndir eru smellt á.
AJAX hleðsla grafík og aðrar vísbendingar eru ekki í raun að flýta fyrir síðu, en þeir bæta "skynja" hleðslutíma , sem er oft jafnmikilvægt og að bæta raunverulegan hleðslutíma.
Frekari lestur:
4. Staðsetning körfu og innskráningar og skráningaraðgerðir
Þegar notendur skanna síðu fyrir "Innkaupakörfu" hnappinn eða "Skráðu núna" tengilinn er fyrsta staðurinn sem þeir líta efst í hægra horninu á síðunni. Ef þú ert ekki með sannfærandi ástæðu til að gera það skaltu halda þessari virkni á þekkta staðsetningunni, annars gætirðu hægfað á og truflað reynslu notenda.
Valkostir og aðgerðir sem falla undir þennan flokk eru "Skoða körfu", "Skrá sig út", "Skráðu þig inn", "Skráðu þig út", "Skráðu þig," "Senda tengil," "Gleymt lykilorð?" Og jafnvel "Hafðu samband. "Þetta síðasta atriði myndi venjulega vera síðasta í lárétta flipaslá.
TasteBook felur í sér fjóra slíka tengla efst í hægra horninu á uppsetningu sinni:
Maui Divers Skartgripir er annað gott dæmi og inniheldur einnig innkaupapoka grafík:
5. Dagsetningardagsetningarsnið á kreditkortaskilum
Þegar eyðublað biður um gildistíma greiðslukortsins er sniðið alltaf það sama: mánuðurinn, táknaður með tveimur tölustöfum og síðan árinu, táknað með tveimur eða fjórum tölustöfum (td 03/11 eða 03/2011). Fjögurra stafa sniðið er hvernig útgáfudagur birtist á kreditkortinu sjálfu.
Besta leiðin til þess að safna þessum upplýsingum og styrkja notendaviðmótið er að nota tvo aðskilda valhólf, einn fyrir mánuðinn og hinn fyrir árið. Ekki láta notandann færa inn gildistíma í einum textareit, jafnvel þótt þú veitir leiðbeiningar.
Hér er gott dæmi frá greiðslu síðu af Maui Divers Skartgripir:
Og hér er dæmi um lélega hönnuð gildistíma:
Þar að auki ætti mánuðarmælirinn ekki að birta nöfn mánaða en í staðinn ætti að skrá tölurnar 01 til 12. Það er engin ástæða til að hægja á notendum niður með því að gera þá grein fyrir að "08" merkir "Ágúst".
6. Auðveldlega auðkenndar tenglar
Þetta ætti aldrei að vera vandamál, en því miður sýna sumar vefsíður ekki greinilega á milli tengla og venjulegs texta í meginmálinu.
Í flestum tilfellum er besta leiðin til að benda á þennan mun á því að tengja aðra lit og leggja áherslu á þau. Í sumum tilvikum er sterkur andstæður litur einn eini; en aðeins undirlínur eða bara að breyta litinni er örlítið nóg og mun oft draga úr aðgengi.
Cameron.io gerir þetta greinarmun vel:
Þessar tenglar myndu ekki vera eins sýnilegar ef þær voru aðeins undirstrikaðar en ekki breyttar í lit. Þú myndir ekki hanna hnapp sem líktist ekki eins og hnappur, svo af hverju láta textareiknir blanda saman í meginmálið? Eins og flestir notendur grannskoða texta á netinu, skulu hönnuðir sjá til þess að öll tengsl séu auðkennd löng áður en mús er runnin yfir þau.
Frekari lestur:
Niðurstaða
Allir þættir notendaviðmótsins og aðgerðirnar sem fjallað er um í þessari grein eru mikilvægar fyrir nothæfi notkunar og gegna mikilvægu hlutverki í skynjun notandans á vörumerkinu þínu.
Mörg lítil aukahlutir geta haft mikil áhrif á skynja hraða og getur haft áhrif á að notendur fái svekktur eða óþægilegt.
Gerðu notendaviðmótin þín einföld og straumlínulaguð og fylgdu samningum þar sem hægt er. Þú munt sjá minni hoppatriði, betri viðskipti og stöðugt flæði afturferðar.
Skrifað eingöngu fyrir WDD eftir Louis Lazaris, sjálfstæður rithöfundur og vefur verktaki. Louis keyrir Áhrifamikill vefur , þar sem hann sendir greinar og námskeið um vefhönnun.
Hvernig gæti eitthvað af þessum eða öðrum notendaviðmótum verið bætt? Vinsamlegast deildu hugsunum þínum í athugasemdunum hér fyrir neðan.