Hvordan lage en hjemmeside i Photoshop CS3

Selv om det involverer flere trinn og en grunnleggende kjennskap til Photoshop verktøy, lage en hjemmeside i Photoshop kan gjøres, forutsatt at du har noen kjennskap til grensesnitt design. Photoshop er nyttig for å lage grafikk-tunge websider, som vanligvis brukes på en hjemmeside, eller det som kalles et bildekart. Et bildekart er et sett med bilder som kan settes til å lage koblinger som fungerer som knapper. Fordelen med å bruke et bildekart designet i Photoshop er at hjemmesiden din vil se mye mer attraktiv som en grafisk stedet for en haug med standard formatert tekst.

Bruksanvisning

Lag din hjemmeside i Photoshop

1 Åpne Photoshop. Klikk "Fil"> "New" for å opprette en ny fil. For størrelsen, velg "Web forhåndsinnstilling" og velg 640 x 480 eller mer.

2 Velg din design farger og tema. Fyll bakgrunnslaget med fargevalg ved hjelp av Photoshops designverktøy. Velg farger ved hjelp av fargevelgeren verktøyet, og fyll inn din bakgrunn ved å gå til menyen: Klikk på "Edit"> "Fyll"> "forgrunn / bakgrunnsfarge."

3 Legg til tekst og skrift valg i form av knapper ved hjelp av fargetema. Velg tekstverktøyet, som er tilgjengelig på verktøylinjen, eller velg type vindu ( "Window"> "tegn") for å vise alternativene. Bruk tekstverktøyet for å skape en grunnleggende oppsett for hvor du vil at knappene, linker og annen tekst skal innlemmes i design. For ekstra bildedybde og estetisk forbedring, legge til tekst effekter som skygger for ditt lag stil. Tilgang typeeffekter ved å gå til menyen: ". Drop Shadow" "Layer"> "Layer Styles">

4 Innlemme dine bilder og logo til hjemmesiden din design. Fargelegg bildene som passer din design, og justere blandingsmodi, lag åpenhet og bildeplassering til du er fornøyd med grensesnittet til hjemmesiden din design. Juster fargene ved å gå til menyen: ". Fargebalanse" "Image"> "Juster"> Du kan justere gjennomsiktigheten i bildene dine ved å gå inn Opacity funksjonen, som finnes i den øverste delen av lagpaletten. Blend Mode-menyen er også tilgjengelig i lagpaletten.

5 Gjør eventuelle ytterligere justeringer i utformingen av hjemmesiden din ved hjelp av Photoshops designverktøy.

6 Klikk på "File"> "Lagre som" og lagre bildet som en PSD-fil.

Lag din hjemmesidedesign Funksjonell som en webside

7 Skjær bildet for å bryte den visuelle design i deler av et bildekart ved å velge Slice verktøy, som finnes i verktøykassen. Del ditt bilde i et rutenett med bokser, plassere skiver (i form av kvadrater eller rektangler) over knapper, grafikk og andre deler av design.

8 Velg Slice markeringsverktøyet for flere alternativer, som ligger under verktøymenyen Slice. En undermeny vises på toppen av skjermen med ulike alternativer for å justere bilde slicing.

9 Link bildene dine til andre sider. Velg Slice markeringsverktøyet. Klikk på det lille ikonet helt til høyre som ligner en tekstboks dokumentet for å åpne et vindu som lar deg justere lenker og URLer (Internett adresser) for hver skive. Dette vil tillate deg å lage linker (knapper som fører til andre nettsider) fra bildet.

10 Begynn å eksportere bilde skiver og bilde kobling innstillinger. Klikk på "File"> "Lagre for Web og enheter" for å åpne vinduet for Eksport. Dobbeltsjekk innstillingene dine ved å klikke på undermenyen pilen på "Edit Output Settings", og justere etter behov.

11 Juster innstillingene mens de fortsatt i dialogboksen Lagre. Velg mappen der du vil at bildet kartfiler å gå. Bla ned til "Format" og velg "HTML og bilder." Klikk "Lagre" for å lagre kartet bildet. Dette vil eksportere HTML-fil (brukes for å vise bilde kart på nettet) til hovedkatalogen mappen, samt automatisk opprette en egen mappe for bildene dine hvor de forskjellige grafikk (bestemt av din del innstillinger) vil gå.

12 For å teste din webside, åpne nettleseren din, åpne den nye mappen, og klikk HTML-filen.

Hint

  • Du kan redigere HTML-filen manuelt om nødvendig.