Hvordan lage en webside ved hjelp av GIMP

Hvordan lage en webside ved hjelp av GIMP


Å gjøre en nettside fra en mal du oppretter i GIMP (GNU Image Manipulation Program) gjør at du kan starte din nettside raskt med mindre tid og krefter. GIMP vil også tillate deg å manipulere lag og gjøre andre effekter utover omfanget av nybegynnere. Kunnskap om GIMP og hvordan du kan sette den inn i HTML-koden vil være nyttig.

Bruksanvisning

1 Åpne GIMP ved å klikke på ikonet når du har lastet ned og installert programmet fra nettsiden (se Ressurser). Velg "Fil" og "Ny" før du klikker på "Mal" drop down menyen. Velg fra mal boksen og fra rullegardinmenyen som vises, klikker du på "800x600" pixel alternativet. Andre alternativer er tilgjengelig for deg å prøve i fremtiden, men dette er bra for generell bruk i en praksis webdesign økt. Klikk på "OK".

2 Trykk "Ctrl" og "b" samtidig på tastaturet hvis et vindu merket "Toolbox" i toppmargen ikke dukker opp. To femtedeler av veien ned vinduet er to ruter som overlapper hverandre. Den ene i front er forgrunnsfargen, den andre er bakgrunnsfargen. Klikk på hver boks separat og velge farge fra "Change Color" vinduet som kommer opp. I Endre farge Window, klikk med musen på den store plassen som har fargene falming fra en til en annen. Hue, metning, røde, grønne og blå nivåene kan justeres med glide barer på høyre når du har ditt valg. Klikk "OK" for å holde valget og lukke dette vinduet. Endre den andre (bakgrunn) farge ved å klikke i boksen bak den du klikket tidligere på verktøykassa, to femtedeler av veien ned.

3 Klikk på ikonet "Blend Tool" på verktøykassen. Hvis du er usikker som ikon dette er, sveve over ikonene med musen for å finne den riktige ikonet. Det skal se ut som en boks som har grå fade til hvitt. Den ikke-verktøykasse vinduet vi vil referere til som "lerret", selv om det sannsynligvis står "Untitled" og "800x600" et sted i sin toppmargen. Klikk på lerretet øverst i venstre hjørne og dra musen til nederst til høyre på skjermen for å fylle den med den valgte fargen i en gradient. Hvis ingen gradient er ønsket, velger du bare "fyll Tool" og klikk på lerret å fylle med en solid farge.

4 Klikk Fil på toppen av lerretet og fra rullegardinmenyen, velg Ny. Når "Opprett et nytt bilde" -vinduet kommer opp, endre verdiene for "Bredde" og "Høyde" slik at de blir redusert med 20 piksler hver til 780 piksler bred og 580 piksler høy. Velg "Edit" og deretter "Kopier" fra rullegardinmenyen. Bytt til det første lerretet og velg "Edit" og deretter "Lim inn" for å lime inn mindre bilde på originalen. Det vil automatisk sentrum når limt inn. Gå tilbake til den nye (blank) lerret og lukke den. Klikk på "File" og fra rullegardinmenyen, velg "Lagre som". Utgjør et navn for arbeidet ditt og lagre det.

5 Nettsiden er gjort med mindre du ønsker å dele bildet for å bruke det i HTML (se neste avsnitt).

6 Lag toppen (header) av websiden. Klikk på "rektangel Select Tool" i verktøykassen. Klikk på lerretet i den ekstreme øvre venstre hjørne og dra for å velge de 20 beste piksler i høyden og hele bredden (800 piksler). Du kan fortelle hvor mange piksler du har valgt i rektangelet ved å se på bunnen av lerretet vinduet for å se dimensjonene (i piksler) ved siden av ordet "rektangel". Velg "Image" og fra rullegardinmenyen, velg "Beskjær til markering». Velg "Lagre som" og gjøre opp navnet "top.jpeg" som gjenspeiler at filen er toppen av nettsiden din. Lukke siden.

7 Lag midten av websiden. Åpne filen i GIMP som du heter og lagret i trinn fire. Velg "rektangel Select Tool" igjen og velg et område i den midtre delen av lerretet som spenner over hele bredden, men er bare en piksel høy. Beskjær til dette valget, og lagre filen under navnet "middle.jpeg" som gjenspeiler at filen er mønsteret for kroppen av websiden.

8 Lag bunnen av nettsiden på samme måte som du gjorde øverst på nettsiden ved å velge en 20 pixel høy boks som dekker bredden av skjermen helt nederst på siden. Lagre denne filen som "bottom.jpeg."

9 Gjør nettsiden samme bredde som bildet i GIMP (en bredde på 800 piksler). Skriv inn & lt; body bakgrunn = "middle.jpeg" & gt; i HTML når du åpner & lt; innhold & gt; delen av siden.

10 På toppen, rett etter at du åpner kroppen koden, legge til & lt; img src = "top.jpeg" width = "600" height = "800" & gt; til HTML-koden. Gjør det samme lavere i koden, like før du legger & lt; / body & gt; med den samme koden som tastes inn på toppen av siden, bortsett fra at den leser & lt; img src = "bottom.jpeg" width = "600" height = "800" & gt; i koden.

11 Skriv resten av koden som du normalt ville gjort i HTML for tekst og grafikk.

Hint

  • Pass på at alle filene (top.jpeg, middle.jpeg, og bottom.jpeg) er alle lagret på nettstedet mappen eller de vil dukke opp som feil når du starter. Lagrer filene som JPEG-filer er bedre enn å lagre dem som GIF-filer hvis de har mer enn 255 farger. Legg uklarhet og skygge eller andre effekter som du får mer trygg på å legge til dybde til bildene på websidene dine.
  • Sørg for at koden fungerer før du prøver å bruke det på noen måte ved å teste den i en nettleser. Prøv flere nettlesere og operativsystemer for å sørge for at koden fungerer på de fleste datamaskiner.