Cynllun y wefan. Sail y Cynllun

Cynllun gwefan yw'r broses o greu tudalen we trwy godio a strwythuro cynnwys fel ei fod yn hawdd ei arddangos ac yn rhyngweithiol mewn porwr gwe. Mae'n cynnwys arddullio testun, delweddau, fideos, dolenni, ffurflenni, ac elfennau eraill ar dudalen i greu profiad gweledol cydlynol a chymhellol i ddefnyddwyr.

Mae dyluniad a gosodiad y safle yn cynnwys y prif agweddau canlynol:

1. HTML (Iaith Marcio Hyperdestun):

   • Defnyddir HTML i greu strwythur tudalen we. Mae'n diffinio'r penawdau, paragraffau, rhestrau, delweddau, dolenni, ac elfennau eraill sy'n ffurfio craidd y cynnwys ar dudalen.

2. CSS (Dalenni Arddull Rhaeadrol):

   • Defnyddir CSS i steilio elfennau HTML a rheoli eu hymddangosiad. Gan ddefnyddio CSS, gallwch osod lliwiau, ffontiau, meintiau, a lleoliad elfennau ar y dudalen.

3. Cynllun y wefan. Dyluniad Ymatebol:

   • Mae dylunio ymatebol yn golygu defnyddio CSS a thechnolegau eraill i greu tudalennau gwe sy'n gallu dangos yn gywir ar wahanol ddyfeisiau a datrysiadau sgrin, megis cyfrifiaduron, tabledi a ffonau smart.

4. JavaScript:

   • Gellir defnyddio JavaScript i ychwanegu rhyngweithio i dudalennau gwe. Mae'r iaith raglennu hon yn caniatáu ichi greu elfennau deinamig, rhyngweithio â defnyddwyr, a newid cynnwys tudalen heb fod angen ail-lwytho.

5. Cynllun y wefan. Cydnawsedd traws-borwr:

   • Mae'r cynllun hefyd yn cynnwys ystyriaeth o gydnawsedd traws-borwr fel bod tudalennau gwe yn arddangos yn gywir mewn amrywiol borwyr gwe (er enghraifft, Google Chrome, Mozilla Firefox, Safari, Microsoft Edge).

6. Optimeiddio perfformiad:

   • Agwedd bwysig ar y gosodiad yw optimeiddio perfformiad, megis lleihau maint delweddau, defnyddio caching, a thechnegau eraill i sicrhau bod tudalennau'n llwytho'n gyflym.

Cynhyrchwyr Cynllun Llyfrau: 5 Offer AM DDIM.

I wneud yn siŵr eich bod yn cael gwefan na fydd eich ymwelwyr yn cefnu arni, rydym wedi llunio'r canllaw hwn ar ei chyfer hanfodion dylunio gosodiad y wefan. Byddwn yn gosod y pethau sylfaenol ar gyfer yr hyn y dylid ei wneud dylunio da, technegau allweddol ar gyfer creu cynllun gwefan effeithiol, a'r mathau mwyaf cyffredin o gynlluniau gwefannau.

Briff dylunio pecynnu

Nodau. Cynllun y wefan

Mor syml ag y mae'n swnio, unig ddiben cynllun gwefan yw cefnogi nodau'r wefan, boed yn drosi, cydnabyddiaeth brand, adloniant neu ddiben arall. Ond y nodau gwefan yn cael eu mynegi trwy gynnwys, ac mae cynllun y gosodiad yn disgrifio sut i gyflwyno'r cynnwys hwnnw'n effeithiol. Wedi dweud hynny, dyma rai swyddogaethau cyffredin y gall cynllun gwefan eu cyflawni:

