A Review of Consistent Designs á vefnum
Sjónræn tungumál vefsvæðisins vekur hrifningu gesti sem er langt umfram fyrstu innsýnina.
Reyndar, þegar þú fylgist með bestu vefsíðum, tekur þú eftir því að smáatriðin tala við þig meðvitundarlega og að samkvæmni bætir upplifun þína á vefsíðunni og þar af leiðandi gerir þú líklegri til að fara aftur.
Í þessari grein munum við kanna hvað gerir hönnun í samræmi , og við munum sýna fram á nokkrar af samkvæmustu vefsíðugerðunum þarna úti.
Vinsamlegast athugaðu í lok greinarinnar um samkvæmni þessara vefsvæða og ekki hika við að bæta við tenglum við aðra sem fylgja þessari reglu.
Hvað áttu við með samkvæmni í hönnun? Samkvæmt þessi skilgreining , samkvæmni er hægt að skilgreina sem: " Samræmd einsleitni eða samningur meðal hluta eða hluta."
Markmið þitt sem hönnuður er að búa til pöntun, til að auðvelda notendum að finna þær upplýsingar sem þeir leita að. Samræmi getur hjálpað þér að ná því markmiði.
Gátlista yfir upplýsingar
Í fyrsta lagi skulum við skilgreina viðmiðin sem við munum ákvarða hvort vefsíðurnar sem við endurskoðun hér eru í samræmi. Setja viðmiðanir fyrir sjálfan þig myndi einnig gagnast eigin daglegu hönnun. Eins og ég vil segja, góð hönnun er fyrst búin með góðri athugun . Hér eru viðmiðanir okkar:
Lóðrétt samkvæmni:
- Er samkvæm lóðrétt taktur?
- Er ritstjórnunin í samræmi?
- Eru einkenni valréttar í samræmi?
- Er typographic flakk fyrirsjáanlegt yfir síður?
Grafísk samkvæmni:
- Mynda myndirnar á vefsíðunni samræmdu skapi?
- Líktu litiin í myndunum saman?
- Eru áferðin í myndunum í samræmi?
- Eru stærðir myndanna í samræmi við heildar uppbyggingu vefsvæðisins og hvert annað?
Litur samræmi:
- Eru litir notaðar stöðugt yfir síður?
Táknmynd og hnappur samkvæmni:
- Eru tákn vefsvæðisins af sömu fjölskyldu?
- Styðja táknin í stærð?
Vefsvæði þarf ekki að uppfylla þessi skilyrði við punktinn, en listinn er góður upphafsstaður til að gera eigin hönnun samkvæm og samhljóða.
Allt í lagi, nú höfum við góða litla tékklista til að spila með. Skulum skoða vefsíðurnar okkar, læra af þeim og fáðu innblástur!
52 vikur af UX
Hver eru nokkrar af þessum hápunktum þessa vefsíðu:
- Hvítt rými í hausnum er jafnt skipt.
- The typography er stöðugt takt, skola vinstri með ragged hægri.
- Viðvarandi, flakkað leiðsögn efst er bæði snjall og kunnuglegt.
- Myndir fyrir innlegg eru alltaf svart og hvítt.
Núna, vegna þess að þessi grein snýst um smáatriði, vil ég benda á tveimur minniháttar málefnum með þessari vefsíðu, bæði í fótsporinu: Fyrst skaltu taka eftir því hvernig "Go" leitarhnappurinn hefur íhugun, en aðrir þættir á vefsíðunni gera ekki (bera saman, til dæmis RSS-hnappinn efst).
Í öðru lagi skaltu taka eftir því að rýmið á milli fyrirsagnanna og textans er miklu strangari í fótsporinu samanborið við restina af vefsíðunni.
Ribbons of Red
- Í fyrsta lagi mest áberandi þáttur vefsins: rauður! Fallega og stöðugt notað frá merkinu til hausanna til tengla á hnappana.
- Næst er áferð hnappategundarinnar það sama og notað er fyrir lógóið.
- Athugaðu einnig að hnapparnir eru sjónrænt öll sömu fjölskyldan, jafnvel félagsleg tákn neðst.
- Skjárinn er góður blað serif-aftur, notað stöðugt frá lógóinu til hausanna á hnappana.
- Að lokum eru textaþættirnar í gegnum vefinn samstillt stöðugt, skola til vinstri og ragged rétt.
Yaron Schoen
- Það fyrsta sem grípur auga er hvernig myndin í hausnum spilar með dýpt. Jafnvel fjórar grafíkin hér að neðan skjóta út úr ílátunum og spila með dýpt á sama hátt.
- The typography er takt fullkomlega í rist.
- Leturgerðin er vel valin og framkvæmd. Heimasíða og aðrar síður sýna einnig samfellu.
- Litirnir eru líka mjög samkvæmir, leika vel með dökkbláum til bláa græna, alla leið frá hausnum til fótsins.
Fuzzco
- Horfðu á áferðina í efstu flakki; það er einnig notað fyrir myndirnar nálægt botninum.
- Skoðaðu tegundina í hausnum yfir síðum; fallega gert með sérsniðnum Flash, sem gefur það skapandi tilfinningu.
- The serif er samkvæmur yfir heimasíðuna en brýtur svolítið á innri síður.
- Litirnir í efstu flipanum passa við fótinn, samræma og setja inn efni.
Styleboost
- Stærðin gerir þetta vefsvæði stöðugt: stórt . Stórir hnappar, stórar myndir (allt í samræmi við stærð), stór tegund, stór hvítur rúm.
- Liturinn er haldið í lágmarki og notaður vel. Ljósbláið heldur sátt og annar grátt spilar með dýpt og stigveldi.
- Hnapparnir eru allir stór og samræmdar. Þeir eru líka örlítið ávalar, sem passa við leitarreitinn.
- Grind uppbygging er einföld og segir þér hvað er að koma næst. Jafnvel fótinn er í réttu hlutfalli, sem virðist vera nálægt gullhlutfallinu.
Ljúffengt Monster
Þessi vefsíða er ekki ný, en það er fallegt í því hvernig það hefur verið stöðugt í gegnum árin og hefur ekki verið á aldrinum. Athygli á smáatriðum hefur hjálpað.
- Takið eftir áferðinni. Vefsíðan er byggð með viðarhilla, sem tengist þema hugbúnaðarins sem fyrirtækið býður upp á.
- Grafískar þættir eins og gras og plöntur halda sáttinni.
- Sérhver hlutur hefur ávalar horn, jafnvel myndatökutakkana.
- Grænt-gulur dominates síðunni, bjóða þér að slá inn þessa hugmyndaríku og eftirminnilegu heimi.
Richard Meier & Partners Arkitektar.
Það var hannað af Massimo Vignelli , sem er þekktur fyrir að hafa tök á ristina og framleiða nútíma, samkvæm og rökrétt hönnun.
- Takið eftir því að jöfnun grafískra þátta samræmist. Rennsli-vinstri gerðin í valmyndinni samræmist myndunum hér fyrir neðan.
- Lárétt regla undir undirleiðsögninni er viðvarandi og auðveldar notendum að stefna sér á vefsíðunni.
- Rýmið milli flugsins og líkamsins er í samræmi, sem gefur augað skýran leið til að fylgja.
- Og leturgerðin er einföld, skola til vinstri og sans-serif, falla stöðugt í ristina.
Liðið á eftir Upplýsingar arkitekta hefur einnig tökum einfaldleika, rist hönnunar og samkvæmni.
- Takið eftir því hvernig flakkið efst er í takt við líkamshlutfallið hér að neðan.
- Litavalið er einfalt og í samræmi: rautt, hvítt og svart.
- Þættirnir eru jafnt í takt. Takið eftir því hvernig rýmið milli láréttra reglna er í samræmi við síðu.
Wilson Miner
- Dagsetningar og meta innihald eru í takti við fyrstu dálkinn, fylgt eftir með líkamsinnihaldinu.
- Takið eftir því hvernig flakkið efst er í ristinni, aðlögun við efnið hér fyrir neðan.
- The leturfræði er einfaldur hvítur og svartur: hvítur fyrir kafla titla, svartur fyrir líkamsútgáfu.
Tapbots
- Það fyrsta sem grípur auga minn er framúrskarandi notkun hvítt rýmis, einkum jafnvægi milli merkisins og flakkanna, bæði fyrir ofan og neðan.
- Táknin virðast allir koma frá sömu fjölskyldu og skapa sátt.
- Notkun dýptar, frá efstu myndinni við myndirnar á fótunum, er einnig í samræmi.
- Litirnir passa yfir síðu: svartan efst á móti bendillinn; Rauða hnappurinn efst samanstendur af leitarhnappnum fyrir neðan; og gráa siglingar passar við gráa reitinn í fótunum.
Klára
Samræmd hönnun krefst margra verkfæra og getur verið erfitt að ná.
Ein þjórfé sem ég get boðið er að byrja með gott rist og þá byggja vírframa ofan á það. Þetta mun gefa þér sjónarhorn fuglanna á grafíkunum og hvernig þær tengjast hver öðrum.
Ofangreind dæmi ætti að gefa þér hugsun með tilliti til framkvæmd hönnunar þinnar. Samræmi samanstendur af mörgum hlutum, sem öll eru grundvallaratriði í því ferli.
Skrifað eingöngu fyrir Webdesigner Depot eftir Noam Almosnino, vefhönnuður í Brooklyn, New York. Fylgdu Noam á Twitter , eða heimsækja heimasíðu hans hellonoam.com .
Vita af öðrum samkvæmum vefsíðum að deila með okkur? Vinsamlegast birtu þær í athugasemdum!