Lekcije web dizajna od nule. Osnove dobrog dizajna. Web dizajn za početnike. Savjeti za učenje Što prvo naučiti kao web dizajner

Od autora: mnogi početnici ne znaju gdje početi učiti web dizajn. Veliki i strašni Internet prepun je raznih materijala koji su često zbunjujući. Većina ljudi također ima element sumnje u svoj talent i strah od neuspjeha. Pogotovo ako je njihovo upoznavanje s grafikom bilo ograničeno na satove likovne kulture u osnovnoj školi.

Danas ću vam reći kako postati web dizajner i ne izgubiti se u ogromnoj količini informacija. Ako vjerujete u sebe i želite učiti, onda je ovaj članak za vas!

Pećinski ljudi su izrađivali pećinske slike, stari Egipćani su crtali hijeroglife, a živimo u eri web dizajna. Što je? Pokušat ću objasniti “na prstima” i u ovaj članak upakirati minimum koji jednostavno trebate shvatiti prije nego krenete u ovo područje.

Web dizajn je...

Svi intuitivno razumijemo da je web dizajn pretvaranje informacija na ekranu u nešto estetski lijepo i prepoznatljivo. To je razmjena ideja s drugim ljudima. Izraz vaše individualnosti. Grafička formulacija glavnih ciljeva i ciljeva stranice, njezin koncept. Općenito, ovo je nešto višestruko i na prvi pogled vrlo složeno. Pogotovo ako:

87-godišnji djed;

nemaju odgovarajuće iskustvo i/ili obrazovanje;

ne znaš crtati;

nemam računalo.

Ako se barem jedna od gore navedenih točaka ne odnosi na vas, onda imate stvarnu priliku postati web dizajner! Ali ozbiljno, za osobu koja je strastvena prema onome što voli, nema prepreka. Obuka za web dizajn može se odvijati samostalno i uz pomoć specijalizirane literature, lekcija, internetskih izvora, plaćenih i besplatnih video tečajeva.

Zahtjevi za web dizajnera

O web dizajneru ovisi kako će točno korporativno web mjesto, blog ili drugi resurs percipirati korisnik. Koliko će lako i brzo razumjeti sadržaj stranica, kretati se navigacijom, pronaći potrebne informacije i izvršiti ovu ili onu radnju. Na primjer, naručivanje usluge ili proizvoda.

Stoga su glavni zadaci stručnjaka za dizajn web stranice:

skrenuti pozornost korisnika na prednosti tvrtke;

istaknuti važne informacije o proizvodu, usluzi, poduzeću;

logično je navesti posjetitelja na kupnju ili neku drugu radnju.

Alati web dizajnera u ovoj teškoj borbi za klijenta trebaju biti odgovarajući elementi strukture stranice: gumbi, slike, video zapisi, poveznice, tekstualni blokovi.

Gdje započeti samostalno učenje? 5 koraka do uspjeha

1. Naučite vanjske aspekte web dizajna. Učenje i samoobrazovanje trebali bi započeti traženjem inspiracije u drugim djelima. Pogledajte rad velikih studija, poznatih dizajnera, analizirajte stranice s velikim prometom.
Koje fontove koriste? Kako se bira paleta boja? Značajke glavnih blokova, naslova, slika, gumba? Na sve ove suptilnosti treba obratiti pozornost.

2. Slijedite svoj unutarnji interes. Slušajte sebe i pokušajte shvatiti što vas oduševljava u ovom ili onom poslu, što vam je najzanimljivije.

Pokušajte i eksperimentirajte dok ne dobijete viziju što točno želite učiniti. To može biti dizajn web stranice, brendiranje i dizajn logotipa, identitet ili korporativni identitet, dizajn mobilne aplikacije itd.

3. Naučiti osnove crtanja i kompozicije. Da biste to učinili, apsolutno nije potrebno upisati se u umjetničku školu, sjediti u publici s istim početnicima i pokušati nacrtati loptu ili vazu. Dovoljno je da znate skicirati. Neka vam se ruka navikne na olovku. Da biste to učinili, budite strpljivi i kopirajte fotografije, slike, video upute.

Da biste uspješno prošli ovu fazu, zaboravite na predmet koji crtate. Razmislite samo o njegovim proporcijama i položaju u prostoru.

Ako ne vjerujete u vlastite snage, proguglajte biografiju umjetnika Matissea, Paula Gauguina, Mosesa, Adolphea Bouguereaua, koji su prvi počeli slikati u odrasloj dobi.

4. Naučiti koristiti Photoshop alate, naučiti osnove CSS-a i HTML-a, principe adaptivnog izgleda. Ne biste trebali odmah juriti za puno programa, u procesu učenja web dizajna shvatit ćete koja vam specifična znanja nedostaju.

5. Pronađite svoje znanje u praksi. Izradite vlastitu web stranicu ili blog. Napravite portfelj i postavite ga na specijalizirane freelance burze.

Da biste dobili vlastiti posao, nije potrebno dovršavati prave projekte. Možete izraditi vlastite skice web stranica, sučelja aplikacija, logotipa lokalnih tvrtki.

Radite vježbe iz knjiga ili lekcija koje možete pronaći na internetu. U početnoj fazi, kako biste naučili web dizajn, možete čak posuditi ideje drugih ljudi i modificirati ih.

Budite u trendu i razvijajte se. Čak i ako imate barem neizmjeran talent kao umjetnik, još uvijek morate znati stvari kao što su rasterska i vektorska grafika, CMYK i RGB, principi adaptivnog, ravnog i materijalnog dizajna, Photoshop alati.

Posvećujući barem 1-2 sata dnevno učenju ovih stvari, uhvatit ćete se i postići određenu razinu koja će vam omogućiti da postanete visoko plaćeni stručnjak u području web dizajna. Gdje započeti učiti - od samostalnog proučavanja osnova crtanja i grafičkih programa ili sveobuhvatnih tečajeva - ovisi o vama, ovisno o vašim težnjama i motivaciji.

Kada postoji interes za dizajn web stranice, učenje je vrlo jednostavno. Možete beskonačno gledati web stranice i blogove, čitati intervjue s dizajnerima i slušati predavanja na youtubeu, a da vam to uopće ne dosadi.

