Er zijn vele manieren om een website te maken met web applicaties zoals Deamweaver of Frontpage , of zelfs met de hand gecodeerd HTML . Echter , als u wilt dat uw website te zijn grafisch aantrekkelijk , componeren de lay-out in Photoshop . zal het veel gemakkelijker zijn om later te bewerken op ook . U moet een logo , header , iconen , knoppen , afbeeldingen /foto's , advertenties ( indien nodig) , kleuren , lettertypen en structuur te ontwerpen . Maak een mock - up van tevoren , voordat de uitvoering van HTML . Als u al ideeën voor uw site samenstelling hebben , schetsen het op een stuk papier . Instructies
Ontwerp grafische websites met Photoshop
1 Ga naar Bestand > Nieuw . Input breedte : 800 pixels , hoogte : 600 pixels . Stel de resolutie in op 72 pixels /inch , RGB kleuren 8bit . Stel de inhoud achtergrond transparant . Klik op OK . Kopen van 2 Maak de header en navigatie- ontwerp . Onder andere een logo , banner advertentie ruimte , sommige graphics en navigatieknoppen . Maak de header hoogte 150 pixels en 30 pixels voor knoppen . Plaats het logo en de banner graphics in het resterende gebied . Voeg tijdelijke aanduidingen voor tekst .
3 Selecteer afbeelding van een logo van I Stock . Ga naar het comping link die een watermerk op de afbeelding heeft . Klik met de rechtermuisknop op de afbeelding en de afbeelding kopiëren selecteren . Selecteer het Photoshop -venster en het bestand waaraan u werkt . Plak de afbeelding op de nieuwe laag . Ga naar Bewerken > Transformeren> Schalen . Houd de Shift -toets om het aandeel te handhaven , en het formaat van de afbeelding . Selecteer een gedeelte dat u wilt met het rechthoekig selectiekader werkt , persbesturing ( commando in Mac ) + shift en i toetsen om de selectie omkeren . Druk control ( commando in Mac ) + d om te deselecteren . Dan druk op de sleutel te verwijderen om de rest van het beeld te verwijderen .
4 Maak knoppen voor web navigatie . Selecteer het gereedschap Type in Photoshop . Sleep het tekstvak op het scherm en typ een naam voor de toets , zoals Home of Contact .
Ontwerp 5 de lay-out van de inhoud in het lichaam gebied . Als uw website heeft veel links , gebruik maken van de linker kolom voor extra links . Selecteer het gereedschap . Klik en sleep het tekstvak op het doek . Plaats de body tekst in de belangrijkste content gebied van het doek . Voeg wat dummy tekst van Loren Ipsum als een plaats houder . U vindt deze tekst te vervangen op een later tijdstip wanneer u klaar bent om uw web content te schrijven zijn .
6 Voeg footer inhoud hieronder de belangrijkste inhoud . Deze zullen onder meer het logo van uw bedrijf , copyright tekst en een duplicaat van de links in de header .
Place laatste nieuws 7 , aankondigingen , persbericht samenvatting en promoties of advertenties aan de rechterkant van uw website lay-out.
8 Maak een vouwlijn op 600 pixels in de hoogte .
9 Optimaliseer afbeeldingen die u wilt publiceren op uw website . Snijd de foto's met het gereedschap Segment .
10 Klik in het menu Bestand . Klik op Opslaan voor web . Schuif de kwaliteit schuifbalk om de beeldkwaliteit en de bestandsgrootte instellen . Klik op Opslaan .
Dubbelklik 11 op het HTML-bestand ( Photoshop creëert de map afbeeldingen en HTML-bestand in dezelfde directory . ) Controleer uw webpagina lay-out in uw internet browser . U dient een ingevuld webpagina in Photoshop hebt op je scherm .
|