• Arddangosfa gwybodaeth . Mae cynllun gwefan da yn trefnu gwybodaeth mewn ffordd sy'n dilyn dilyniant amlwg, yn hawdd i'w sganio, yn rhoi pwysau i'r elfennau pwysicaf, ac yn gwneud offer defnyddwyr yn reddfol i'w canfod a'u defnyddio.
• Ymgysylltu â Defnyddwyr:  Mae cynllun gwefan da yn gwneud y dudalen yn ddeniadol yn weledol, yn cyfeirio llygad y defnyddiwr at bwyntiau o ddiddordeb, ac yn eu hannog i barhau i lywio'r wefan.
• Brandio: Mae cynllun gwefan da hefyd yn chwarae rhan mewn brandio, gan ddefnyddio bylchau, aliniad a graddio i weddu i frand y cwmni.

Mae'r nodau lefel uchel hyn yn gyrru dyluniad cynllun gwefan, ond cyn i ni edrych ar gynlluniau gwefannau penodol, gadewch i ni drafod sut i weithredu'r nodau hyn yn fanylach.

Tystysgrif Rhodd. Sut i greu?

Y broses o ddatblygu cynllun gwefan. Cynllun y wefan

Dylai'r broses o osod y wefan ddigwydd yn gynnar yn y broses o greu'r wefan, sef peth amser ar ôl i chi ddatblygu strategaeth eich gwefan ond cyn i chi neidio i mewn i raglen graffeg i greu'r rhyngwyneb.

Sut i greu gwefan priodas?

Mae cynllun gwefan yn cael ei ddelweddu gan ddefnyddio ffrâm weiren, sef map ffrâm weiren sylfaenol sy'n dangos sut y bydd y cynnwys yn ffitio gyda'i gilydd. Mae'n bwysig gwahaniaethu rhwng dyluniad ffrâm weiren a dylunio gwe, sef y cyfan y broses o greu graffeg rhyngwyneb ac elfennau gweledol eraill am dudalen we. Mae dylunio cynllun gwefan yn rhan fawr o ddylunio gwe, ac mae'n dechrau gyda'r ffrâm weiren. Yn ddelfrydol, dylai'r dyluniad gweledol gydweddu â chynllun y ffrâm weiren fel bod elfennau graffig yn cael eu gosod yn strategol ac nad ydynt yn seiliedig ar ddewisiadau esthetig dros dro.

Ar ôl hynny, dyma'r camau i greu cynllun gwefan:

• Cynllun y wefan. Diffinio pob maes cynnwys.

Mae fframiau gwifren fel arfer yn cynrychioli cynnwys fel sgwariau a phetryalau syml, boed yn ddelwedd neu'n floc o destun. Mae'n bwysig gwybod ymlaen llaw faint o gynnwys sydd gennych chi a maint bras pob darn (neu gyfrif geiriau) er mwyn i chi allu ffitio'r elfennau at ei gilydd yn gywir.

• Creu cyfres o fframiau gwifren a phrototeipiau. 

Gall y gosodiad fod mor syml â lluniadu gyda phen a phapur, ond mae llawer o raglenni ar gael hefyd (e.e.  Mympwyol ), wedi'i gynllunio i wneud y gorau o'r broses. Gan nad oes rhaid i fframiau gwifren fod yn weithiau celf manwl, gallwch greu nifer ohonynt ar y tro. Hyd yn oed os ydych chi'n syrthio mewn cariad â'ch syniad cyntaf, dylech ddatblygu mwy o fframiau gwifren i ehangu'ch dychymyg a rhoi opsiynau i chi'ch hun. Heb graffeg ffansi i dynnu eich sylw, gallwch ganolbwyntio ar brofiad y defnyddiwr a dysgu pa gynllun fydd fwyaf greddfol iddynt. Gwnewch yn siŵr eich bod yn ystyried pob maint sgrin - argymhellir dechrau gyda chynllun ar gyfer dyfeisiau symudol, ac yna ei adeiladu i fyny.

• Profi, casglu adborth, ac ailadrodd. 

