Webdesign ve Photoshopu – jaké zvolit rozměry a další otázky

Dobrý den,byl by někdo tak hodný a poradil mi, jak to chodí s designováním webů ve Photoshopu? Zajímalo by mě, jaké rozměry zvolit a jak webdesign připravit pro programátora,děkuji, budu moc vděčný za každou radu nebo tip,hezký den.

Responsive Demo - LTR | Unsemantica pre .psd šablonu hoď do google "photoshop 1180 grid"

doporučuji raději illustrator, jakmile bude po tobě chtít něco posunout, zúžit, udělat responzivní, umřeš u pracnosti a budeš tím trávit hodně času. Raději photoshop na jednotlivé grafické fragmenty a ty přes smart objecty vkládat do illustratoru.Nejprve se podívej jaké jsou možnosti webové grafiky, obecně je nutné dodržet vertikální linii, na webu se vše tvoří přes obdelníky. Vyhni se horizontálnímu pozicování, nikdy nevíš jak vysoký bude obsah, každé zařízení má trochu jiné fonty. Šikmé hrany a průhlednosti jsou špatně, css má omezené možnosti a pokud něco podobného chceš, udělej to jen podle možností css.Udějel si paletu barev a ty dodržuj, ne že všude použiješ něco jiného podle oka. Paletu barev předej poté kodérovi, má to být součást dokumentace ke grafice.Od grafika by ke kodérovi měl přijít přehledně vrstvený dokument, vrstvy jasně pojmenované. Ty s ukázkovými texty a zkušebním obsahem udělej zvlášť, aby se daly vypnout. Stejně tak průhlednosti a kulaté rohy, je lepší je mít ve vlastní vrstvě, kodér to totiž musí přepisovat do css.

V illustratoru dělám max. loga a nějaké ikony, jinak všechno valím přes Photoshop...

Pokud je to trochu normálně dělané, tak se spracováním PSDčka nemám problém, povypínám si co zrovna z toho potřebuji dostat.

Já používám většinou 1170 px pro desktop, 750 px tablet a 320 px mobil. Nespoléhej se ale na konkrétní rozměry a při návrhu počítej s tím, že design bude responzivní. Za sebe bych illustrátor pro webdesign nedoporučoval. V photoshopu většinou není žádný problém upravit rozměry prvků, něco posunout atd. Pro většinu věcí u kterých je to možné doporučuji používat vektorové tvary. Těm pak můžeš bez problémů měnit velikost, barvu, upravovat zakulacení rohů atd. Fotky doporučuji po vložení do photoshopu převádět na inteligentní objekty. Díky tomu se ti bude při změně velikosti obrázku vždy načítat originální fotka. Jen před odesláním programátorovi je vhodné je rastrovat, protože jinak budou mít psdčka zbytečně velkou velikost. Vrstvy je potřeba důkladně a přehledně třídit do složek a pojmenovávat. Není nic horšího než mít vše neroztříděné a ještě k tomu nepojmenované. Bude se ti s tím špatně pracovat a programátor z toho nebude nadšený. Jakmile se ti někdy dostane do ruky takové psdčko a ty s ním budeš muset pracovat, pochopíš. Je potřeba si uvědomit, že s psdčkem může do budoucna pracovat i někdo jiný a je to i tvoje vizitka. Velmi užitečné je používat knihovny v photoshopu a do nich si ukládat styly, barvy a případně části webů. Je vhodné se držet při návrhu pár odstínů barev a stylu písma a díky knihovnám je nebudeš muset při práci zpětně v psdčku dohledávat. V návrzích nezapomínej ani na hovery a další interakce. Není prací programátora si toto dodělávat. Je dobré, hlavně u větších projektů, vytvořit zvláštní psdčko, kde budou definované styly písma, tlačítka a jejich hovery, formulářové prvky jako inputy, checkboxy, selecty atd.