Međutim, zapamtite da je web dizajn područje koje se ne može proučavati samo teoretski. Što više stvarnog iskustva, to bolje.

Moderno tržište ostavlja traga na profesiji "web dizajner". Zadnjih par godina postoji trend prema minimalističkoj, pojednostavljenoj strukturi stranice, bez egzotičnih fontova, “nabora”, sjena itd. Na vrhuncu popularnosti su i velike tipografije, pozadinske slike pune širine, i ravni dizajn (ravni stil).

U sljedećim člancima reći ću vam više o trendovima modernog dizajna. Na ovom ću se oprostiti. Pretplatite se na ažuriranja našeg bloga kako biste bili u tijeku sa svim događajima i novostima u okruženju dizajnera i programera web stranica. Učite, razvijajte se i uspjet ćete!

Želite naučiti kako i sami postati web dizajner? Ili možda već imate nekoliko vlastitih dizajna ili čak i želite podići svoje vještine na novu naprednu razinu? Onda se upravo sada krećete u dobrom smjeru jer je tema članka “Odakle početi s web dizajnom” iu njemu ćemo detaljno pogledati sve potrebne faze pripreme web dizajnera i pomoći vam da postanete web dizajner sami uz malo marljivosti i kreativnosti.

Jedan članak, naravno, ne može vam reći kako postati web dizajner i reći o svim vještinama, potrebnim alatima i tehnologijama koje trebate savladati na putu do posla iz snova. Ako mislite da će put biti lagan i brz, onda vas moram uzrujati. Posao web dizajnera je stalno samousavršavanje, razvoj i praćenje novih trendova i tendencija. No, unatoč svim profesionalnim poteškoćama, upravo je učenje i stjecanje novih znanja jedna od najugodnijih strana ovog posla.

Prvo, mala lirska digresija za dizajnere koji su slučajno zalutali na čitanje ovog članka. " Bavim se web dizajnom", vjerojatno ste ovu rečenicu nekome rekli više puta i doživjeli hladan strah kada vam je odgovoreno nešto poput:" cool! I nauči me kako to učiniti? Kako postati web dizajner od nule?» Mnogi ljudi jednostavno pretpostave da kliknu, povuku nekoliko ikona na zaslon i dizajn je spreman. Ali, nažalost, nije tako. Dakle, sljedeći put kada vas netko pita kako dizajnirati web stranice, samo im pokažite ovaj članak.

Dobro došli, dame i gospodo, u MotoCMS-ov vodič za dizajnere za početnike. Zgrabite svoje miševe i udobno se smjestite za tipkovnicom, ovaj post obećava da će biti dug. Kuhanje kave nije obavezno, ali se ipak isplati.

Za koga je ovaj članak o web dizajnu?

Ovaj članak je za sve koji se pitaju "Kako postati web dizajner?". Također će biti korisno za ljude koji žele početi stvarati web stranice i imaju određeno iskustvo u dizajnu i . Sve će biti vrlo dostupno i korak po korak. Članak je osmišljen zbog činjenice da nemate nikakvo posebno umjetničko ili tehničko obrazovanje, nikakve vještine kodiranja i iskustvo u industriji web dizajna.

Zahtjevi za web dizajnere početnike

"Minimalni zahtjevi" za ljude koji razmišljaju o tome da postanu web dizajneri i žele izraditi svoju prvu web stranicu prilično su jednostavni. Ako znate što su mape, grafičke tekstualne datoteke, možete početi.


Međutim, iako je početak jednostavan, stvaranje stvarno dobre stranice prava je umjetnost. Postoje mnoge vještine koje ćete morati naučiti. Morat ćete naučiti o teoriji boja, hijerarhiji grafičkih elemenata, fontovima i cjelokupnoj organizaciji stranice.

Također, trebat će vam poznavanje glavnih jezika kodiranja, naime HTML i CSS, razgovarat ćemo i o tome.

Onda biste mogli naučiti osnove JavaScript programiranje i smislite kako ga koristiti za upravljanje različitim dijelovima vaše web stranice. A očajni bubnjari koji žele kopati još dalje mogu uroniti u sustave upravljanje sadržajem, optimizacija za tražilice i marketing.

Ali ne treba žuriti sa svime odjednom, vještine će doći s iskustvom i potrebom, samo ću vas pokušati usmjeriti u pravom smjeru. A ako ste pročitali do ovog dijela članka, onda sa sigurnošću mogu reći “Dobrodošao u prekrasan svijet web dizajna, početniče. Budite spremni opetovano zabrljati stvari i ne zaboravite se zabaviti!"

Kako koristiti ovaj vodič za web dizajn za početnike

Čitati! Ovo će biti dovoljno za početak. Napravite svoju prvu, najvjerojatnije nespretnu web stranicu. Vratite se i pročitajte ponovno. Ispravi svoje greške. Ponoviti.
Ne, vjerojatno ne želite čitati sve odjednom. Postoji mnogo drugih izvora, mnogo različitih pristupa koji se mogu koristiti. U redu je, ali ipak preporučam da malo pročitate i pokušate proći prve korake.

Dizajn u pregledniku za početnike

Vjerojatno znate da većina dizajnera prvo koristi grafičke editore, a tek onda daju svoje projekte koderu na prijelom. Photoshop je najčešće korišten alat, ali dizajneri koriste i programe kao npr Skica, GIMP, inkscape i Ilustrator.


Bez sumnje, trebate isprobati nekoliko njih i koristiti alate koji vam najviše odgovaraju. Međutim, ako želite izraditi web stranice, pokušajte to odmah učiniti u njihovom prirodnom staništu – u pregledniku! U idealnom slučaju - učinite to u više preglednika - jer ljudi ne gledaju stranice u Photoshopu i ne vide ih na način na koji ih vi vidite kroz sučelje grafičkog uređivača.

Tijek rada temeljen na pregledniku ima niz drugih prednosti:

1) Vidite točno ono što dobivate.Čak ni profesionalni mockupovi ne prenose interaktivne ili animirane dijelove web stranica. Stvaranjem dizajna temeljenog na pregledniku, moći ćete vidjeti kako točno radi.

