Grunnleggende verktøy for webdesign

Du trenger ikke mye programvare for å komme i gang som webutvikler

InnholdsfortegnelseUtvide

• Tekst/HTML Editor
• Nettlesere
• Grafikk redaktør
• FTP-klient

Bortsett fra en datamaskin og en internettforbindelse, er de fleste verktøyene du trenger for å bygge et nettsted programvare , som kanskje allerede er på datamaskinen din. Du trenger et tekst- eller HTML-redigeringsprogram, et grafikkredigeringsprogram, nettlesere og en FTP-klient for å laste opp filer til nettserveren din.

Velge en grunnleggende tekst- eller HTML-editor

Du kan skrive HTML i en ren tekstredigerer som f.eks Notisblokk i Windows 10, Tekstredigering og Sublime Text på en Mac, eller Vi eller Emacs i Linux. Du lager HTML-kodingen for siden, lagrer dokumentet som en nettfil og åpner det i en nettleser for å være sikker på at det ser ut som det skal.

Hvis du vil ha mer funksjonalitet enn en ren tekstredigerer tilbyr, bruk en HTML-editor i stedet. HTML-redigerere gjenkjenner kode og er i stand til å identifisere kodefeil før du starter filen. De kan også legge til avsluttende tagger du glemmer og markere ødelagte lenker . De gjenkjenner og tilpasser andre kodespråk som CSS, PHP og JavaScript.

De mange HTML-editorene på markedet varierer fra grunnleggende til profesjonelle nivåer. Hvis du er ny på å skrive nettsider, en av de WYSIWYG (What You See Is What You Get) redaktører kan fungere best for deg. Noen redaktører viser bare koden, men noen lar deg veksle mellom kodevisninger og visuelle visninger. Her er noen av de mange HTML-nettredaktørene som er tilgjengelige:

Komodo IDÉog dets brukervennlige grensesnitt passer for både nybegynnere og avanserte webutviklere. Komodo IDEs autofullføringsfunksjon er spesielt nyttig når du skriver kode for vanlige elementer som lenker. Programvaren støtter fargekoding av forskjellige kodespråk som HTML, CSS og mange andre. Komodo IDE kjører på Windows, Mac og Linux .

Lifewire

CoffeeCup HTML Editorer spesielt nyttig for nye utviklere som er mer interessert i å lære å kode enn i et visuelt grensesnitt. Denne robuste editoren kommer med maler og har valideringskontrollere for å holde koden fri for feil. Den inkluderer kodefullføring og støtter andre kodespråk du kan bruke sammen med HTML. Programvaren fremhever feil, forklarer hvorfor de dukket opp, og forteller deg hvordan du kan fikse dem. CoffeeCup HTML Editor kjører på Windows.

Lifewire

Mobiriseer en HTML-editor for folk som ikke ønsker å bli involvert i kode. Det handler om å velge en tema og deretter dra og slippe elementer på siden. Legg til tekst akkurat som du ville gjort i et vanlig tekstredigeringsprogram, og sett inn bilder, videoer eller ikoner – alt uten å skrive noen kode; Mobirise gjør den delen for deg. Mobirise er tilgjengelig for Windows og Mac, og det er gratis.

Lifewire

Nettlesere

Nettsteder kan se forskjellige ut fra nettleser til nettleser, så det er avgjørende å teste nettsidene dine for å sikre at de ser ut og fungerer etter hensikten. Chrome, Firefox, Safari (Mac), Opera , og Edge (Windows) er de mest populære nettleserne.

Du må teste sidene dine for utseende og funksjon i mobilnettlesere også. De fleste stasjonære nettlesere tilbyr muligheten til å vise nettsteder i vinduer med forskjellige størrelser. For eksempel er et vell av testverktøy tilgjengelig i Google Chrome på Utsikt > Utvikler > Utviklerverktøy . Velg smarttelefonikonet øverst til venstre i utviklervinduet for å se hvilken som helst side i forskjellig størrelse vinduer og mobile operativsystemer.

Lifewire

Grafikk redaktør

Hvilken type grafikkredigerer du trenger avhenger av nettstedet ditt. Adobe Photoshop er gullstandarden, men du trenger kanskje ikke så mye kraft – i tillegg trenger du kanskje et vektorgrafikkprogram for logo- og illustrasjonsarbeid. Noen få grafikkredigerere å se på for grunnleggende webutvikling inkluderer:

GIMPer et gratis, åpen kildekode-fotoredigeringsprogram som gir mange av funksjonene til sine dyrere konkurrenter. Som åpen kildekode programvare , den er tilgjengelig for Windows, Mac og Linux.

Lifewire

Photoshop Elementsfor Mac og PC er en lett versjon av navnebroren, men har mange funksjoner.Corel PaintShop Profor PC-er har nesten alle verktøyene du finner i Photoshop i et brukervennlig grensesnitt.Inkscapefor Windows, Mac og Linux er et gratis redigeringsprogram for vektorgrafikk. Dette alternativet til den dyrere Adobe Illustrator har mer enn nok muligheter for enkelt designarbeid og webgrafikk.

FTP-klient

Du trenger en FTP-klient (filoverføringsprotokoll) for å overføre HTML-filene og støttende bilder og grafikk til webserveren din. FTP er tilgjengelig via kommandolinjen i Windows, Macintosh og Linux, men en dedikert FTP-klient er mye enklere å bruke. Toppen FTP-klienter inkludere:

FileZilla(gratis) er tilgjengelig for Windows, Mac og Linux. Den støtter dra-og-slipp filoverføringer og har en pause og gjenoppta-funksjon for opplasting av store filer.

Lifewire / Richard Saville

Cyberducker gratis, åpen kildekode, tverrplattformprogramvare kjent for sin sømløse integrasjon med eksterne redaktører og det attraktive brukergrensesnittet.Gratis FTPog Direkte FTP er laget av samme firma. Gratis FTP er en minimalistisk klient som oppfyller grunnleggende filoverføringsbehov. Direct FTP er en premiumversjon som tilbyr avanserte funksjoner. Begge versjonene støttes av Windows 7, 8 og Vista, men bare Direct FTP er egnet for Windows 10.

Lifewire

Overføreer en førsteklasses FTP-klient kun for Mac. Den letter uvanlig raske overføringer og støtter Amazon CloudFront.Søt FTPer en kraftig premium FTP-klient du kan bruke til å gjøre opptil 100 overføringer samtidig. Det anses å være en av de sikreste FTP-klientene som finnes.