A Web mal er en grunnleggende webside layout --- eller container --- du kan bruke til å lage flere sider . Malen gir grunnleggende struktur for nettstedet ditt, slik at du kan opprettholde et gjennomgående tema og layout i hele området uten å gjenskape hver side. Mens Photoshop er ikke teknisk sett en webside design program , kan du bruke den til å lage web- maler med " kutting" PSD bilde inn i ulike seksjoner og deretter eksportere PSD til HTML webside. Deretter kan du åpne HTML malen filen i Dreamweaver eller et annet Web design program og bruke den til å lage sidene for ditt nettsted. Du trenger
Adobe Photoshop CS3 eller nyere
Vis flere instruksjoner
en
Start et nytt dokument i Photoshop. Gi det de dimensjonene du vil bruke for websidene , som dette: Klikk på "File " på menylinjen og velg "New " for å åpne dialogboksen Ny . Skriv inn bredden ( i piksler ) i " Bredde" feltet og høyde ( i piksler ) i " Høyde "-feltet . Klikk "OK".
2
Opprett banner for din webside. Banneret, selvfølgelig, er den grafiske eller bilde som vises på tvers av toppen av siden. Den består vanligvis av en firmalogo og noen andre grafikk knyttet til et produkt eller en tjeneste . Du kan enten sette inn et eksisterende bilde eller bruke Photoshop maling og tekst for å lage banner.
3
Lag knapper for din webside. Disse vil bli linker , eller " hot spots ", som tar nettstedet brukerne til forskjellige sider på nettstedet. Enten sette eksisterende knapp bilder og plassere dem hvor du vil ha dem i malen eller bruke Photoshop maling og tekst for å skape knappene .
4
Velg " Slice Tool" ( femte knappen fra toppen i verktøykassa ) . Hvis du ikke har brukt Slice Tool før , er denne knappen trolig satt til et annet verktøy . Klikk og hold knappen , og velg deretter " Slice Tool" fra fly-out .
5
Dra Slice Tool rundt den første knappen eller område i malen der du vil opprette en kobling. Dette skaper en " Slice " boksen rundt objektet . Photoshop plasserer denne boksen inn i en tabellcelle som vil bli en egen HTML-tabell når du eksporterer dette dokumentet til HTML.
6
Høyreklikk ny skive og velg " Rediger Slice Options" fra fly- ut menyen . Dette åpner Slice dialogboksen Alternativer .
7
Skriv inn nettadressen du vil at denne knappen for å åpne i "URL "-feltet . Du kan også legge inn annen informasjon for knapp, for eksempel målet nettleser siden , og alternative koder . Hvis du ønsker å redigere størrelsen og plasseringen av stykket , så med alternativene i " Mål " i dialogboksen. Klikk "OK".
8
Gjenta de forrige trinnene for å lage skiver og redigering slice alternativer for hver knapp i malen.
9
Klikk på " File" på menyen bar og velg "Lagre for Web og enheter . " Dette åpner Save for Web & Devices dialogboksen . Herfra kan du endre flere aspekter av malen , for eksempel bakgrunnsfarge, bilde komprimering og kvalitet , dokumentere størrelse og så videre . Disse alternativene er godt merket og taler for seg selv . ( Du kan forhåndsvise HTML-koden for denne malen ved å klikke på "Preview "-knappen . )
10
Klikk på " Lagre"-knappen . Navngi og lagre HTML -filen. Du har nå opprettet din Web mal . Nå kan du åpne den i en webside redaktør og legge til innhold .