To je osobito istinito kada je u pitanju responzivni dizajn. (Za neupućene, responzivni ili responzivni dizajn je onaj koji se ispravno prikazuje na različitim ekranima i uređajima, bilo da se radi o mobilnom telefonu, tabletu ili računalu.)

2) Dizajn temeljen na pregledniku može vas učiniti boljim dizajnerom. Kada sami poznajete cijeli proces, moći ćete razumjeti što i kako funkcionira te se upozoriti na mnoge pogreške. Noćna mora svakog dizajnera (ili layout dizajnera koji će to morati raditi) koji radi u, recimo, Photoshopu je njegovo daljnje "natezanje" na živoj stranici.

U svakom slučaju, evo nekoliko izvora koji mogu biti od pomoći pri radu s uređivačima fotografija.

Dizajn u pregledniku može promijeniti način na koji radite na mnoge načine i potaknuti vas da naučite nove stvari o HTML-u i CSS-u. Uglavnom, što se više petljate s prljavim kodom, to ćete bolje razumjeti kako web stranice funkcioniraju. To vas neće učiniti nevjerojatnim dizajnerom; ali to je sjajan početak.

Vještine koje su vam potrebne da postanete web dizajner

Ako želite samostalno postati profesionalni web dizajner, trebat će vam neke posebne vještine. U ovom odjeljku odgovorit ćemo na pitanje "Kako da sam postanem web dizajner?" i usredotočiti se na vještine potrebne za stvarno dizajniranje i izradu web stranice. Naravno, trebat će vam i poslovne i komunikacijske vještine, ali to je malo drugačija priča. Dakle, da biste sami postali web dizajner, morate znati sljedeće.

UX / UI dizajn


Dizajn orijentiran na korisničko iskustvo ili UX dizajn način je na koji će izgledati i raditi korisničko sučelje u cjelini. To je proces, to je filozofija i puno je posla. Stvarno dobra stranica može se stvoriti samo ako se zna kojim putem ide posjetitelj i kako se njegovo ponašanje mijenja ovisno o promjeni grafičkih elemenata.

Više informacija o tome možete pronaći u članku “Što je zapravo UX/UI dizajn? »

Estetske vještine

Estetika je složena stvar. Čini se da bi izvrsna shema boja za neke ljude mogla izgledati potpuno čudno za druge. Fontovi koji vam na ovom mjestu izgledaju "baš kako treba" možda se uopće neće svidjeti kupcu. Čini se vrlo, vrlo subjektivno, ali ipak, svaki od ovih aspekata ima svoja pravila, o kojima ćemo sada govoriti.

Kombinacija fontova i tipografija


Internet je tekst. Ovo su riječi. I ove riječi moraju izgledati nevjerojatno. Međutim, tipografija je više od pukog odabira pravog fonta. To je, prije svega, jednostavnost korištenja. Potrebno je pravilno odabrati i kombinirati veličine, vrste i stilove fontova u dizajnu kako bi se stvorila grafička hijerarhija u dizajnu.

Da vas provedem "od A do Ž", predlažem da pogledate knjigu Emila Rudera "Tipografija". Čitanje može biti prilično dugo, pa za one koji žele odmah početi vježbati, postoji kratki video na tu temu, kao i (ovo je ako ste već pronašli dobar primjer teksta i želite identificirati njegov font).

Nakon što ste naučili pravila tipografije, možete isprobati neke fontove za svoj projekt. Na webu zapravo ima mnogo dobrih besplatnih fontova, pa pogledajte oko sebe.

Mnogi ljudi, uključujući i mene, biraju svoje fontove iz . Google fontovi se mogu "ugraditi" na web mjesto i to je prilično zgodno. Štoviše, možete koristiti gotove kombinacije fontova:

Ostali slični primjeri mogu se pronaći na internetu.

Ako želite izraditi vlastite Google parove fontova, isprobajte "Web Font Combiner". Ovo je alat koji vam omogućuje brz pregled kombinacija fontova u stvarnom vremenu mijenjanjem fonta, veličine, boje, širine linije.

Ako Google Fontovi nisu dovoljni, onda možete pogledati WebDesignerDepot, Fonts-online i druge stranice.

Teorija boja i sheme boja

Teorija boja ima malo veze s tehničkim nazivima boja. Ako vaš klijent traži fuksiju, a želi žarko ružičastu, izbor je na vama.Teorija boja proučava prije svega odnos između kombinacija boja i emocija osobe koja ih percipira. Ovo je prava znanost.
Da biste razumjeli osnove teorije boja, postoji nekoliko izvrsnih publikacija:

Od potrebnih alata - Adobe Color CC


Zapamtite da je teorija boja usko povezana s tipografijom. Na primjer, ako je boja teksta preblizu boji odabrane pozadine, bit će teško čitljiv i posjetitelji će vjerojatno jednostavno proći pored ovog dijela stranice ili ga čak napustiti.

Sastav i opća organizacija

Kako postati web dizajner bez poznavanja osnova kompozicije? Nema šanse! Za mene je ovaj dio možda i najvažniji. Uostalom, možete odabrati prekrasne fontove, izvrsnu shemu boja, a zatim se jednostavno petljati s pravilnim rasporedom blokova, hijerarhijom i proporcijama i dobiti "najodvratnije jelo izvrsnih proizvoda".


Postoji nekoliko korisnih publikacija na ovu temu, nakon čega dolazi iz prvog (ili gotovo iz prvog) puta.

  • Korištenje zlatnog reza i pravila tri u web dizajnu

Trendovi web dizajna

O trendovima u web dizajnu možete govoriti beskonačno. Koju ulogu igraju? Najvjerojatnije su svi kupci, prije nego što su došli k vama, već pogledali nekoliko primjera cool modnih stranica, a možda čak i pročitali nekoliko članaka s trendovima web dizajna. Poznavanje modnih i popularnih dizajnerskih elemenata jednostavno je neophodno da bi razumjeli što traže i imali što ponuditi.

