10 Vefur Hönnun Elements sem þú ættir ekki að gleymast
Þegar það kemur að því að hanna og byggja upp vefsíður virðist það aldrei gerast nógu hratt.
Í ljósi þessarar hratt, eru mörg smáatriði sem að lokum þurfa að byggja upp vefsíðuna oft skilin út úr hönnunarferlinu. Þó að þessar upplýsingar gætu verið minniháttar, þá eru þeir það sem taka vefsíðu frá ágætis til sannarlega ógnvekjandi.
Þessar upplýsingar eru oft auðvelt að sakna þess vegna að þeir keyra ekki heildarútlitið á vefsíðunni. Vandamálið er að þar sem þróunarhópurinn vinnur í gegnum hönnunina verður það neyðist til að hanna og búa til þessa þætti fyrir þig.
Þú gætir breytt framleiðsluferlinu þannig að verktaki hafi tíma til að skila þessum eignum til þín, en hvers vegna ekki bara að gera allt gert upp fyrir framan þannig að ferlið sé svo mikið hreinni?
Jafnvel verra, þróunarliðið gæti ákveðið að fella fram og búa bara til eignir eins og þeir fara.
Þó að margir forritarar hafi mikinn áhuga á hönnun, þá verður skapandi sem er ákærður fyrir hönnun vefsvæðisins að vera sá sem áformar þessar þættir. Að skipuleggja fyrir framsækna blæbrigði getur haft veruleg áhrif á gæði endanlegs vöru.
Sérhver þáttur sem fjallað er um í þessari grein stafar af spurningu sem verktaki myndi biðja hönnuðinn ef þáttur vantaði úr hönnuninni.
Skulum grafa inn í 10 lykilþætti til að hafa í huga þegar þú pólskur þinn website.
1. Tenglar
Þó að stíll hinna ýmsu ríkja sem tengist er örugglega frekar einföld, gætirðu verið hissa á hversu oft allar aukaupplýsingar eru gleymdar. Hafa eftirfarandi ríki fyrir alla tengla á síðunni:
- Venjulegt
Þetta er sjálfgefið ástand tengil þ.e. einn sem er ekki sveiflast yfir eða smellt á eða bendir á slóð sem notandinn hefur þegar heimsótt. Þetta er tengsl sniðið sem meirihluti hönnuða nær alltaf til. - Heimsótt
Þetta er tengill sem ekki er sveiflast yfir eða smellt á en en markið hefur verið heimsótt af notandanum. - Virkur
Virk hlekkur er einn sem er að smella á notanda. Flestir hönnuðir munu endurtaka hover-ástandið hér ef stíll er ekki veittur þeim. - Sveima
Að lokum er hover ástandið það sem tengilinn lítur út þegar notandinn mýs yfir það. Þetta og venjulegu ríkin eru þær sem flestir hönnuðir undirbúa sig fyrir.
Eitt smáatriði sem oft er gleymt er að þessar ýmsu ríki þurfa að vera skipulögð fyrir allar svörtu vefsíðum. Til dæmis hafa mörg vefsvæði dökk líkamsútgáfu gegn léttum bakgrunni, en andstæða er snúið í fótinn. Þú þarft að skipuleggja fyrir allar hinar ýmsu samhengi tengla sem finnast á síðunni.
Á Full Moon BBQ , til dæmis sjáum við helstu rauða tengla innan innihaldssvæðisins og undirstöðu hvítar hlekkur í neðanmálsgreininni. Aftur, smá smáatriði en mikilvægt samt.
2. Eyðublöð
Fyrir marga hönnuði er stillingar forma mikilvægt og ómögulegt að sjást. Samt, fyrir marga aðra, virðist það koma sem fjarlæg hugsun.
Vandamálið við hið síðarnefnda viðhorf er sú að myndar tákna oft eina alvöru leiðin til að umbreyta gestum inn í viðskiptavini. Og án rétta skipulags og hönnunar gæti nothæfi þessara eyðublöða fallið flatt og lélegasta viðskiptapunktur vefsins. Undirbúningur þessara þátta er nauðsynleg, jafnvel þótt þeir virðast mun minna pressa við viðskiptavini en lit, vörumerki og myndir.
Tveir mikilvægustu forsendurnar þegar gerð er form eru:
- Form merkimiða
Eyðublöð safna yfirleitt persónuupplýsingar sem notendur eru tregir til að gefa út. Sem slík er rétt að upplýsa notendur um nákvæmlega tilgang formsins vitur. - Inntak sviðum og merki
Í öðru lagi, áætlun um hvernig inntaksviðmið myndarinnar verða sett fram á síðunni og hvernig merkin fyrir þessi reiti verða stíll og stilla miðað við reitina.
Þegar þau eru skilin til þeirra er hægt að líta út eyðublöð. En með rétta undirbúningi mun vefsíðan líta óaðfinnanlegur og vera mun skilvirkari. Skulum líta á gott fordæmi sem verður að hafa byrjað með góðri áætlanagerð:
Þetta viðskiptalegt form á Æðislegur var greinilega vel hugsað út. Öllum verkefnum og tilgangi síðunnar hefur verið metið vandlega. Frá titli og kynningu á útliti hvers reit af reitum, með merkimiðum og stjórnunarstílum, er þetta eyðublað líkan af áætlanagerð.
Skipuleggja fyrir eyðublöð leiðir okkur í raun til nokkurra annarra þátta ...
3. Hnappur hegðun
Hnappar geta verið notaðar í gegnum vefsíðu í ýmsum tilgangi, en þau virðast líka oft vanrækt, eins og hinar ýmsu ríki hnappsins. Fjögur ríki hnappa eru:
- Sjálfgefið
Þetta er sjálfgefið ástand hnappsins og bíða eftir því að smella á það. Flestir hönnuðir ná yfir þetta en missa af hinum. - Sveima
Höggbúnaðurinn sést þegar notandinn músar yfir hnappinn. Þetta ástand er gagnlegt til að gefa notandanum upplýsingar um að hnappinn sé aðgerðarmikill hlutur. - Smellur
Þegar notandinn smellir á hnappinn, gefur þetta ríki til kynna að þau hafi smellt á það. Að veita þetta sjónmerki getur hjálpað til við að draga úr gremju notenda. - Óvirk
Öruggt ástand hnappanna er kannski minnst notað en getur verið mjög gagnlegt fyrir forritara. Sjaldan er þetta ástand skipulagt nema hönnuður hafi útbúið staðfestingarferli fyrir eyðublaðið (sjá næsta kafla).
Mjög eins og hin ýmsu ríki tengla, vertu viss um að huga að hinum ýmsu ríkjum hnappanna sem notaðar eru á vefsíðunni þinni. Frá sprettiglugga inn á eyðublöð til að leita að reitum í nýskráningarblöð fyrir fréttabréf, munu allar þessar hnappar þurfa samsvarandi stíl.
4. Formgilding
Mikilvægt tengt smáatriði er formgilding. Þetta er mikilvægt atriði þar sem vefsíðan miðlar notandakröfum og villum í formi. Það eru þrjár meginatriði sem þarf að huga að:
- Nauðsynlegir reitir
Tilgreindu öll nauðsynleg reiti. Oftast er þetta gert með stjörnu, eins og sést á Vinsamlegast hefjið frá upphafi :
- Rauntímavottun
Sumir löggildingar geta verið gerðar í rauntíma þar sem notandinn lýkur forminu. Þessi tegund af staðfestingu upplýsir notandann eins fljótt og auðið er um vandamál með þau gögn sem þeir hafa inntakað. Þetta er hægt að ná mjög vel með þessu jQuery löggildingarforrit :
- Eftiráritun staðfestingar
Þessi tegund af staðfestingu gerist eftir að notandinn hefur sent eyðublaðið. Stíllinn, sem er notaður í sannprófun í rauntíma, er oft endurtekin hér, en annar kostur er að tengja öll villur í eina skilaboð, eins og sést á Moo :
5. Stöðugleiki: villur, viðvaranir, staðfestingar osfrv.
Notendur munu venjulega þurfa einhvers konar endurgjöf eftir að hafa framkvæmt aðgerð á vefsíðunni þinni. Líklegasta atburðarásin er eftir að hafa sent inn eyðublað, en margar aðrar viðburður geta einnig komið fram. Farðu vandlega með vefsíðuna þína og þær aðgerðir sem notendur gætu tekið og áætlun um þau skilaboð sem vefsvæðið þarf að hafa samskipti við.
Á Lífið í dag , sjáum við staðfestingarskilaboð sem geta auðveldlega þjónað sem alþjóðleg stíll fyrir villuboð. Og með smávægilegum breytingum á litum og táknum gæti það einnig verið notaður fyrir lúmskur viðvörun eða jafnvel staðfestingarskilaboð:
6. Lengja bakgrunninn á stærri skjái
Það fer eftir stíl vefsvæðisins, en bakgrunnsþættirnir geta verið vandræði fyrir forritara þína. Flestar bakgrunni er einföld og krefst ekki mikillar undirbúnings, en sumir eru flóknar með stigum, mynstri og myndmálum.
Í ljósi þess að stórir skjáir eru að verða fleiri og algengari og að flestar hönnun er fyrirhuguð um 960 pixla breitt upphaf, er mikið af skjánum fasteignum opið. Ef bakgrunnurinn þinn inniheldur eitthvað afar flókið þarf hann að skipuleggja hvernig það nær til að fylla stærri skjái.
Í dæminu sem ég reisti hér að neðan þurfti ég að koma til móts við tré áferð sem stóð í öllum áttum. Ekki það sem þú vilt þola hönd verktaki takast á við.
7. Grundaðu HTML þætti
Fyrir afritaþungar vefsíður eru hönnun og hönnun grunn HTML-þætti grundvallaratriði og ætti ekki að vera gleymast. En á mörgum markaðsstarðum vefsíðum sem hafa upptekinn skipulag og sérstaka sjónræna stíl eru grunnþættir gleymdar. Og auðvitað, verktaki aldrei fær langt í að búa til vefsíðu áður en að þurfa að framleiða venjulega síðu sniðmát engu að síður.
Hér eru grunnþættirnir alltaf ætlaðar fyrir: málsgreinar, fyrirsagnir 1 til 6, óreglulegar og pantaðar listar, töflur, formasvið, myndir og feitletrað og skáletrað texti.
Á mörgum vefsvæðum sem ég vinn á, setti ég saman leiðbeiningar um stíl til að aðstoða verktaki, eitthvað svona:
8. Netfang tölvupósts
Eitt sem ég sé ekki neina hönnuðaáætlun fyrir er vefsíðutengda tölvupóst. Slík grunnþáttur er auðvelt að missa af því að það er ekki venjulega kjarnaáherslan á vefsíðunni. Og enn er tölvupóstur öflugt tól sem getur stuðlað að og framlengt þjónustu.
Tillaga mín er að fara vandlega yfir innihald vefsins á skipulagsstigi til að leita að tölvupósti sem gæti verið sent. Sumir algengustu eru:
- Skráning staðfesting póstlista,
- Skráning staðfesting,
- Staðfesting á eyðublöð (svo sem fyrir tengiliðsform),
- Pöntunarprófun eftir kaup.
Ef þú vilt virkilega blása hugum viðskiptavina og forritara skaltu undirbúa tölvupóstmarkmiðmát fyrir vefsíðuna líka. Þú veitir notendum óaðfinnanlega umskipti frá vefsíðunni til pósthólfsins og þú heldur áfram að hafa nákvæma stjórn á vörumerkinu í mismunandi formum.
9. Stækkun síðu
Spurningin um hvernig hönnun mun teygja til móts við breyttu efni er einnig sjaldan brugðist við en gæti verið mikilvægt, allt eftir stíl vefsvæðisins. Skulum skoða dæmi þar sem þetta gæti hafa verið slegið upp:
Full Moon BBQ hefur þétt heimasíða. Þessi hönnun leyfir ekki mikið hreyfingu eða breytingu á innihaldi. Allt hefur ákveðna stærð og staðsetningu. Svo hvað gerist ef eigendur ákveða að lengja velkomna skilaboðin eða bæta við mynd? Sem betur fer hafa þeir skipulagt fyrir þetta. Eins og þú sérð í þessum mock-up, ég hef breytt síðunni til að innihalda tvöfalt texta. Síðan nær fullkomlega og rúmar það:
Að undirbúa aðra útgáfur af skipulagi með miklu meira efni getur verið mjög gagnlegt til að sýna hvernig á að skipuleggja slíka atburðarás.
10. Teiknimyndir: sprettigluggar, verkfæri, umbreytingar osfrv.
Á venjulegu HTML og CSS website (þ.e. án Flash) eru hreyfimyndir og umbreytingar svo auðvelt að sjást. Og þegar þau gleymast munu þeir oft ekki einu sinni koma til móts við það. Svo ef hreyfimyndir eru mikilvægar er besti kosturinn þinn að veita verktaki sýnishorn um hvernig þeir ættu að vinna þannig að vöran virki eins og hún ætti.
Sumir af algengustu stöðum hreyfimyndanna eru í:
- Verkfæri
Þessir litlu sprettigluggar þegar notendur músar yfir þætti. - Image rotators
Heimasýningar eru öll reiði, og margs konar valkostir eru tiltækar fyrir umbreytingar og stíl. - Ljós kassi
Þú getur stíll ekki aðeins ljósaborðið sjálft, heldur einnig umskipti yfir í það.
Hvert þessara hreyfimynda hefur sérstaka sjónræna stíl sem þarf að taka til móts við alla.
Af hverju ætti ég að hugsa?
Margir af þeim þætti sem hér eru kynntar virðast meira gagnlegt fyrir hönnuði en hönnuðirnar. Til að vera sanngjörn, þetta er að hluta til satt: ef þú undirbýr allar þessar þættir fyrirfram mun verktaki elska þig. Þetta eru þær tegundir sem verktaki þreyttir á að biðja um eða þurfa að reikna út á eigin spýtur.
Samt sem áður, með því að gera allt þetta fyrirfram, geymir þú verktaki frá því að giska á það og halda þannig stjórn á hönnuninni. Og með því að halda stjórn á hönnuninni, hefurðu miklu meiri möguleika á að geta bætt við svolítið pólsku sem breytir venjulegum vef í framúrskarandi. Sumir hönnuðir vísa til þessa sem leyndarmál sósu sem gerir hönnun sína syngja.
Og ef þetta er ekki nóg af áhyggjum skaltu íhuga þetta. Hönnuðir sem skipuleggja framundan þetta vel og afhenda pakka þetta heill eru bara grundvallaratriðum verðmætari. Þeir búa ekki aðeins til hærri vöru en einnig draga úr kostnaði við framleiðslu. Þetta þýðir að það er meira hagnaðarskyni, sem auðvitað gerir alla hamingjusama.
Svo skaltu halda öllum þessum fínnari upplýsingar í huga og hafa gaman að skipuleggja vefsíðuna þína. Frankly, þessar upplýsingar eru hálf gaman að hanna fyrir netið, það síbreytilega miðli sem rúmar notendaviðskipti og breytt efni.
Patrick McNeil er sjálfstæður rithöfundur, verktaki og hönnuður. Hann elskar sérstaklega að skrifa um vefhönnun, þjálfa fólk í þróun vefur og byggja upp vefsíður. Nýjustu bókverkefni Patrick er Vefhönnuður Hönnuður ; Það felur í sér margar viðbótarviðfangsefni í samræmi við þessa grein. Þú getur fundið meira um það á TheWebDesignersIdeaBook.com . Fylgdu Patrick á Twitter @designmeltdown .
Hvað ertu að gera til þess að allir aðrir virðast gleyma? Hefur þú einhvern tíma lagt fram aukahluti eins og þetta fyrir viðskiptavini þína? Hvaða tegundir af hlutum finnur þú verktaki alltaf að biðja þig um að bæta við hönnun?