Hoppa yfir á aðal efni

Hönnunarstefna

Skrefið Hönnunarstefna gerir þér kleift að yfirfara, betrumbæta og klára sjónræna hönnun þemaðs áður en Theme Builder býr til heildarþemað.

Yfirlit​

Eftir að Discovery Interview er lokið sýnir Theme Builder hönnunarstefnuna þína með forskoðun fyrir skjáborð og farsíma. Þetta gerir þér kleift að sjá nákvæmlega hvernig hönnunin mun líta út á mismunandi tækjum áður en þú skuldbindur þig til þemaðs.

Þættir hönnunarstefnu​

1. Litapalletta​

Litasamsetning þemaðs þíns, þar á meðal:

  • Aðallitur — aðalmerkjavörulitur sem er notaður fyrir hnappa, tengla og áherslur
  • Aukalitur — viðbótarlitur fyrir fjölbreytni
  • Áherslulitur — litur til að draga fram mikilvæg atriði
  • Hlutlausir litir — gráir og hvítir litir fyrir bakgrunna og texta
  • Textalitur — aðaltextalitur fyrir læsileika

2. Leturfræði​

Leturval fyrir:

  • Fyrirsagnaletur — notað fyrir síðuheiti og kaflafyrirsagnir
  • Meginmálsletur — notað fyrir málsgreinatexta og efni
  • Leturstærðir — skalanlegar stærðir fyrir mismunandi skjástærðir
  • Línuhæð — bil á milli lína fyrir læsileika
  • Leturþyngdir — feitletraðar, venjulegar og léttar útgáfur

3. Uppsetning og bil​

  • Breidd íláts — hámarksbreidd fyrir efni
  • Innri og ytri spássíur — bil í kringum einingar
  • Hnitakerfi — dálkauppsetning fyrir skalanlega hönnun
  • Bil milli íhluta — fjarlægð á milli UI-eininga

4. Sjónrænir þættir​

  • Hnappastílar — hönnun fyrir aðal-, auka- og þriðjastigs hnappa
  • Kortahönnun — uppsetningar fyrir efnisblokkir
  • Tákn — táknstíll og stærðir
  • Rammar og skuggar — fíngerð sjónræn dýpt
  • Sveimuáhrif — stílun gagnvirks ástands

Forskoðun​

Forskoðun fyrir skjáborð​

Forskoðun fyrir skjáborð sýnir hönnunina í fullri breidd (yfirleitt 1200px eða breiðari):

  • Fullur leiðsagnarvalmynd
  • Heildaruppsetning með öllum dálkum
  • Stór leturfræði og bil
  • Allir sjónrænir þættir í fullri stærð

Forskoðun fyrir farsíma​

Forskoðun fyrir farsíma sýnir hönnunina í farsímabreidd (yfirleitt 375px):

  • Skalanleg leiðsögn (hamborgaravalmynd)
  • Uppsetning í einum dálki
  • Aðlöguð leturfræði og bil
  • Snertivænar hnappastærðir

Skalanleg brotpunktar​

Theme Builder birtir forskoðanir við þessa brotpunkta:

TækiBreiddForskoðun
Farsími375pxSími í lóðréttri stöðu
Spjaldtölva768pxSpjaldtölva í láréttri stöðu
Skjáborð1200pxSkjáborð í fullri breidd
Stórt skjáborð1920pxOfurbreiður skjár

Að betrumbæta hönnunina​

Að gera breytingar​

Þú getur betrumbætt hönnunarstefnuna með því að:

  1. Aðlaga liti — breyta hvaða lit sem er í pallettunni
  2. Breyta letri — velja aðrar leturgerðir
  3. Breyta bilum — aðlaga innri og ytri spássíur
  4. Uppfæra uppsetningu — breyta ílátsbreiddum og dálkum hnitakerfis
  5. Sérsníða einingar — breyta hnappastílum, kortahönnun o.s.frv.

Uppfærslur forskoðunar​

Breytingar birtast í rauntíma:

  • Forskoðun fyrir skjáborð uppfærist strax
  • Forskoðun fyrir farsíma uppfærist strax
  • Allir skalanlegir brotpunktar eru uppfærðir
  • Þú getur skipt á milli forskoðana til að staðfesta breytingar

Samanburðarsýn​

Berðu hönnunarstefnuna saman við:

  • Upprunalega hönnun — sjáðu hvað breyttist
  • Hönnun samkeppnisaðila — berðu saman við innblásturssíður
  • Fyrri útgáfur — farðu aftur í fyrri hönnunarstefnur

Samþykki hönnunarstefnu​

Þegar þú ert ánægð/ur með hönnunina:

  1. Yfirfarðu báðar forskoðanir — staðfestu að skjáborð og farsími líti vel út
  2. Athugaðu alla liti — tryggðu birtuskil og aðgengi
  3. Prófaðu leturfræði — staðfestu læsileika í öllum stærðum
  4. Staðfestu uppsetningu — athugaðu bil og jöfnun
  5. Samþykktu hönnun — haltu áfram í þemagerð

Næstu skref​

Eftir að þú samþykkir hönnunarstefnuna:

  1. Theme Builder býr til heildarþemað þitt
  2. Þemað er sett upp á WordPress vefsvæðinu þínu
  3. Þú getur sérsniðið frekar með WordPress customizer
  4. Haltu áfram í Hospitality Menus eða aðra eiginleika

Bestu starfsvenjur​

  • Prófaðu á raunverulegum tækjum — notaðu raunverulega síma og spjaldtölvur ef mögulegt er
  • Athugaðu læsileika — tryggðu að texti sé læsilegur í öllum stærðum
  • Staðfestu birtuskil — notaðu Validate Palette Contrast fyrir aðgengi
  • Hugsaðu um afköst — fínstilltu myndir og letur fyrir hraða
  • Skipuleggðu fyrir efni — tryggðu að uppsetningin virki með raunverulegu efninu þínu

Úrræðaleit​

Forskoðun uppfærist ekki​

  • Endurhladdu síðuna
  • Hreinsaðu skyndiminni vafra
  • Prófaðu annan vafra
  • Athugaðu nettengingu

Litir líta öðruvísi út​

  • Athugaðu litastillingar skjás
  • Prófaðu á mismunandi tækjum
  • Staðfestu litabirtuskil með aðgengisverkfærum
  • Íhugaðu herma fyrir litblindu

Vandamál með leturfræði​

  • Staðfestu að leturskrár séu að hlaðast
  • Athugaðu leturstærð við mismunandi brotpunkta
  • Prófaðu með raunverulegu efni
  • Íhugaðu línulengd fyrir læsileika