Budući da se trendovi u web dizajnu neprestano mijenjaju, nema smisla navoditi neke specifične publikacije kao primjer. Ovdje vam samo mogu savjetovati da pripazite na web stranice za web dizajnere, evo nekoliko dobrih primjera:

  • abduzeedo.com
  • behance.net
  • noupe.com
  • webdesignerwall.com
  • flickr.com
  • wwwards.com

Kako postati web dizajner: HTML i CSS

HTML to je "Hypertext Markup Language". Svaka web stranica koju ste ikada pogledali temelji se na HTML-u. HTML je jezik pomoću kojeg vaš preglednik razumije da stranica sadrži tekst, sliku, poveznicu, video zapis ili druge elemente. Vaš preglednik tada prevodi kod u ono što vidite na ekranu.


Drugi jezik koji jednostavnim riječima čini stranicu lijepom zove se css, što znači "Kaskadni stilski listovi". CSS govori pregledniku koji je font u tekstu i koje se boje koriste. CSS, jednostavnim rječnikom, definira izgled i dojam vaše stranice (gumbi, stilovi, boje, animacije).

Naučiti te jezike samostalno, ili barem steći osnovno razumijevanje kako funkcioniraju, prilično je jednostavno. Ovo su najjednostavniji računalni jezici. Međutim, oni su također prilično opsežni i mogu se koristiti u mnogim varijantama za stvaranje zapanjujućih dizajna.

Nakon što naučite osnove, postoji zaista nevjerojatan broj stranica na kojima možete naučiti više o tome kako postati web dizajner i sami naučiti programske jezike.

Izlijevanje uživo

Jeste li spremni postaviti svoju web stranicu na Internet? Imate li naziv domene (na primjer: mywebsite.com) i hosting (prostor na računalu koji je trajno povezan s internetom ili online hosting kupljen od trećih pružatelja usluga)? Učitajte svoje datoteke na svoj hosting, udobno se smjestite, opustite i…

Što učiniti nakon pokretanja stranice

Ispravi greške i završi ono što si zaboravio


"Ah, da, to je to... Definitivno sam to želio popraviti."- Događa se svima. Gotovo je neizbježno da se pogreške pojave nakon pokretanja bilo koje stranice. A što je stranica veća, veća je vjerojatnost da ste propustili pogrešku ili nešto zaboravili. Radi vaše udobnosti, ovdje je prilično detaljan kontrolni popis:

Prikupite povratne informacije

Ne možete se poboljšati ako ne znate gdje ste pogriješili. Vrijeme i iskustvo vas mogu tome naučiti, ali drugi vas mogu naučiti brže.
Kada pokušavate postati web dizajner od nule i učite sami, potičem vas da se pridružite zajednicama kako biste se povezali s drugim dizajnerima koji vam mogu pomoći i dati stručne savjete.

Kako postati web dizajner - sažetak

Članak je izašao prilično dugačak, ali bi bilo teško sve to stati u manje riječi, stoga želim čestitati svima koji su pročitali do kraja i iskreno vam se zahvaljujem na strpljenju. Ako želite saznati više o treningu web dizajna ili o specifičnim alatima i strategijama za rad, napišite to u komentarima, a mi ćemo svakako izraditi još korisnih materijala na tu temu. Sretno svima!

A ako ste spremni testirati svoje vještine na projektu uživo i trebate dobar hosting - kao bonus, možete kupiti hosting na godinu dana od našeg partnera Inmotion za samo 1 USD.

Izrada web stranica privlači mnoge, ali većina se ne usuđuje blisko surađivati ​​u ovom području zbog mnogih razloga, od kojih se glavni možda može nazvati nedostatak relevantnog znanja. Ali, to uopće nije problem, glavna stvar je da postoji želja za učenjem.

Nije tako teško svladati web dizajn od nule, ali će vam stečeno znanje biti korisno u mnogim slučajevima. Ovo nije samo način da povećate razinu svoje zarade (web dizajneri su uvijek traženi), već i prilika za samoostvarenje.

Dakle, gdje započeti s učenjem osnova web dizajna i izgleda? Prije svega, morate dobro savladati rad s grafičkim urednicima. Štoviše, govorimo i o rasterskoj i o vektorskoj grafici. Najčešći grafički programski paketi su Adobe Photoshop, Adobe Illustrator, CorelDRAW i Corel Paintshop.

Naravno, najbolje je savladati sve navedene programe za web dizajn i znati raditi s njima, ali najčešće se koriste Adobe proizvodi. Stoga, ako imate ograničeno vrijeme za obuku, bolje je odmah početi raditi s njima.

Web dizajn za početnike bit će učinkovitiji u savladavanju ako stečeno teoretsko znanje možete odmah primijeniti u praksi. Da biste to učinili, možete eksperimentirati s neovisnim stvaranjem elemenata i predložaka i raditi s izvorima drugih ljudi. Na Internetu postoji mnogo stranica s kojih možete preuzeti besplatne grafičke izvore, štoviše, prilično visoke kvalitete.

Ako je vaše znanje engleskog na dobroj razini, možete koristiti lekcije web dizajna sa stranih stranica. Postoji mnogo resursa na engleskom jeziku koji predstavljaju profesionalne zajednice korisnika Photoshopa i drugih Adobe proizvoda. Na takvim stranicama možete pronaći korisne savjete i opis nestandardnih značajki programa.

Suvremeni web dizajn nije samo dizajniranje i kreiranje izgleda stranice u grafičkom obliku, već i njezin izgled pomoću HTML-a i CSS-a.

Gotov predložak dizajna mora biti u skladu s određenim standardima i biti ispravno obrađen u svim uobičajenim preglednicima. Zato se ne preporuča razvijati dizajn isključivo temeljen na Flash tehnologiji - unatoč širokim mogućnostima, previše je "teška", ima ranjivosti, a ako nema posebnog dodatka u pregledniku korisnika, jednostavno ne funkcionira pojaviti u njemu.

Jezici izgleda stalno se poboljšavaju i razvijaju, isti HTML5 sada vam omogućuje da na web mjestu implementirate one značajke koje su se prije mogle dobiti samo pomoću Flasha ili raznih dodataka.

