Kako ustvariti dizajn spletnega mesta?

Vsak lastnik spletnega mesta sanja o edinstvenem dizajnu svojega vira. Vsi vedo, da človeka srečajo oblačila. Enako velja za spletno mesto, saj obiskovalec najprej opozori na zasnovo projekta, nato pa tudi na vsebino. Če je zasnova preveč svetla ali, nasprotno, dolgočasna, uporabnik kmalu zapusti vir. Spletnega mesta ne napolnite z nepotrebnimi elementi, saj spletni viri z minimalističnim dizajnom pogosto izgledajo veliko bolj zanimivo. Kako ustvariti dizajn spletnega mesta?

Pravzaprav lahko celoten postopek oblikovanja razdelimo na tri stopnje: izdelava skice, ustvarjanje postavitve v grafičnem urejevalniku, oblikovanje postavitve. Skico zasnove lahko narišete v preprostem urejevalniku fotografij ali v navadnem svinčniku na kosu papirja. Kar zadeva postavitev, večinoma oblikovalci uporabljajo Photoshop kot najzmogljivejši grafični urejevalnik obstoječih. Za oblikovanje postavitve boste potrebovali znanje jezika za označevanje hiperteksta in CSS. Preden ustvarite svoj dizajn, si zastavite nekaj preprostih vprašanj: ali poznam HTML in CSS in ali lahko delam tudi z grafičnim urejevalnikom?

Če odgovorite negativno, potem postopek izdelave zasnove ne bo presegel prve stopnje. Skico je enostavno risati, vendar vsak uporabnik ne more narediti postavitve in narediti dokončnega oblikovanja. Kot rezultat tega priporočamo, da začnete z učenjem osnov HTML | CSS, pa tudi z ogledom nekaj videoposnetkov o usposabljanju o Photoshopu, da veste, kje se nahaja vsako orodje, kako uporabljati filtre in še veliko več.

Preden začnete skicirati, ustvarite sliko prihodnjega oblikovanja v svoji glavi. Upoštevajte, da vsaka zasnova vključuje naslednje dele:

  • "Glava" spletnega mesta je zgornji del vsake zasnove, ki praviloma vključuje logotip, ime spletnega mesta in nekaj gumbov (stiki, o avtorju). Pokrovček je lahko različnih višin, običajno pa ta parameter ne presega 300 slikovnih pik. Pogosto se na vrhu strani pojavljajo iskalni obrazci in reklamne pasice.

  • Stranska vrstica - stranski meni spletnega mesta. Sekundarne informacije in dodatni elementi so postavljeni v stransko vrstico: blok s svežimi članki, iskalni obrazec, različne ankete in koledarji, povezave, oglaševanje, elementi navigacije v viru. Pri oblikovanju spletnega mesta je mogoče uporabiti več stranskih vrstic, obstajajo pa tudi izvedbe brez stranskih stolpcev.
  • "Klet" je dno mesta. Običajno vsebuje povezavo do glavnega vira in avtorskih pravic v slogu "(c) 2014 Najboljše spletno mesto." Toda v zadnjih letih se je koncept "kletnega" dela zasnove spremenil s pojavom mobilnih naprav. V "kleti" so se začeli poravnati elementi, ki so običajno postavljeni v stranske palice.

  • "Glavni del" je blok, v katerega je postavljena glavna vsebina. Večina oblikovalcev glavni del mesta postavi v sredino, tako da je bolj priročno brati gradivo.

Torej, zdaj veste, iz katerih blokov sestavlja spletno mesto. Čas je, da začnete reševati vprašanje, kako sami izdelati zasnovo spletnega mesta. Odprite najpreprostejši urejevalnik fotografij (barve je dovolj) in ustvarite novo predlogo z ločljivostjo 1280 × 1024. Vredno je opozoriti, da se pri ustvarjanju meril na mestih ne uporabljajo meritve. Vsi bloki so "izmerjeni" v slikovnih pikah.

Oglaševanje

Na primer, odločite se za skiciranje z eno stransko vrstico. V grafičnem urejevalniku označite meje kleti, naslove strani in stransko vrstico.

Imate idejo, da naredite več stranskih stolpcev in vsebino postavite v sredino? Super, vendar pri označevanju upoštevajte širino stranskih vrstic in prostor za glavno vsebino. Stranski stolpci ne smejo biti preširoki (največ 300 slikovnih pik), pod glavno vsebino pa naj ostane vsaj 500 pik, sicer bo besedilo neprijetno za branje.

Ko so glavne oznake razmaknjene, je čas, da oblikovalsko skico dopolnite z elementi. V kletni prostor dodajte avtorske pravice, blok z obrazcem za iskanje, naslov itd. Skica oblikovanja bo dobila bolj zanimiv videz in ne bo niz geometrijskih oblik..

Če ste se naučili delati v Photoshopu, je čas, da skico pretvorite v postavitev. Toda pred tem se odločite za barve spletnega mesta. Za spletna mesta z novicami so bolj primerne bela barva ozadja, črna barva besedila in modra barva povezav. Če je zasnova ustvarjena za spletno stran ženske ali turistične teme, potem uporabite svetlejše barve. Hkrati ne smete narediti božičnega drevesa iz oblikovanja, saj obilo barv moti zaznavanje glavne vsebine.

Vsak blok postavitve začnite z grafiko. Eksperimentirajte z barvami in ozadji, ustvarite svoje elemente in gumbe. Vendar pa v internetu obstaja ogromno število različnih ozadij, gumbov za ustvarjanje dizajna.

Ko je postavitev končno pripravljena, jo razrežite na bloke in iz nje sestavite načrt. Hkrati podpišite vsako plast tako, da jo boste lažje naložili.

S pojavom mobilnih naprav je priljubljenost odzivnih gumijastih modelov rasla. Vsak uporabnik lahko ustvari temo za svoje spletno mesto, le pravi oblikovalec pa jo lahko prilagodi vsem napravam. Na začetku svoje "kariere" oblikovanja poskusite začeti s preprosto šablono.

Ne pozabite na tri preprosta pravila za "odličen dizajn":

  • besedilo mora biti dobro berljivo, tudi če so slike onemogočene v brskalniku;
  • poskusite ne uporabljati vyrviglaznye barve;
  • ustvarite priročno navigacijo po mestu.

Ko ustvarite dizajn in ga prenesete na spletno mesto, se prepričajte, da ga preizkusite v različnih brskalnikih. Na testiranje privabite prijatelje in znance, saj kritika drugih ljudi pozitivno vpliva na osebo. Ne pozabite na osnovno pravilo: oblikovanje spletnega mesta naj vam ne bo všeč samo vi, temveč tudi drugi uporabniki. Zato vedno poslušajte mnenja obiskovalcev vašega projekta..