If you are decided to learn web designing on your own, you are in the right place.
on totta, että web-suunnittelu voi olla melko monimutkainen ja pelottava, mutta teknologian kehityksen ja Internetin yleistymisen myötä se on kasvanut eeppisiin mittasuhteisiin. Ei ole yllättävää, että Web-suunnittelijaksi ryhtymisestä on tullut suosittu trendi nykysukupolvessa.
tässä artikkelissa opastan sinua opettelemaan verkkosuunnittelua resurssein ja vinkein. Aloittelijoille, jotka haluavat ottaa tämän polun, voit palvella tämän artikkelin oppaana.
Vaihe 1: Päätä ja tee suunnitelmia
verkkosuunnittelun oppiminen on pitkäjänteinen tehtävä, joka on täynnä haasteita. Sinun täytyy haastaa itsesi vakavasti. Päätä juuri nyt ja tee suunnitelmia perustuu oppimisen oppaita, jotka esittelemme tässä artikkelissa. Muista, että teet sen itse, jos aloitat oppimisen web design käytännön kautta. Joten olkaa valmiina!
Vaihe 2: Get a basic understanding of web design
”How can I start learning web design?”Tämä on kysymys mielessäsi. Www-suunnittelun läpikotaisin opettelemiseksi tulee ymmärtää ainakin seuraavien 2 kysymyksen vastaukset:
mitä web-suunnittelu on?
ihmiset ymmärtävät usein väärin verkkosivujen suunnittelun merkityksen.
No, mitä web-suunnittelu oikeastaan on?
Visual + interaction = web design
Web design on ongelmien ratkaisemista. Se sisältää kaikki näkökohdat sivuston-taiteen, taidot, tiede, ja teknologia rakentaa ulkoasua ja toiminnallisuutta sivuston, sekä tapoja, joilla käyttäjät ovat vuorovaikutuksessa web-sivuja.
monet nuoret suunnittelijat käsittävät usein väärin verkkosuunnittelun ja kehityksen käsitteen.
muista: verkkosuunnittelussa on kyse suunnittelusta, ei koodaamisesta ja etupään tai takapään kehittämisestä.
on tietysti parempi, jos osaa joitakin koodauskieliä (HTML, CSS,Java jne.), mutta sinun ei pitäisi saada itsesi syvälle front-end tai back-end kehitystä, jos haluat olla keskittynyt web-suunnittelija. Se ei ole verkkosuunnittelun ydin.
mikä on web-suunnitteluprosessi?
Web-suunnittelu ei ole yksinkertainen tehtävä. On varsin haastavaa, mutta mielenkiintoista tehdä tyhjästä sivusta kokonainen verkkosivusto. Miten voit tehdä sen?
sinun on seurattava web-suunnitteluprosessin päävaiheita. Ne ovat:
- tavoitteen asettaminen
päätä, millaisen verkkosivuston suunnittelet. Onko kyse sähköisestä kaupankäynnistä, yrityksestä, uusien tuotteiden edistämisestä vai aktiviteettiprojektista?
jos sinulla ei ole aavistustakaan, aloita blogista. Uusille oppijoille blogin rakentaminen on parempi valinta kuin muunlaisten taidokkaiden verkkosivujen luominen.
- tehdään aikataulu
luo aikajana sivujen suunnitteluun. Määritä tehtäviä kaikille mukana web designing project.
- tilannekuvan luominen ja johtorakentaminen
aivoriihi. Käännä ideat lankakehykseksi kynällä tai lankakehystystyökaluilla. Sinun täytyy kääntää ajatuksia jotain konkreettista, jotta voit vahvistaa ne varhaisessa vaiheessa.
- sisällön luominen
lisää sisältöä, jossa on sisustuselementtejä, visuaaleja, kopioita ja vuorovaikutuksia. Tässä vaiheessa laitetaan kaikki suunnittelu-ja kehitystaidot käyttöön. Voit muuntaa tyhjän sivun valmiiksi verkkosivustoksi tässä vaiheessa.
- testaus
testaa verkkosivusi ja kerää hyödyllistä palautetta. Tee se, kunnes maksimoit käyttökokemuksen laadun ja olet sitten valmis käynnistämään.
- käynnistäminen
tee verkkosivustosi kävijöiden käyttöön ja paranna sitä kerätyn palautteen perusteella.
tällä 43 minuutin Web Design-kurssilla voit saada kokonaisvaltaisemman käsityksen web design-prosessista.
Vaihe 3: Aloita oppiminen
kun olet perustanut itsesi ja ymmärtänyt verkkosivuston suunnittelun perusteet, voit alkaa käydä läpi käytännön oppimisresursseja ja vinkkejä.
Verkkosuunnittelussa on kyse sekä visuaalisesta ilmeestä että funktionaalisesta suunnittelusta. Tämä tarkoittaa, että sinun täytyy oppia 2 tärkeimmät asiat:
- miten sivusto saadaan näyttämään hyvältä?
- miten saat verkkosivuston toimimaan hyvin?
sinun on opittava suunnittelemaan rajapintoja (typografia, navigointi, Kuvat, tila, animaatiot, värit jne.), kuinka koodata niitä web-kehityksen kielellä (HTML, CSS, Python, SQL, Ruby tai JavaScript) sekä optimoida sivustosi hakukoneille.
Lue web design learning books
yksi parhaista tavoista oppia web design on lukemalla kirjoja. Tässä on 5 parhaista web design kirjoja, jotka ovat hyödyllisiä niille, jotka haluavat oppia web design omasta.
- HTML ja CSS: Design and Build Websites
- Learning Web Design: a Beginner ’s Guide
- Don’ t Make Me Think: A Common Sense Approach to Web Usability
- Learning web design
- Designing with Web Standards
Read web design blogs
jos et ole lukutoukka ja koet lukemisen työlääksi, voit seurata joitakin parhaita web design-blogeja pitääksesi aivosi ruokittuina. Käytä blogeja vaihtoehtona ja tilaa suosikki niistä välttää puuttuu mitään.
- Smashing Magazine
- Mockplus blog
- Webdesignledger
- WEB DESIGN LIBRARY
- Hacking UI
- 1stwebdesigner
webappers
Opi PDF-sisällöllä
joitakin todella hyödyllisiä sisältöjä on saatavilla PDF-muodossa ilmaiseksi ladattavaksi. Voit käyttää sitä oppia web design askel askeleelta. Nämä ovat muutamia esimerkkejä kannattaa aikaa.
- Web design – handbook
- Learning Web Design Third Edition – Semantic Scholar
- Web design 101 – mit
- Rakenna oma Web – sivusto oikealla tavalla HTML & CSS-X-Files
- a Complete Guide to Web Design.pdf – Online Christian Library
Learn from professionals
Follow web designers you have to learn from on social media sites such as Twitter, Dribbble, Behance, Github, and other platforms where they are active. Lue heidän virkaa, klikkaa Tykkää-painiketta niille, joita arvostat, ja kommentoida, jos haluat lisätä pisteen tai kysyä kysymyksen . Jos olet onnekas, voit löytää itsellesi mentorin verkkoyhteisöstä tai ryhmästä. Mutta älä häiritse heitä ja pidä heidän apuaan itsestäänselvyytenä.
Verkkosuunnittelijoita voit seurata:
- Ethan Marcotte
- Chris Coyier
- Ethan Marcotte
- Jeffrey Zeldman
- Luke Wroblewski
Learn from web design video tutorials
verkossa on paljon Youtube-videoita. Vähennä aikaa katsomassa hauskoja juttuja ja käyttää YouTubea oppia web design. Täällä suosittelen 5 suosituimmista video tutorials. Nauti katselusta.
- Aloittelijan verkkosuunnittelun opetusohjelma 2018-Osa 1 2
- Web Development Tutorial aloittelijoille 2018 / 2019 – miten tehdä verkkosivuilla
- verkkosivujen suunnittelun opetusohjelma aloittelijoille
- HTML CSS Tutorial aloittelijoille-Web Development Tutorials aloittelijoille
- täydellinen HTML ja CSS Web Design Oppaat aloittelijoille
Opi verkkokursseilta
Ilmaiset verkkokurssit voivat olla parhaat resurssit. Voit myös keskustella muiden oppijoiden kanssa.
- Class central
Opi Verkkokehitystä ilmaisilla verkkokursseilla ja Mooceilla Johns Hopkinsin yliopistosta, Michiganin yliopistosta, KU Leuvenin yliopistosta, Kalifornian yliopistosta, Berkeleystä ja muista huippuyliopistoista ympäri maailmaa.
- Coursera
loistava sivusto aloittelijoille, jotka oppivat web-suunnittelua. Voit valita haluamasi yliopiston kurssin ja nähdä, kuinka moni opiskelee sitä. Kun tiedot esitetään, sinulla on paljon vaihtoehtoja valitessasi kurssin.
- Edx
siinä luetellaan paljon resursseja oman suunnittelutaidon kehittämiseen ja uran edistämiseen. Voit oppia aiheita askel askeleelta eri tasoilla vaiheissa vaikeudet.
- W3Schools
hyödyllinen koodauksen peruskielten kuten HTML: n ja CSS: n oppimiseen.
- Google Code University
Opi koodaamaan Googlen kehittäjiltä.
- Code Avengers
pidän erityisesti tästä oppimissivustosta, koska se on kuin suuri seikkailu, jolla voi osallistua koodaushaasteohjelmiin ja ötökkämetsästykseen.
lisää paikkoja web design – verkkokursseille：
- Treehouse
- Lynda
- Udemy
- Coursera
- Webdesign.tutsplus
Learn HTML basics and CSS
You may question, why should I learn HTML? Yleensä, käyttämällä web design app kuten Dreamweaver on hieno. Mutta tällä hetkellä, useimmat sivustot ovat reagoiva HTML5 perustuu, ja CSS on ihon verkkosivuilla. Moderni Verkkosivujen suunnittelu ei ole mahdollista ilman CSS: ää. HTML: n perusasioiden ja CSS: n oppiminen auttaa sinua etenemään web-suunnittelussa.
resursseja HTML: n ja CSS: n oppimiseen：
- 30 Days to Learn HTML and css
- a Beginner ’s Guide to HTML & CSS
- Don’ t Fear the Internet
- 8 Best Free Responsive CSS Website Templates
Voit myös liittyä CodePen-yhteisöön. Tämä on avoimen lähdekoodin yhteisö, jonka avulla voit muokata koodinpätkiä ja jakaa niitä muiden kanssa.
Learn JavaScript
HTML: n ja CSS: n ohella JavaScript on tärkeä Webin kieli, jota voi oppia. Se on työkalu, jonka avulla voit luoda kehittyneitä käyttäjän vuorovaikutuksia, kuten parallax vaikutuksia ja tehokas web-sovelluksia.
resursseja JavaScriptin oppimiseen:
- 32 parhaista paikoista oppia JavaScript Web Development Beginners
- Top 37 JavaScript kirjoja aloittelijoille ja kokeneille ohjelmoijille 2019
lisätietoja web design elements
jos olet hyvä havainnoinnissa, huomaat, että useimmilla houkuttelevilla moderneilla verkkosivustoilla on hyvä järjestely verkkosivuston peruselementeistä, kuten:
1 l / typografia
Typografia on avain erinomaiseen web designiin. Se varmistaa sisällön luettavuuden ja vaikuttaa suoraan käyttäjäkokemukseen. Typografia on merkittävä osa kaikkia nykyaikaisia verkkosivustoja, sillä se tarjoaa kävijöille sekä estetiikkaa että toiminnallisuutta.
resursseja verkkotypografian oppimiseen:
- 17 parhaat Typografiasuunnittelusivustot & Tutorials
- 30 luovaa verkkosivustoa upeilla Typografioilla & väriteemoja
2）animaatio ja muunnokset
siirtymät ja muunnokset tuovat tehostettua käyttäjien vuorovaikutusta sivustosi kävijöille. Yksi parhaista tavoista luoda yksinkertaisia animaatioita on CSS siirtymät ja muunnokset. Lisäksi, parallax vieritys tehosteet ja horisontaalinen vieritys ovat hyviä valintoja sivustoja.
3）värimaailma
verkkosivuston väriyhdistelmät heijastavat web-suunnittelijan esteettistä mieltymystä/tyyliä ja vaikuttavat suoraan katsojan havaintokykyyn. Sinun täytyy oppia käyttämään väriä UI suunnittelu viisaasti luoda täydellinen UI käyttöliittymä.
4 kpl fontteja
personoidut fontit voivat olla hauskoja tai ilmeikkäitä, mutta eivät aina käytännöllisiä. Jos haluat sivuston olevan luettava ja ammattimainen, valitse sille sopivin fontti. Tarkista 20 Paras Google Web fontteja erinomainen Web Design. Ne ovat vapaasti käyttää!
5 ð Layout
Web layout design keskittyy tekniikan ja taiteen risteyskohtaan. Web layout design viittaa yhdistelmä visuaalisia elementtejä, kuten tekstiä ja kuvia, jotta sivu näyttää kaunis ja helppo navigoida. Se on tärkeä visuaalisen viestinnän muoto ja olennainen osa web-suunnittelua. Tässä on 9 parhaista verkkosivuilla ulkoasu esimerkkejä ja ideoita.
6 LV grafiikka
kuvat antavat ihmisille tekstiä intensiivisemmän visuaalisen vaikutelman. Ne voivat lisätä mahdollisuuksia houkutella huomiota käyttäjille.
7）Responsive design
Responsive web design on kokoelma tekniikoita, joilla rakennetaan verkkosivustoja, jotka toimivat useilla näyttökooilla. Opi Se tällä 47 minuutin CSS-kurssilla.
Opi rautalankamallin/prototyyppien perusteet
Rautalankamuotoilu/prototyyppaus on tärkeä askel luoda perusta verkkosivustollesi koko verkkosivuston suunnittelu-ja kehitysprosessissa. Sen avulla voit ideoida, tehdä suunnitelma, ja saada selkeä käsitys rakenteesta sivuston.
älä sekoita eri termejä keskenään. Käy läpi perus UI / UX-suunnittelukonseptit: Wireframen, prototyypin ja Mockupin erot
Opi web design tools
Photoshop – UI design tool
sitä voidaan käyttää valokuvien, kuvitusten, 3D-taideteosten, suunnittelusivustojen ja mobiilisovellusten luomiseen ja parantamiseen; Muokkaa videoita, simuloi tosielämän maalauksia; ja paljon muuta. Voit oppia käyttämään kautta tahansa 22 paras ilmainen askel askeleelta Adobe Photoshop Tutorials aloittelijoille.
Dreamweaver – web development tool
sen avulla voidaan luoda dynaamisia verkkosivuja useille alustoille ja selaimille. ”Dreamweaver antaa käyttäjilleen mahdollisuuden suunnitella, koodata ja hallita verkkosivustoja sekä mobiilisisältöä. Dreamweaver on integroitu kehitysympäristö (IDE) – työkalu.”(Wikipedia). Aloita Aloittelijan opas Dreamweaver.
Mockplus – prototyyppityökalu
Mockplus on yksi parhaista web-suunnittelijoiden prototyyppityökaluista interaktiivisen verkkomallin luomiseksi. Voit vetää ja pudottaa komponentteja rakentaa sivuston, ja esikatsella sitä HTML – tai muissa muodoissa. Tarvitset vain 10 minuuttia aloittaa prototyyppien ilmaiseksi.
Opi verkkosivustojen rakentajalla
aloittamalla verkkosivustojen rakentaja voi nopeasti auttaa sinua ymmärtämään verkkosivustojen rakentamisen ja suunnittelun parhaat käytännöt. Ennalta suunniteltujen mallien ja KÄYTTÖLIITTYMÄSARJOJEN avulla voit muokata elementtejä tai lisätä koodinpätkiä tehdäksesi sivuston, jota kävijät ihailevat.
verkkosivujen rakentajat, voit kokeilla:
- Web Host Review
- Wix
- ConstantContact
- SITE123
- Jimdo
- WordPress
Learn SEO
It is hyvä, että on SEO-asiantuntija, joka käsittelee hakukonejuttuja. Mutta suunnittelu on melko liittyy SEO koska sisältöä sivustosi luetaan hakukoneet ja on rooli ranking. Jos haluat suunnitella SEO-optimoitu verkkosivusto, sitten tietäen perusteet SEO on välttämätöntä. Ainakin sinun pitäisi tietää metakuvauksista sivuilla ja elementeissä.
Opi suunnittelutrendit
suunnittelutrendit muuttuvat nopeasti. Sinun täytyy olla tietoinen viimeisimmistä suunnittelutrendeistä ja web-kehitysteknologioista suunnitella moderni verkkosivusto. Voit käydä läpi Top 10 Must-Know Web Design trendejä ja esimerkkejä 2019 inspiraatiota.
Vaihe 4: Aloita johtokehyksellä
Aloita verkkosivujen suunnitteluprosessi johtokehyksellä. Wireframing auttaa web-suunnittelijat aivoriihi ja validointi ajatuksiaan varhain. Aloita wireframing 10 käytännön vinkkejä luonnostella Wireframes.
Vaihe 5: Käytä oppimaasi verkkosivujen suunnitteluun
nyt on aika testata, mitä olet oppinut vaiheessa 3. Sinun täytyy oppia web design tekemällä se. Sitten tiedät, mitä ymmärrät ja mitä et.
Vaihe 6: pyydä palautetta ja tee parannuksia
jos olet luonut blogin tai jonkin muun verkkosivuston, kutsu siihen ihmisiä. Yritä saada niin paljon palautetta kuin voit sitten tehdä parannuksia.
FAQ of learning web design success
kuinka kauan kestää oppia web design?
Web design-oppiminen on jatkuva prosessi, mutta sen voi oppia kuukausissa. Yleensä, se vie 5 kuukautta oppia HTML, CSS ja perusteet JavaScript. Sinun täytyy myös viettää aikaa suunnittelutyökaluja, kuten Photoshop, Sketch, ja Mockplus.
lisäksi sinun oletetaan ymmärtävän web-standardit, suunnitteluperiaatteet, UX/UI-suunnittelun, cross-browser-yhteensopivuuden ja reagointikyvyn. Kaikkien näiden oppiminen vie 3-4 kuukautta.
ja tärkeintä on, että olet juuri astumassa verkkosuunnittelun alalle kaikkien noiden oppituntien jälkeen. Suunnittelu muuttuu, teknologia muuttuu, joten sinun täytyy jatkaa oppimista jatkuvasti.
Voinko ryhtyä verkkosuunnittelijaksi ilman tutkintoa?
verkkosuunnittelijaksi voi valmistua ilman tutkintoa. Ollakseen web designer, tutkinto ei ole välttämätöntä, mitä sinun täytyy olla kiinnostus ohjelmointi, osaaminen visuaalisen suunnittelun ja koodaus kielellä web development, sekä muita taitoja web design. Mutta tutkinto voi lisätä mahdollisuuksia saada palkata useimmissa tapauksissa.
mitä voin tehdä verkkosuunnittelukurssin jälkeen?
kun olet suorittanut web design-kurssin, voit ryhtyä live-projektiin, sitten palkata web design-yrityksen tai olla freelancer ja etsiä projekteja ja asiakkaita itse.
onko web-suunnittelulla tulevaisuutta?
elämme digitaalisessa maailmassa, joka on täynnä verkkosivuja. Tulevaisuus on varsin lupaava.
Creative Group 2019-Palkkaoppaan mukaan front-end web developer on yksi luovan alan ja markkinoinnin korkeimmin palkatuista työpaikoista yhdessä UX-suunnittelijoiden, käyttäjäkokemuksen tutkijoiden, copywritersin jne.kanssa. Mukaan Glassdoor, web kehittäjät saavat palkkaa välillä $41.6 k-78.3 k vuodessa ja mukaan PayScale heille tarjotaan $16.4 k – 34.6 k vuodessa. Web-suunnittelijan keskipalkka on noin 49 693 dollaria.
onko web-suunnittelu helppoa?
se saattaa tuntua aluksi yksinkertaiselta, sillä HTML & CSS: n perusteet voi oppia muutamassa kuukaudessa. Mutta kun edistyt tällä alalla, saatat löytää se haastavampaa. Sinun täytyy jatkuvasti oppia uutta teknologiaa pysyä mukana kaikissa muutoksissa. Mutta jos olet kiinnostunut rakentamaan sivustoja ja web-sovelluksia, niin web design voi olla helppoa sinulle.
Conclusion
jos haluat opetella web-suunnittelua omin päin, yllä olevista tiedoista löytyy kaikki, mitä tarvitset aloittaaksesi. Älä tuhlaa aikaa Facebook tai Twitter ”etsivät vastauksia”. Vaikka niille alustoille voi rakentaa suunnitteluyhteisön, Ei web-suunnittelijaksi voi ryhtyä viettämällä aikaa päämäärättömästi. Joten, kyykisty alas ja ala opetella. Älä koskaan anna periksi oppimisen ja onnea sinulle!