Web dizajn za početnike može se naučiti uz:

  • informacije s tematskih stranica i foruma;
  • samostalno ponavljanje lekcija i savjeta sa stranica na engleskom jeziku;
  • kupnja knjiga o web dizajnu;
  • poboljšati svoju profesionalnu razinu kroz stalnu praksu.

Slobodno se može reći da svatko može savladati osnove web dizajna, dovoljno je samo malo se potruditi, imati želju i odvojiti svoje vrijeme za to.

Prije početka karijere dizajnera, gotovo svaki početnik ima puno pitanja na koja nema odgovora zbog nedostatka iskustva. Koja znanja treba imati web dizajner, koje programe treba savladati, koliko vremena treba učiti, kako steći profesionalne vještine, gdje i kako tražiti kupca, kako predati gotove radove – pokušao sam odgovoriti na te i neka druga goruća pitanja u ovom članku.

1. Koja su znanja potrebna web dizajneru
Općenito, za početak bih vam savjetovao da pročitate neku razumnu. Za početak, samo se trebate kretati kroz njega dijagonalno, zaustavljajući se na onim trenucima koji su jasni. U početnoj fazi važno je razumjeti “što leži na kojoj polici”, koja je opća teorijska struktura. A kasnije joj se postupno obratiti za detaljnija objašnjenja o konkretnom pitanju uz dublje proučavanje i razumijevanje gradiva. To je, zapravo, to bi trebao biti takav radni udžbenik, koji bi uvijek trebao biti pri ruci.

Osobito je potrebno osnovno poznavanje web dizajna, . Posebnu pozornost treba obratiti na koncept kao što je "web stranica", ona i načela postojanja na Internetu. Usput, na mojoj stranici naći ćete mnogo teorijskog materijala koji će vam pomoći da dobijete potrebna osnovna znanja.

Drugo područje kojeg treba biti svjestan je . Čak i ako ne namjeravate izraditi svoju vlastitu, svejedno morate razumjeti kako je stranica napravljena. To će vam pomoći da izbjegnete pogreške u fazi stvaranja. Osnove programiranja nisu obavezne. Također bi bilo dobro razumjeti, jer većina stranica radi na ovoj platformi.

2. Koje programe treba savladati
U ovom slučaju, pridržavam se minimalizma. Iskreno vjerujem da je za normalan dizajn dovoljno znati . Međutim, ovaj program ne treba savladati na početničkoj razini. I tako morate provesti vrijeme proučavajući to. Svi ostali programi su izborni. Za raspored je dovoljan standardni Notepad.

3. Koliko vremena posvetiti treningu
Općenito, u ovom pitanju sve je vrlo individualno. Kod mene je to bilo u dvije faze. Prvo sam naučio koristiti Photoshop i počeo sam dobivati ​​napredne. Što se tiče vremena, trebalo je možda tri ili četiri mjeseca. Nakon toga se pojavila misao da je to to, sada sam dizajner i mogu raditi web stranice. Pokušao sam napraviti dizajn web stranice i nikako nisam uspio. Sve je izgledalo vrlo osrednje i nespretno.

Tada sam prestao pokušavati bilo što učiniti i jednostavno sam počeo proučavati radove drugih dizajnera. Doslovno sam povećalom gledao kako su napravljene stranice koje su mi se svidjele, razvrstao ih. Usput sam nastavio proučavati tutorijale, ali bez naprezanja. I nakon mjesec dana gledanja stvarno sam napravio kvalitativni skok i nekako sam lako napravio dva jednostavna sajta od kojih je jedan odmah kupljen.

Dakle, možemo reći da se nakon otprilike 4-5 mjeseci obuke već pojavljuju prilično jake dizajnerske vještine i odgovarajuće razumijevanje samog procesa dizajna. Ali naravno, pod uvjetom da se za sve to vrijeme stvarno samoobrazujete, trenirate, učite teoriju, trudite se.

4. Kako najbolje steći praktične vještine
Svakako vam savjetujem da počnete s kopiranjem stranica koje vam se sviđaju. Ali samo kao vježba! Nemojte ponovno izumiti kotač. Samo pokušaj učiniti isto. Uvjeravam vas, ispast će potpuno drugačije nego na originalu. I sljedeći korak, savjetovao bih vam da uzmete neku visokokvalitetnu besplatnu temu ili predložak i temeljito razumijete kod. Kako bismo pokušali upravljati elementima dizajna. Ovaj raščlanjeni kod se zatim može koristiti kao osnova za buduće dizajne.

5. Stvari o kojima treba voditi računa unaprijed
Morate voditi računa o dvije stvari. Prvo, svakako biste trebali otvoriti online račun za primanje sredstava za plaćanje vaših usluga. Sada to nije problem - postoji mnogo online novčanika i računa. I drugo, svakako biste trebali postaviti svoj . Pa i prema tome. Ako nema gotovih radova, napravite posao za sebe i stavite ga u svoj portfelj.

6. Kako odrediti stope
Moj vam savjet, svakako odlučite o svojim cijenama prije nego što komunicirate s kupcima. Nema ništa gore kada vam kupac pokuca na vrata, a vi ste prisiljeni nerazgovijetno odgovoriti na pitanje koliko to košta. Još bolje, imajte stranicu s cijenama raznih usluga. Povoljno i za vas i za kupca. Pa ipak, nikad nemojte pretjerano naplaćivati, barem u početku. Dok ste početnik, bolje da je cijena deset posto niža od takvih općeprihvaćenih cijena.

7. Kako tražiti kupca
Za početak nemojte zanemariti tradicionalne načine pretraživanja od strane kupaca. Možete se registrirati na svim vrstama popularnih slobodnih burzi i tamo stvoriti vlastitu stranicu s opisom usluga i primjerima rada. U principu, postoji mogućnost da ćete tamo pronaći kupca. Iako mislim da bi moglo potrajati dugo. Zato što se prije svega okreću vrhunskim freelancerima. Ali neću tvrditi.

Ali postoje, mislim, učinkovitiji načini. Obratite pozornost na SEO forume. Oni su mobilni momci i uvijek im trebaju neke odredišne ​​stranice, splogs ili PPS feedovi. Stoga su dosta zainteresirani za usluge projektiranja. Gotovo svaki veći forum ima odjeljak "Dizajn". Pažljivo proučite ovaj odjeljak, pogledajte koja se djela tamo prodaju, po kojim cijenama. Napravite nešto slično i stavite to tamo na prodaju. Upravo sam to u to vrijeme i učinio.

