30 tips for å lære nettdesign på 30 dager
Er det å lære det grunnleggende om webdesign fremdeles på "en dag" -listen? Hvorfor har du ikke kommet i gang ennå? Vi har satt sammen 30 tips og ressurser som hjelper deg å begynne å lære webdesign denne måneden (og kanskje til og med finne deg en ny karrierevei!)
Grafiske designere, trykte designere og reklamer som ønsker å lære noe nytt eller bryte inn på nettstedet, må slutte å utsette. Hver dag som du ikke tar det første skrittet, etterlater deg en dag lenger bak alle andre!
Følg disse trinnene for å begynne å lære hvordan du lager ditt første nettsted, beste bransjepraksis og mye mer - alt på 30 dager!
1. Start et nettsted
Den beste måten å begynne å lære webdesign er å begynne å gjøre det. Det er rådet fra David Kadavy, forfatter av Design Hackers.
Jeg anbefaler deg å starte en blogg. Jeg startet en blogg bare for å ha en lekeplass for webdesign, og 7 år senere lanserte jeg en bestselgende bok om emnet. Å ha et personlig prosjekt, for eksempel en blogg, gir deg et sted hvor du kan prøve nye ting, og sjefen din vil ikke fyre deg hvis du roter deg.
Du trenger ikke å starte med et massivt nettsted eller sprø design; begynne i det små. Lek med nettstedet, finn ut hva som får ting til å fungere. (Og sørg for å inspisere koden, slik at du kan begynne å bli kjent med hva som får nettstedet ditt til å fungere.)
Vil du komme raskt i gang? En nettstedsbygger som Wix kan bidra til å gi deg et forsprang med et stilig webdesign, når du begynner å lære konseptene og byggesteinene til det som går inn på en webside.
2. Les alt du kan
Begynn å lese. Fordi du er på denne bloggen, er du sannsynligvis vant til å holde rede på hva som skjer i designverdenen. Fortsett å lese.
Les alt du kan om design av nettsteder, trender og teknikker og beste praksis. Følg designere du beundrer på sosiale medier.
Kast et bredt nett for lesing av nettsteddesign også. Les om det grunnleggende for å lære litt kode, lese om designteori og lese veiledninger og aktuelle artikler.
3. Vær en effektiv kommunikator
Hvis du ikke er den mest artikulerte personen, bør du bruke disse ferdighetene. En stor del av nettsteddesign er kommunikasjon.
Nettstedsdesignere må kommunisere med kunder regelmessig for å finne ut hvilket problem designen trenger å løse; de må kommunisere disse løsningene og implementere dem også.
4. Abonner på Tuts + & Envato Elements
Vurder et abonnement på Envato Elements, som også gir deg tilgang til den utmerkede læreressursen Tuts +.
Tuts + publiserer regelmessige kurs om grafikk og webdesign, fra grunnleggende teknikker, til de nyeste avanserte tilnærmingene og utviklingen. Det er fullstendig fartsfylt, undervist av ekspertinstruktører. Du vil også få tilgang til Envato Elements, som er en flott ressurs for å finne grafikk, maler og mer for å plugge inn i webdesignarbeidet.
5. Tenk i HTML
HTML, eller hypertext markup språk, er en hjørnestein i nettsteddesign. HTML er skjelettet som hjelper deg med å skape strukturen til et nettsted, og når du først har lest språket, vil webdesignens verden gi mye mer mening.
W3Schools har en flott HTML-starttutorial med hundrevis av HTML-eksempler som du kan leke med på skjermen for å se hva som skjer og nøyaktig hvordan det fungerer. (Du kan synes det er mer intuitivt enn du forestilte deg.)
6. Lek med kode på Codeacademy
Selv om HTML er en god start, kan du lære nesten ethvert programmeringsspråk fra Codeacademy. Det gratis verktøyet lærer deg å kode ved hjelp av interaktive aktiviteter og spill.
Du kan hente et Codeacademy-kurs hvor og når du trenger det og starte og stoppe etter behov. Velg et emne du vil lære - nettutvikling, programmering, datavitenskap - eller språk å fokusere på - HTML og CSS (et flott sted å starte), Python, Java, SQL, Ruby og mer.
7. Lær å forstå CSS
CSS, eller kaskaderende stilark, definerer presentasjonen av et dokument skrevet i HTML, eller XML og SVG.
Som definert av Mozilla
CSS beskriver hvordan elementer skal gjengis på skjerm, på papir, i tale eller på andre medier.
Mozilla har også en flott samling av CSS-ressurser for å komme i gang, med en solid introduksjon av hvordan CSS fungerer, inkludert velgere og egenskaper, skrive CSS-regler, bruke CSS på HTML, hvordan du spesifiserer lengde, farge og andre enheter i CSS, kaskade og arv, grunnleggende basismodeller og feilsøking CSS. Deretter går modulene videre for å forklare stylingstekst og bokser.
8. Bruk designferdighetene dine på nettet
Hvis du allerede jobber i et kreativt eller grafisk designfelt, bør du tenke på de tingene du allerede vet at du også kan bruke til webdesign. Prinsippene som gjør noe visuelt tiltalende endres ikke basert på medium og alt det som designteori vil komme godt med i det digitale rommet.
Selv om elementer som å lære seg kode kanskje ikke føles naturlig, er det en stor bonus å ha designbakgrunn. Hva er bra med et vakkert kodet nettsted hvis ikke en ønsker å samhandle med det?
9. Vær oppmerksom på nettsteder du er glad i
Legg merke til nettsteder du er glad i. Hva med dem tiltaler deg? (Og hvordan kan du lære å gjenskape disse elementene?) Vær oppmerksom på:
- typografi
- Navigasjon
- Bruk av bilder og plass
- Design av former
- Animasjon og rulleeffekter
- Farge
10. Tegn en trådramme
Wireframing er en webdesigners idédugnad.
I sin reneste form er et wireframe en skisse av hva nettstedet vil være. Det er ikke en oversikt over estetiske elementer, heller en blåkopi av nettstedet. Å tegne en wireframe handler ikke egentlig om utseendet til dette designet, det handler om informasjonsstrukturen der.
Er du usikker på hvordan du oppretter en wireframe? Digital telepati har en guide for beste praksis for å hjelpe deg å lære.
11. Ta deg tid til å lære skisse
Sketch er et vektortegningsverktøy for Mac som gjør det enkelt å lage designelementer. Mange designere henvender seg til Sketch for å lage UI-elementer og gjenta designblokker.
Den er fullpakket med plugins og lar deg eksportere kode for enkel bruk og tilgang. Det er et av de kraftigste, og mest populære verktøyene som finnes siden Adobes Creative Suite og verdt tiden din.
12. Hold deg oppdatert med teknologi
AI, VR, AR, 360-graders video, roboter.
Det kan være vanskelig å følge med så mange nye teknologier og trend. Men du må gjøre et poeng for å holde deg oppdatert på disse endringene.
Ta tak i dem én om gangen og begynn med teknologier som er mest direkte relatert til arbeidet du gjør. Hvis du har et nettsted med nettprat, kan du begynne med å lære om bots. Eller hvis du bruker mye videoinnhold, kan du leke med 360-graders video.
Elementer som kunstig intelligens og virtuell eller utvidet virkelighet er enda mer kompliserte, men vil sannsynligvis bli integrerte deler av nettstedets designlandskap nede i veien. Som et minimum, bør du vite hva de er og hva den potensielle bruken kan være.
13. Bli komfortabel med SEO
Mens mange nettdesignere tror en SEO-spesialist kan takle å få et nettsted klart for søkemotorer å lese, er det mye designarbeid som er koblet til SEO.
Fra måten bilder lastes opp til å lage ren kode som er raskt å inkludere metabeskrivelser på sider og elementer, bør designeren inkorporere søketenkning i arbeidsflyten.
Frilansere, dette er veldig viktig også for deg. De fleste kunder er kyndige nok til å be om et SEO-optimalisert nettsted. Hvis du jobber alene, må du vite nok til å lage en solid ramme som Google kan lese (og kunne henvise klienten til en SEO-spesialist hvis mer arbeid må gjøres).
14. Spill med en nettstedsbygger
En nettstedsbygger kan være en flott måte å bli komfortabel med god praksis og hvordan du starter bygging og utforming av nettsteder.
De fleste av disse verktøyene har mange maler, og lar deg tilpasse elementer og til og med legge til kodebiter. For enkle nettsteder har mange nettstedbyggere også en gratis plan hvor du kan lage en personlig porteføljeside eller grunnleggende nettsted som fungerer som en lekeplass for deg.
Velg deretter delene fra nettstedets byggherre. Se på hvordan de er designet og kodet for å få en følelse av hvordan det hele kommer sammen. Du vil bli overrasket av hva du kan finne ut bare ved å velge et annet design fra hverandre.
15. Finn en mentor
Er det noen du jobber med som du beundrer som nettdesigner? Ta dem til lunsj og velg hjernen om bransjen.
Det kan være uvurderlig å finne en mentor som er villig til å samarbeide med deg og hjelpe deg med å tenke på feltet og hvordan du lærer webdesign på egen hånd. Og selv om du sannsynligvis kan finne en mentor i et online fellesskap, er ingenting bedre enn en levende person som du kan møte ansikt til ansikt med jevne mellomrom. (Kanskje det er verdt å ha online mentorer og personlige mentorer.)
16. Bli medlem av CodePen-fellesskapet
Når du begynner å bli komfortabel med litt kode og programmering, vil du bli medlem av CodePen-samfunnet. Open source-fellesskapet lar deg dele og redigere kodebiter i et sosialt nettverk av sorteringer.
Her er litt mer fra grunnleggerne av nettstedet: “CodePen er et sosialt utviklingsmiljø. I hjertet lar den deg skrive kode i nettleseren, og se resultatene av den mens du bygger. Et nyttig og frigjørende verktøy for utviklere av hvilken som helst ferdighet, og spesielt styrke for folk som lærer å kode. Vi fokuserer først og fremst på forhåndsspråk som HTML, CSS, JavaScript og forbehandlingssyntakser som blir til disse tingene. ”
17. Ta en klasse
For noen elever er en mer formell klasseromsinnstilling best.
Det er mange klasser tilgjengelig - personlig og online - for deg å lære grunnleggende om webdesign. Begynn med en lokal høgskole eller online læringsknutepunkter som Udemy eller Coursera. Hent en klasse på ditt nåværende evnenivå og bare fortsett fremover.
18. Vil du gjøre noe? Google det
For den ikke-så tradisjonelle eleven, finn svaret på webdesignproblemet på Google. Det er så mange opplæringsprogrammer og videoer tilgjengelig som kan lede deg gjennom nesten ethvert problem - og løsning.
Nøkkelen er å søke nøyaktig hva du trenger å vite og se til en anerkjent kilde for svaret. Her er et annet tips når det gjelder veiledninger og videoer - nyere innhold vil sannsynligvis gi deg et bedre, mer fullstendig og mer relevant svar. (Husk at noen av disse tingene forandrer seg raskt.)
19. Vær oppmerksom på brukeropplevelsen
Ingenting kan lage eller ødelegge et nettsted som design av brukeropplevelser. Du må planlegge for det og forstå det.
Slik beskriver Interaction Design Foundation UX-design:
Brukererfaringsdesign (UX) er prosessen med å lage produkter som gir meningsfulle og personlig relevante opplevelser. Dette innebærer en nøye design av både produktets brukervennlighet og gleden forbrukerne vil ha ved å bruke det. Det er også opptatt av hele prosessen med å anskaffe og integrere produktet, inkludert aspekter ved merkevarebygging, design, brukervennlighet og funksjon.
UX-designere, eller designere som er klar over prosessen med dannelsesopplevelse, prøver å skape og forme faktorene som påvirker prosessen bevisst. For å gjøre dette vil en UX-designer vurdere hvorfor, hva og hvordan av produktbruk.
20. Vær oppmerksom på designtrender
Hvordan ser et moderne nettsteddesign ut? Det er ikke et triksspørsmål. For å designe moderne nettsteder og brukeropplevelser, må du vite hva brukerne vil ha og hvordan de samhandler med det. Hvis sist gang du lastet ned en app eller så på et nettsted på telefonen din var 2016, har du mye grunn til å gjøre opp.
Å lage nettstedsdesign som har moderne berøringer og trender integrert i designet vil hjelpe prosjektene dine å skille seg ut. Hvordan vet du hva som er trender? Fortsett å lese nettsteder som dette, og vær oppmerksom på hva andre designere gjør. Legg merke til farger og stiler og funksjoner som er inkludert på nettstedene du besøker ofte.
21. Lag uten farge
Start hver design uten farger. En flott designer fortalte meg en gang at hvis designet ditt fungerer i svart og hvitt, vil det være feilfritt i fargen.
Det kan ikke alltid være, men det er et flott utgangspunkt.
Ved å lage design i svart og hvitt, kan du se hvor elementer kontrasterer og hvordan de spiller sammen. Du har fjernet alle emosjonelle assosiasjoner til farge eller øyebevegelse som skjer på grunn av det. Denne enkleste formen for design vil gi deg en ide om noe fungerer som et konsept før du går videre til å fullføre det.
22. Lær å elske Google-skrifter
Google Fonts er din venn.
Uansett hvordan du har det med Google, er muligheten til å bla gjennom, sortere og velge skrifttyper som du vet fungerer i nettsteddesign. Du trenger ikke å tenke på lisensiering eller om skrifttyper er kompatible med spesifikke nettlesere eller ikke.
Begrensningen er at du bare har det som er i Google Fonts-biblioteket å jobbe med. Men hvis du prøver kan du finne noe som vil passe til nesten alle prosjekter. Det vil spare deg for mye tid på lang sikt.
23. Velg et UI-sett
Last ned et brukergrensesnitt eller ikonsett og velg det fra hverandre.
På samme måte som du kan inspisere koden til et nettsted, kan du se på hvordan designelementer er konstruert for nettet. Legg merke til skalaen og rutenettet, se på fargeblandingene og hvordan filer er organisert i Photoshop eller Illustrator.
Se etter et sett for å laste ned som inneholder elementer i flere formater for skjermer med høy oppløsning. (Å laste ned en haug med JPEG-er vil ikke tjene deg så bra.)
Prøv deretter å bygge eller tilpasse et eller flere av dine egne elementer.
24. Bli typograf
Moderne nettstedsdesign har et sterkt fokus på typografi ... god typografi. Fra helteoverskrifter med gigantiske ord til lag med tekst som trekker en bruker inn i designet, er det viktig å forstå prinsippene for hvordan man sammenkobler elementelementer og konstruerer engasjerende tekstblokker.
Start med Ellen Luptons tenking med Type. (Det er også en bok med samme navn.) Lupton er autoriteten på typografi, og hennes informasjon vil få deg til å tenke som en typograf på kort tid.
25. Hopp til JavaScript
Når du begynner å føle deg ganske bra med å dabbe med webdesign, kan du utfordre deg selv igjen for å lære JavaScript. Etter HTML og CSS er det nettets viktigste språk.
JavaScript er et verktøy som lar designere implementere komplekse ting og interaksjon på websider. Det er det som gjør glidebryteren eller den parallaksanimasjonen animert.
Lær JS har en interaktiv veiledning som hjelper deg å komme i gang.
26. Oppdater porteføljen
Når du begynner å designe for nettet, må du sørge for å oppdatere porteføljen din med webdesignprosjekter. Denne enkle handlingen vil hjelpe deg å vise deg selv ... og andre ... at webdesign er en del av repertoaret ditt.
En oppdatert portefølje kan hjelpe potensielle kunder å se hvordan "stilen din" ser ut. Sørg for å vise frem oppsett, farger, typografi og forskjellige teknikker som viser hva du kan gjøre.
27. Utfordre deg selv
Med så mange snarveier og kodebiter som hjelper deg med å fikse nesten hvilket som helst nettstedsproblem du har, blir ikke lat. Husk å kontinuerlig utfordre deg selv for å lære nye ferdigheter, nye teknologier og fortsette å forbedre ditt webdesignspill.
Den ene tingen med dette feltet er at det hele tiden endres; det er alltid noe nytt å lære eller prøve.
28. Maksimer opplevelsen
Kom deg dit og design. Du må begynne å designe nettsteder for å være webdesigner.
Begynn i det små, men ta på prosjekter med andre. Be om å være med på et prosjekt med et team på jobb. Takle et lite nettsted for en venn. Jo mer erfaring du har med å bygge nettsteder, jo bedre og raskere vil du få.
Hva venter du på? Slutt å utsette.
29. Be om tilbakemelding
Bruk nettverket ditt til å samle tilbakemeldinger på designprosjekter på nettstedet ditt, uansett hvor små du tror de er. Lytt til denne tilbakemeldingen - selv om du ikke liker den og se hva du kan lære.
Bortsett fra visuell preferanse, ga personen som ga tilbakemelding forslag om hvordan nettstedet skal fungere bedre? Kunne de lett forstå målet med designen? Forbindte de seg med meldingene?
30. Fortsett å lære nye ting
For å være en flott nettsteddesigner, trenger du bare fortsette å spille, prøve og lære nye ting. Gjør et poeng til nettverk og kommuniser med andre i feltet slik at du kan følge med på teknikker og visuelle endringer som etterspørres.
Hvis du ønsker å lære nettsteddesign, er dette sannsynligvis allerede noe du regelmessig gjør. Men dette er et felt i utvikling, og det endrer seg nesten hver dag. Bare spør alle som gjør det.
