-
- hur man skär & grafik karta för webbdesign
- Postad av:P-O Lennartsson
- Web design är ett bra sätt att utöka din profil och öka dina inkomster som grafisk designer. Men om du är en grafisk formgivare bryta sig in Webbdesign, måste du klippa och grafik kartan för att passa webben layouter. Medan designa för webben liknar print och andra digitala design, finns det några särskilda aspekter att hålla i minnet se till att din webbplats layout är klar för utveckling
Du behöver:. .
Computer
Photoshop.
1.
Skapa en ny duk i Photoshop genom att klicka på "File" och "Ny. "Skriv en rubrik för mallen, en bredd på 1200 pixlar, en höjd av 600 pixlar och en upplösning på 180 dpi. Läget bör vara "RGB" och innehållet kan markeras som "vit. " Klicka på "OK".
2.
Skapa guider på duk att ge riktlinjer för layouten. Klicka på "Visa" i övre menyraden, följt av "Ny guide. " Kontrollera "Vertikal" är ikryssad och skriv "120px" i "Position" rutan. Upprepa detta steg, utom typ "1080px" i "Position" rutan.
3.
Du bör ha två guider på duken. Guiderna skapa en 960-pixel fält, som är en populär bredd för webbdesign. Allt utanför dessa guider bör övervägas bakgrundsbilder bara. Skapa din design.
4.
Skapa stödlinjer runt huvuddelar, såsom rubrik, navigation och sidfot genom att hålla ner vänster musknapp på linjalen och dra. Placera guider runt varje bild för sig, runt varje bild med en låda.
Om du inte ser de styrande, se "Härskarna" är markerad under "Visa".
5.
Platta din bild genom att gå till "Layer" och "Flatten Image. " omfattar inte aspekter av design som kommer att skapas med HTML eller CSS, t. ex. menyval eller brödtext. Men om du vill att dessa poster skall grafik i JPG-format, ta med dem i den platta bilden.
6.
Välj beskärningsverktyget. Beskär varje enskilt avsnitt genom att hålla ner vänster musknapp och dra rutan för att passa till de riktlinjer du har skapat. Till exempel, om du har skapat en rubrik, gröda allt utanför huvudet med hjälp av beskärningsverktyget.
7.
Klicka på "File" och "Spara för webben. " Välj JPG-format och klicka på "Spara".
Du kan justera kvaliteten på handledningen innan du sparar för att minska storleken på bilden, vilket ytterligare minskar webbplatsens laddningstid .
8.
Klicka på "Redigera" och "steg tillbaka" för att gå tillbaka till din ursprungliga, bilden i full storlek. Upprepa steg 6 och 7 för varje enskild bild.
9.
Du har nu din hemsida grafik redo för kodning. Förse Webbutvecklare med den platta original JPG, tillsammans med alla dina webbklara grafik. Den ursprungliga tillplattad bilden gör det möjligt för webbutvecklare att se den övergripande designen, men reducerar tiden att klippa bilder och kartlägga mönstret.
Tips och varningar
- Namn varje grafiskt enligt dess användning i konstruktionen. Till exempel kan navigeringsobjekt kallas "nav1. jpg", "nav2. jpg "och" nav3. jpg. "Sidfoten grafiska kunde kallas" footer. jpg. "Detta kommer att hjälpa utvecklaren enkelt hitta det grafik som behövs för kodning.
- Tillsammans med varje skär grafik, ger dimensioner. Det kommer att hjälpa utvecklaren i kodningen processen. Till exempel kan du skriva "footer. jpg=960px av 120px. " Gör inte inkludera det i filnamnet, helt enkelt ange den i ett e-postmeddelande eller ett dokument
.
Relaterade artiklar
ominstallation grafikkort
hur airbrush grafik
hur man installerar inf grafikkortets drivrutiner
hur du aktiverar ett grafikkort
Hur man testar en video grafikkort
hur du uppdaterar en VGA kompatibel grafikkort
hur du utformar din egen grafik race bil
hur man skär & grafik karta för webbdesign