U principu, ako se naprežete i pokažete maštu, onda traženje kupca nije tako teško. Na primjer, svojedobno sam imao ideju da radim redizajn radnih stranica na internetu koje imaju potpuno beskoristan dizajn. I onda ponudite vlasnicima da kupe novi dizajn, ako im se sviđa, naravno. Glavna stvar je ne sjediti skrštenih ruku i ne čekati da red kupaca stane za vas. U početku ćete se morati potruditi u potrazi.

8. Kako komunicirati s kupcem
I konačno, imate potencijalnog kupca koji je zainteresiran za vaše usluge. U ovoj fazi pokušajte saznati što je moguće detaljnije što kupac želi vidjeti kao rezultat. Uvijek tražim od kupca da pokaže stranice na internetu koje mu se sviđaju. I također pitajte o onome što on definitivno ne bi želio vidjeti. Pa ipak, nikada ne podcjenjujte uvjete narudžbe, ma koliko to željeli! Bolje je baciti par dana na osiguranje i predati posao ranije nego gnjaviti kupca produžavanjem rokova.

9. Koji je mehanizam ispunjavanja naloga
Moja interakcija s kupcima bila je sljedeća. Prvo od kupca primam opis poslova (TOR). Potom neko vrijeme (obično od tri dana ili više, ovisno o zahtjevnosti) odrađujem posao i kupcu dajem izgled stranice u jpeg-u. To su obično glavna stranica, stranica za objave i stranica za pomoć. Ponekad je dovoljna i glavna stranica, ali to je potrebno unaprijed dogovoriti s klijentom.

Ako je klijent odobrio izgled, tada počinjem slagati. U ovoj fazi možete uzeti akontaciju, ali ja to obično ne radim. Više volim da posao bude plaćen po završetku. Barem zato što je vrlo stimulativno izvršiti narudžbu. Nakon što je stranica postavljena i testirana, klijentu dajem arhivu gotove stranice s uputama za instalaciju (ako se radi o WordPressu). Nakon toga naručitelj plaća izvršeni rad.

Ponekad pitaju trebate li se nekako osigurati od činjenice da ćete biti bačeni za novac. U principu, nitko nije imun na ovo. Stoga za početak pogledajte povijest postojanja vašeg klijenta na internetu. Koje stranice ima, gdje živi, ​​kakva mu je reputacija, koliko je dostupan. Ako je klijent sumnjičav, odbijte i nemojte riskirati. Ako ste i dalje bačeni za novcem, pokušajte to podnijeti lakše. Barem ste dobili samo cijenu jedne narudžbe, ali sada sigurno znate da više nećete raditi s ovim klijentom.

10. Kako se održati u dobroj formi
Nakon što steknete osnovne vještine u stvaranju dizajna, pokušajte postupno proširiti svoj tehnički arsenal. Pokušajte pratiti sve inovacije u industriji web dizajna i brzo implementirajte nove značajke u svoj dizajn. Sada postoji mnogo priručnika i tutorijala uz pomoć kojih je vrlo lako svladati sve inovacije. To, prvo, pridonosi vašem profesionalnom razvoju, a drugo, učinit će vaš dizajn modernijim i konkurentnijim.

Izbor urednika

Naučite web dizajn od nule - Vodič korak po korak za početnike (deset koraka)

Mnogi mladi žele svoje buduće zanimanje povezati s izradom web stranica. Naravno, ne žele svi biti programeri, neki od njih su prilično zadovoljni web dizajnom.

Naučiti ovo zanimanje od nule nije lak zadatak, jer osim radnih vještina, morate biti kreativna osoba, barem malo poznavati kod (poznati CSS i ), znati komunicirati s kupcem u isti jezik itd.

Prije početka upoznavanja s osnovama struke, postavljaju se brojna pitanja, a odgovore na njih morate potražiti sami. To nije lako učiniti zbog nedostatka iskustva, materijali s interneta ne postaju uvijek korisni, a ponekad i obrnuto, dodaju samo nova pitanja, a nema svatko iskusnog prijatelja.

Hajde da shvatimo gdje započeti učiti web dizajn, koja su vam znanja potrebna za kreativnost, gdje i kojim redoslijedom ih dobiti, koliko vremena posvetiti praktičnim vježbama, kako do prvog iskustva i narudžbe ... i s puno povezanih pitanja.

Sadržaj:

Prvi korak – saznajte zašto to želite učiniti

S jedne strane, ovo je jednostavno pitanje, jer se većina ljudi želi baviti web dizajnom zbog dobre plaće.

Izrada web stranica vrlo je isplativ posao i nije uvijek lako pronaći iskusnog, i što je najvažnije, inteligentnog programera popodne s vatrom.

Iako postoji mnogo slučajeva kada osoba želi učiniti upravo to, ali bez znanja o izradi grafičkog motora web stranice, nije ga lako programirati.

I treći uobičajeni razlog zašto se ljudi zanimaju za web dizajn je privlačnost prema likovnoj umjetnosti.

A ovo područje može poslužiti kao izvrsno sredstvo za ostvarivanje njihovih talenata u praksi i izvlačenje financijskih koristi od toga.

Važno! U koju god svrhu da se upoznajete s web dizajnom, zapamtite da i učenje i rad trebaju biti zanimljivi, obavljeni sa željom i donositi zadovoljstvo, ali ne pretvarati se u rutinu.

Budući da je grafičar mlada profesija, njegova točna definicija još ne postoji, a mnogi stručnjaci tumače koncept na svoj način.

Ako je ranije ova osoba morala učiniti stranice lijepima i ugodnima za oko, sada je potrebno imati vještine kodera, razumjeti marketing i razumjeti SEO promociju.

Bez jedinstvenih rješenja, originalnih ideja i individualnog kreativnog pristupa, zadatak se ne može riješiti.

Dizajner web stranice je tehnički umjetnik koji radi na izgledu i dojmu web stranice i optimizaciji učitavanja web aplikacija.