Unwaith y bydd gennych ychydig o opsiynau, gwnewch yn siŵr eich bod yn casglu adborth gan eich cyfoedion. Ceisiadau fel  Invision  и  Ffigma,  caniatáu i chi greu prototeipiau rhyngweithiol fel y gallwch chi brofi botymau a llywio yn hawdd heb greu tudalen we go iawn. Os bydd defnyddwyr treial yn cofnodi eu hunain ar y sgrin wrth lywio'r prototeip, gall hyn ddatgelu rhwystrau UX. Unwaith y bydd gennych ychydig o nodiadau, ewch yn ôl i gam dau ac ailadroddwch nes i chi gael y canlyniad perffaith.

Er mai dyma'r camau llythrennol ar gyfer creu cynllun gwefan, gall fod yn anodd deall beth sy'n gwneud cynllun yn effeithiol ai peidio pan fyddwch chi newydd ddechrau arni. Yn yr adran nesaf, byddwn yn edrych ar ddulliau penodol y gallwch eu defnyddio i wneud penderfyniadau dylunio.

Dulliau allweddol ar gyfer creu effeithiol. Cynllun y wefan

Mae dylunio gosodiad gwefan yn arfer sydd wedi bodoli ers degawdau, sy'n golygu bod nifer o gonfensiynau ac egwyddorion dylunio wedi'u sefydlu dros y blynyddoedd i arwain dylunwyr yn eu crefft. Isod mae rhai o'r technegau mwyaf defnyddiol:

Hierarchaeth weledol

Hierarchaeth weledol yn ffordd o steilio chwe elfen ddylunio i wella cyferbyniad i wneud i rai darnau o gynnwys sefyll allan uwchlaw eraill. Er mwyn cyflawni hyn, rhannau pwysicaf y cynllun yw'r rhai y mae angen i'r defnyddiwr eu nodi ar unwaith, yn dibynnu ar bwrpas y dudalen. Maent fel arfer yn cynnwys penawdau, cynigion gwerth, galwadau i weithredu ac offer defnyddwyr fel llywio.

Gall hierarchaeth weledol amlygu ei hun mewn sawl ffordd, megis trwy ddewis ffont (maint, pwysau, a hyd yn oed gwahanol gyfuniadau ffont), alinio elfennau pwysig yn uwch ar y dudalen, neu ddefnyddio lliwiau cyflenwol i amlygu elfennau.

Patrymau darllen. Cynllun y wefan

Mae patrymau darllen yn disgrifio'r ffyrdd mwyaf cyffredin o sganio tudalennau gan ddefnyddwyr ac fe'u darlunnir fel llinellau cyfeiriedig (fectorau, ar gyfer mathemategwyr). Gan fod ymchwil yn dangos mai dim ond sgimio'r dudalen y mae 79% o ymwelwyr gwefan, mae'n bwysig ei gwneud mor hawdd â phosibl i'w sganio. Un ffordd effeithiol o wneud hyn yw dylunio'r gosodiad gyda phatrwm darllen penodol mewn golwg.

Mae ymgorffori patrymau darllen yn eich gosodiadau yn golygu gosod elfennau yn strategol ar hyd llinellau golwg y gwyliwr. Y patrymau mwyaf cyffredin i'w hystyried yw'r patrwm Z (fector igam-ogam; defnyddiol ar gyfer gosodiadau delwedd-drwm) a'r patrwm F (fector llinell; defnyddiol ar gyfer gosodiadau testun-trwm).

Uwchben neu o dan y plyg. Cynllun y wefan

Mewn dylunio gwe, y "plyg" yw'r llinell y mae tudalen we yn cael ei thorri i ffwrdd oherwydd cyfyngiadau maint sgrin. Gelwir cynnwys sy’n weladwy pan fydd tudalen yn llwytho yn “uwchben y dudalen,” tra bod cynnwys sy’n gofyn i ddefnyddwyr sgrolio i lawr i’w agor yn cael ei alw’n “waelod y dudalen.”

