Opbygning af en hjemmeside layout er en udfordrende opgave , der tager grafik designere år at mestre . For både den erfarne og uerfarne , giver Adobes Photoshop en række værktøjer , som støtte i processen med at skabe en hjemmeside layout. Inden du begynder, bør du have en god idé om, hvordan du vil have din hjemmeside til at se ud. Skitse et par prøver på papir , før du begynder , så du allerede har et solidt udgangspunkt . Begyndende med et logo allerede designet vil også fremskynde dit layout skabelse. Instruktioner
1

Opret en ny fil i Photoshop ved at klikke på menuen "Filer" og vælge " Ny". Størrelsen af ​​dit billede vil bestemme det færdige størrelsen af din hjemmeside , så vælg en bredde, der er passende for de fleste skærme . En bredde på 750 pixels vil sikre, at din hjemmeside kan ses af alle med en skærmopløsning lig med eller større end 800 -by- 600 . Indtast en værdi for højde på ca 500 pixels. Dette kan justeres senere . Tryk på " OK".
2

Design din hjemmeside header , som er det område , der vises på toppen af din webside. Dette område bør begrænses til højst 200 pixels i højden. Medtag din hjemmeside navn og logo på dette område , samt nogle grafik eller fotografier, der fremhæver formålet med dit website . For eksempel kan en nonprofit virksomheds hjemmeside layout omfatter fotografier af personer, som de har hjulpet .
3

Opret en navigationslinje under din overskrift, der er omkring 50 pixels højt . Vælg " Text Type" værktøj fra værktøjslinjen til venstre , og klik på dit billede at skrive. Indtast navnene på de forskellige vigtigste sider på dit websted (f.eks "Home ", " About Us ", "Kontakt ", " Produkter ", etc.) .
4

Lav en kasse under din navigationslinjen for at repræsentere det område, teksten på din hjemmeside vil gå . Du kan lade dette område blank for nu, men du skal have det område reserveret , så du ikke tilføjer designs til det. Området kan være så bred som din header og navigationslinjen eller være smallere for at imødekomme sidebars på venstre , højre eller begge dele.
5

Design sidebars hvis du forlod plads til dem . Disse sidebars vil starte under din header og vil gå ned i hele længden af ​​siden, indtil din footer . Dit sidebar kan enten indeholde grafik eller fotografier , eller kan være et andet område til tekst. Hvis du reservere områder for tekst , kan du lade dem stå tomme . Ellers begynder at designe grafik, der vises i din sidebars .
6

Opret en sidefod nederst i billedet. Sidefoden skal være så bred som header , men kan være så høje eller kort , som du ønsker. Du behøver ikke at bekymre dig om at forlade tilstrækkelig plads mellem din header og footer til teksten som din design automatisk vil vokse og skrumpe til at rumme mere eller mindre tekst. Medtag oplysninger om ophavsret i dit footer samt eventuelle juridiske ansvarsfraskrivelser , du ønsker at tilføje.
7

Fortsæt med at arbejde på alle de aspekter af hjemmesiden layout , indtil du er tilfreds med sit udseende . Gem filen ved at klikke på menuen "Filer" og vælge "Gem". Gem billedet i Adobe Photoshop-format (*. PSD) , så du senere kan vende tilbage til det og gøre yderligere redigeringer uden tab i kvalitet.
8

Vælg " Slice " værktøj fra værktøjslinjen venstre , og træk markeringer omkring de forskellige områder af dit billede . Hvis du kun skal bruge en header , tekst -området og footer , gør tre valg omkring disse tre områder. Hvis du har inkluderet sidebars , skabe yderligere skiver omkring disse områder . Trækning af en valgboks omkring et område med skive valgte værktøj er alt hvad der behøves for at skabe en skive .
9

Klik på "Filer" og vælg "Gem til web ". Photoshop vil anmode filnavne for hver af skiverne , du har oprettet , og vil generere et særskilt billede for hver af skiverne . Skiverne kan så tilsluttes igen til din hjemmeside layout ved hjælp af en hjemmeside design program som FrontPage eller Dreamweaver, eller i hånden ved hjælp HTML-kode.