Zadaci ovih ljudi uključuju:

  • raditi na logičkoj strukturi stranice- kako bi svakom korisniku početniku sve bilo jasno, mogao je prvi put pronaći ono što je tražio, sve važne veze trebaju biti na vidiku;
  • razvoj najracionalnijeg načina prezentiranja sadržaja- sposobnost zainteresirati posjetitelja, natjerati ga da duže ostane na resursu, listati stranice stranice;
  • Grafički dizajn– gdje će koji elementi biti smješteni, kakvi će biti gumbi i natpisi nakon klika, kako se odvija interakcija s klijentom, kako i što će se mijenjati tijekom rada posjetitelja, zumiranja itd.

Tako smo ukratko otkrili zašto se ljudi žele baviti grafičkim dijelom stranica.

Za buduće programere dovoljno je upoznati se s osnovama vizualnog dizajna web resursa, barem površno svladati grafičke urednike, izgled predloška.

Oni koji žele posvetiti mnogo godina svog života stvaranju sučelja internetskih stranica i dobiti odgovarajuću profesiju, prvo će morati naporno raditi, a ovaj je članak posvećen njima.

Drugi korak - odaberite smjer web dizajna u kojem se želite okušati

Internetske tehnologije se ubrzano razvijaju, a s njima rastu i zahtjevi za programere. Isprva, lijepa estetska i svijetla stranica bila je zadatak umjetnika.

Danas razlikuju čak sedam pravaca u njihovom oblikovanju, a ovo su samo oni glavni.

teško

Star kao i sama izgradnja web stranice, tip dizajna stranice bez napora, savršeno za početnike.

Suština je da su svi elementi resursa smješteni u ćelije virtualne tablice s fiksnim veličinama, koje je postavio dizajner.

Takva će stranica izgledati potpuno jednako na svim uređajima, bez obzira na platformu i veličinu zaslona.

A to ne znači da je takav resurs nazadan, jer iskusni programer koji koristi kruti dizajn može stvoriti lijepo dizajnirano mjesto, au ovom slučaju potrebno je nekoliko minuta da se nešto ispravi.

Fleksibilno

Također tablični dizajn, ali širina ćelija virtualne tablice nije striktno određena, već ovisi o veličini zaslona (omjer stranica, rezolucija). Objekti će pokušati ispuniti cijeli prostor ćelije, mijenjajući njegovu veličinu. Glavna značajka takvog rješenja– poboljšanje pogodnosti vizualne percepcije podataka zbog dinamičke promjene parametara prikaza. Na takvim stranicama nema praznih mjesta bez sadržaja.

Izazovi ovog dizajna su:

  • nema jamstva da će na starim "kvadratnim" i ogromnim širokim zaslonima resurs prikazat će se ispravno, bez istezanja ili skupljanja sadržaja;
  • Ne rade svi preglednici dobro s obradom tzv. fleksibilnih ćelija, a internetski preglednici kreirani na različitim motorima to rade na svoj način;
  • potrebno je dosta vremena da se projekt prilagodi i dovede do idealnog.

Kombinirano

Kombinacija dvije prethodne metode: ako se dimenzije monitora (njegov omjer stranica) jako razlikuju od parametara prikaza koji su korišteni prilikom izrade stranice, primjenjuje se fleksibilni dizajn, inače se koriste obje ćelije, ovisno o dostupnosti slobodnog prostora u njima.

Tekst

Koristi se pri dizajniranju resursa i web stranica na jednoj stranici, koji predstavljaju mala poduzeća i tvrtke u globalnoj digitalnoj mreži. Značajka ovog dizajna je praktična odsutnost grafičkih elemenata, što pozitivno utječe na brzinu učitavanja stranice. Igranje s fontovima, bojama teksta i dobrim postavljanjem teksta pomoći će da projekt bude privlačan.

Ispis

Najviše traženi u razvoju korporativnih i marketinških resursa gdje je emotivni sadržaj na prvom mjestu. Dizajner bi trebao biti što kreativniji i kreativno birati slike piksela za dizajn stranice.

Nedostatak print dizajna je smanjenje brzine učitavanja stranice zbog prisutnosti, u pravilu, obilne količine rasterskih crteža, pa čak iu visokoj rezoluciji.

sučelje

Uglavnom mu se obraćaju iskusni majstori. Njihova je zadaća udovoljiti svim zahtjevima korisnika, najčešće minimiziranjem programskog koda, optimiziranjem grafičkih elemenata i stvaranjem praktičnog navigacijskog sustava s izbornicima koji se nalaze na vrhu stranice. Takvi se resursi brzo učitavaju, s njima je lako raditi i s računala i s mobilnih uređaja.

.

Dinamičan

Najdugotrajnije, složenije opcije dizajna za web stranice. Ova vrsta dizajna sastoji se od postavljanja dinamičkog sadržaja na stranicu (animacije, skripte, pokretni i promjenjivi elementi, video zapisi širokog ekrana).

Za provedbu planova morat ćete se dobro znojiti, a kako bi posjetitelj bio zadovoljan i sve radilo kako je zamišljeno, potrebno vam je ne samo vladanje grafičkim uređivačima, već i vještine optimizacije, tko želi dugo čekati vrijeme za pojavu bilo kojeg šarenog trodimenzionalnog gumba. Ali dobro razvijen izvor uvijek privlači svojom ljepotom, originalnošću i umjetničkim rješenjima, bez obzira na sadržaj.

Treći korak - saznajte koji su programi za web dizajn trenutno u trendu

Prije preuzimanja knjiga o određenom grafičkom uređivaču, morate jasno razumjeti elemente koji se koriste u grafičkom dizajnu web stranica: oblici, boje, oblici, igra svjetla i sjene, linije - to su osnovni elementi od kojih cjelina stvara se kompozicija.

svejedno, poznavanje kaskadnih tablica i označavanja hiperteksta potrebno je gotovo na prvom mjestu.

Dizajner će također trebati znanje iz područja računalne animacije, popularne, SEO, a možda i trodimenzionalnog modeliranja.

Pažnja! Uz poteškoće u svladavanju, aplikaciju će također morati kupiti za puni rad, iako je u svrhu obuke moguće varati zaobilazeći zaštitu programa.