O ran dylunio cynllun gwefan, dylid gosod y cynnwys pwysicaf a/neu gymhellol (fel y cynnig gwerth a'r alwad i weithredu) yn ddiogel ar frig y dudalen fel nad oes rhaid i ddefnyddwyr chwilio amdano. Mae'r gofod hwn yn 1000 x 600 picsel ar gyfer y rhan fwyaf o feintiau sgrin. Wedi dweud hynny, gall dylunwyr hefyd ddefnyddio'r plyg i dorri graffeg diddorol i ffwrdd a chopïo i ddenu defnyddwyr i sgrolio i lawr wrth barhau â'u rhyngweithio â'r dudalen we.

Systemau grid. Cynllun y wefan

Mae system grid yn gynllun sy'n seiliedig ar fesuriadau caled a chanllawiau. Mae'r grid yn cynnwys colofnau (mannau dynodedig i osod cynnwys) a chwteri (y bylchau gwag rhwng y colofnau).

Lle gwag

Yn syml, mae gofod gwyn, a elwir weithiau yn ofod negyddol, yn faes o ddyluniad heb unrhyw gynnwys, h.y. gofod gwag. Er ei bod hi'n hawdd anwybyddu ac yn aml yn demtasiwn i lenwi â chynnwys, gall gofod gwyn fod y pwysicaf ased yng nghynllun y wefan.

Mae'r ffug wefan hon yn denu sylw gyda gofod gwyn effeithiol.

Meddyliwch sut y bydd llinell o destun ar dudalen wag yn llawer mwy effeithiol wrth ddal eich sylw nag ar dudalen sy'n llawn cynnwys. Mae digon o le gwyn yn creu pwyslais, gan wneud y cyfansoddiad cyfan yn llai anodd ei ddarllen. Yn wahanol i dudalennau printiedig, nid yw hyd tudalen we yn gyfyngedig, gan roi llawer mwy o ryddid i ddylunwyr mewn strategaeth a defnydd o ofod gwyn.

Mathau cyffredin o gynlluniau gwefannau. Cynllun y wefan

Anaml y caiff gosodiadau gwefannau eu creu o'r dechrau; mewn gwirionedd, dywedir yn aml nad yw hyn yn wir. Mae'r rhan fwyaf o wefannau modern yn seiliedig ar gynlluniau gosodiad cyffredin a ddefnyddir yn gyson, gydag amrywiadau bach, ar draws y Rhyngrwyd.

Er bod rhywfaint o wreiddioldeb yn bwysig mewn unrhyw ddyluniad, mae gwefannau wedi'u cynllunio i gael eu deall a'u defnyddio ar unwaith. Felly pan fydd defnyddwyr yn dod yn gyfarwydd â rhai mathau o gynlluniau dros y blynyddoedd, mae'n gwneud synnwyr i ddylunwyr gadw gyda nhw. Cofiwch y dylai'r cynllun fod yn ymarferol yn y pen draw, a pho leiaf o amser y mae defnyddwyr yn ei dreulio yn dysgu cynllun newydd, y mwyaf o amser y byddant yn ei neilltuo i ddefnyddio'r wefan mewn gwirionedd. Ar wahân i hynny, dyma rai o'r cynlluniau gwefan mwyaf cyffredin:

Cynllun Colofn Sengl

Mae cynllun un golofn yn gynllun sy'n gosod cynnwys yn olynol mewn un golofn, yn aml wedi'i ganoli.

Mae llawer o gynlluniau tudalennau gwe yn cychwyn yma, o ystyried bod dyluniad symudol-gyntaf yn ddull a argymhellir ers tro ac mae gwefannau symudol yn aml yn cael eu gosod mewn un golofn oherwydd cyfyngiadau maint. Mae'r cynllun hwn yn fwyaf defnyddiol ar gyfer tudalennau glanio neu gynnwys sy'n seiliedig ar sianeli, megis rhwydweithiau cymdeithasol a blogiau oherwydd ei fod yn lleihau nifer yr elfennau tudalen ac yn hyrwyddo sgrolio.

Cynllun dwy golofn. Cynllun y wefan

Mae cynllun dwy golofn, weithiau mewn golygfa sgrin hollt, yn dangos cynnwys ochr yn ochr.

Mae hyn yn ddefnyddiol ar gyfer amlygu deuoliaeth rhwng dwy elfen (er enghraifft, gwahanol gynulleidfaoedd ar safleoedd dillad, arddull cyn/ar ôl gwasanaeth, neu opsiynau deuol prisio). Mae hefyd yn ddefnyddiol ar gyfer cydbwyso graffeg gyda chopi, gan gefnogi darllen patrwm Z yn gynnil.

Cynllun aml-golofn. Cynllun y wefan

Cyfeirir yn aml at gynllun aml-golofn fel cynllun papur newydd neu gylchgrawn. Mae'n ffitio cynnwys gwefan trwm i un dudalen.

Yn nodweddiadol, defnyddir grid i gynnal trefn a hierarchaeth trwy ddarparu gofod colofn ehangach ar gyfer elfennau pwysicach fel prif gynnwys, tra bod elfennau llai pwysig fel dewislen llywio, bar ochr neu hysbyseb baner yn cael llai o le cymesur. Mae hyn yn ddefnyddiol ar gyfer tudalennau cartref cwmni, gwefannau delwedd neu fideo, cyhoeddiadau ar-lein, dangosfyrddau arfer, a gwefannau siopa - gwefannau gyda llawer o gynnwys a chategorïau i gyfeirio defnyddwyr atynt.

Cynllun anghymesur. Cynllun y wefan

Cynllun anghymesur yw pan fydd elfennau yn cael eu trefnu ar raddfa anghyfartal ac agosrwydd - yn syml,  dim yn gymesur. Ond er ei fod i'r gwrthwyneb i system grid, nid yw anghymesuredd yn golygu anhrefn.

Mae cydbwysedd yn bwysig mewn unrhyw ddyluniad, ac mae gosodiad anghymesur yn cyflawni hyn mewn ffyrdd annisgwyl, megis cyfuno rendrad ar raddfa fawr ar un ochr â llawer o elfennau llai ar yr ochr arall. Mae hyn yn ddefnyddiol ar gyfer ychwanegu pwyslais trwy orliwio rhai elfennau (trwy faint llythrennol, lliwio, neu leoliad) dros eraill. Gall hefyd gefnogi patrymau darllen arferol (yn hytrach na'r rhai arferol a grybwyllwyd yn gynharach).

Bydd brandiau sy'n gallu fforddio defnyddio dull anghonfensiynol o ddylunio yn gweld yr arddull gosodiad hwn yn ddelfrydol - hynny yw, gwefannau sy'n canolbwyntio ar y celfyddydau, sydd â chynulleidfa anturus, neu sydd am dynnu sylw at gynnyrch arloesol neu arloesol.

Cynllun y wefan wedi'i osod yn llawn

Mae cynllun gwefan gwych nid yn unig yn ei gwneud yn ddeniadol yn weledol ond hefyd yn ei gwneud yn reddfol. Dyma'r cam cyntaf i wneud argraff gyntaf ar ddefnyddwyr, gan eu hudo i aros a gweld yr holl gynnwys sydd gan eich gwefan i'w gynnig. Cynllun y wefan

Er y gall y sylfeini dylunio gwefan hyn roi man cychwyn i chi, dylech ymdrechu i wneud popeth posibl i ddarparu profiad eithriadol i'ch ymwelwyr gwefan. A'r ffordd orau o gael cynllun gwefan modern yw gweithio gyda dylunydd proffesiynol.

 АЗБУКА «