Potonji je obrastao funkcionalnošću koja je tražena u desecima područja, a dečki malo pažnje posvećuju umnožavanju mogućnosti u vezi s web dizajnom.

Sketch je druga stvar - izoštren je za crtanje grafičkih sučelja od nule, nema niti jedan suvišni element, lakši je za učenje i lako prestiže Photoshop u pogledu osnovnih pokazatelja.

Obavezno odaberite najprikladniji koji podržava sintaksu i isticanje: , Sublime , Axure RP .

Četvrti korak - Istražite korisne knjige za ambiciozne web dizajnere

Internet je dobar jer vam omogućuje da besplatno dobijete knjige koje biste prije desetak godina morali kupovati ili tražiti istomišljenike.

S popularizacijom profesije web dizajnera povećao se i broj knjiga na tu temu. Bez mentora i učitelja knjiga je najbolji način stjecanja znanja.

Učenje web dizajna od nule treba početi s literaturom gdje su dani osnovni pojmovi, teorija i mali praktični zadaci:

Glavni elementi su:

    Logo- zauzima, u pravilu, središnji dio stranice i razlikuje resurs od ostalih;

    Elementi navigacije- postavljen na vrhu stranice vodoravno, rjeđe - okomito i sadrži poveznice na glavne odjeljke;

    Glavni blok u koji se postavlja sadržaj- zauzima glavni dio ekrana, tekst je uvijek popraćen slikama, tablicama, dijagramima, animacijama itd.

Modularna rešetka

Prije nego što razvijete shemu projekta, morate sami razumjeti koncept modularne mreže. To je način distribucije informacija u stupce, to je okvir buduće stranice.

Korištenje modularne mreže uvelike će pojednostaviti daljnji raspored, odvojite vrijeme da je upoznate.

Šesta faza - online treninzi

  • pohađanje seminara i edukacija;
  • sudjelovanje u online obuci (na daljinu).

Odaberite odgovarajuće tečajeve na temelju svog znanja, iskustva i smjera u kojem ostvarujete svoj kreativni potencijal. Tijekom tečaja šarmantno je konsolidirati teoriju u praksu.

1 Lekcije web dizajna za početnike

Iskusniji programeri koji govore engleski, svakako bi se trebali upoznati s tečajevima zapadnih kolega. Kao iu slučaju knjiga, zapadnjački tehnički umjetnici uvježbavali su nove tehnologije i rješenja na terenu, a drugo, koncept rada među stranim dizajnerima može biti dosta drugačiji, te je uvijek korisno učiti iz tuđeg iskustva. Ljudi dobivaju više za svoj novac od tečajeva nego od desetaka knjiga koje čitaju. s obzirom na praktične vještine.

Sedmi korak – Pronađite istomišljenike

U vašem poslovnom životu važno je komunicirati s ljudima koji rade ono što vi radite.

Tako ne samo da možete steći prijatelje, već i dijeliti iskustva, znanja, savjete, pružati pomoć i evaluirati projekte jedan po jedan.

Zdrava konkurencija- motor napretka, omogućuje vam razvoj, nastojeći učiniti bolje od prijatelja, unijeti nešto novo u projekt. A kada učite web dizajn od nule, svakako trebate komunicirati s iskusnijim programerima.

Osmi korak – Pratite trendove i trendove

Kako biste bili spremni na sve u radu s kupcem u području u kojem ne prođe dan bez novih proizvoda, potrebno je stalno pratiti nova dostignuća, rješenja i tehnologije.

Mijenjaju se na bolje, optimiziraju učitavanje resursa i povećavaju emocionalnu privlačnost stranice.

Najlakši način za posjet resursima, gdje iskusni i manje iskusni dizajneri izlažu svoje radove:

Deveta faza – okušajte se u burzi slobodnih djelatnika

Kao tehnički umjetnik možete raditi sami ili za bilo koju tvrtku. Korisnicima početnicima bolje je steći iskustvo na slobodnim burzama:

U početku radimo jeftino: primamo jeftine narudžbe i dugo i naporno radimo na njihovom ispunjavanju sve dok kupac ne bude zadovoljan.

Uspješni projekti su iskustvo ne samo u dizajnu, već iu komunikaciji s različitim klijentima, nadopunjavanje još uvijek praznog portfelja radovima.

Više pažnje posvetite popunjavanju profila i cijenama rada.

Jednostavni, ali dovedeni u obzir izgledi mogu se prodati, uzimajući kao osnovu slične projekte koji se nude na prodaju.

Važno! Slobodno postavljajte pitanja, zanimajte se koje stranice kupac najviše voli, tako da postoji nešto za navigaciju. Ne treba žuriti i raditi s nedostacima ili podcjenjivati ​​rokove, a onda kupca tjerati da čeka i bude nervozan.

Korak deset - Pretvorite web dizajn iz hobija u profesiju

Izradom web stranica najčešće se bave studenti i mladi ljudi, kojima ta aktivnost postaje hobi.

Vikende i večeri posvećuju svom omiljenom poslu, a kada steknu malo iskustva i hobi donese prve prihode, ozbiljno razmišljaju o promjeni zanimanja.

To je samo dati otkaz na poslu i otići slobodnog kruha ili sadašnji posao zamijeniti udobnom stolicom u uredu za kompjuterom mnogi se boje.

Ovdje utječe nedostatak iskustva i male šanse za pronalaženje kupca ili stjecanje stalnih kupaca, a nitko ne jamči stabilnu zaradu u slučaju rada i relevantnih foruma.

Riža. 15 – S vremenom bi web dizajn trebao postati profesija

Pa ipak, ako zanimanje za razvoj grafičkih sučelja web stranica privlači, svakako ga vrijedi pretvoriti u glavnu profesiju i nije potrebno odgađati.

S vremenom će se pojaviti znanje, iskustvo i stalne narudžbe.

A ako želite više stabilnosti, obratite pozornost na rad u uredu među istomišljenicima uz mogućnost povremenog rada na daljinu.

Glavna stvar je nastojati postati bolji, stalno se razvijati i uživati ​​u onome što radite!