Koji su najbolji savjeti za pretvorbu HTML u PSD?

Mnogi dizajneri web-mjesta koristili su Adobe® Photoshop® za stvaranje brzih mockup-ova web-mjesta prije nego što su dizajn poslali u datoteku jezika za označavanje hiperteksta (HTML), a postoji mnogo programa koji mogu pretvoriti Photoshop® dokument (PSD) u HTML dokument, ali postoji vrlo malo uslužnih programa koji pretvaraju HTML u PSD. Jedan važan savjet prilikom pretvorbe je osigurati da svaki dinamički sadržaj – kao što su programi, animacije ili multimedijski sadržaj – ima statički prikaz ili je pretvoren u sliku rezerviranog mjesta kako bi se ispravno pretvorio. Postoje neki trikovi koji se mogu koristiti za pretvaranje HTML-a u PSD, kao što je korištenje funkcije ispisa u datoteku u većini web preglednika za stvaranje datoteke prijenosnog formata dokumenta (PDF) koja se zatim može otvoriti u Photoshopu®. Bez obzira na to koja se metoda koristi za pretvaranje HTML-a u PSD, rezultirajuća stranica će u konačnici zahtijevati uređivanje, kao što je izoliranje i premještanje elemenata stranice u različite slojeve ili izoštravanje teksta na stranici kako bi se uklonili aliasi koji se prirodno pojavljuju tijekom pretvorbe, da bude prihvatljivo.

Photoshop® PSD dokumenti urođeno sadrže rasterizirane slike, pa se uglavnom pohranjuju kao zbirka piksela. HTML je jezik dizajniran za pružanje uputa za formatiranje i raspored koje su bliže vektorskoj grafiki poput onih koje koristi Adobe® Illustrator®. Pretvaranje HTML-a u PSD uključuje pronalaženje načina za pretvaranje piksela koji su prikazani u web-pregledniku u format slikovne datoteke koji Photoshop® može čitati.

Postoje dva jednostavna načina za učinkovito pretvaranje HTML-a u PSD. Prvi je korištenje programa za snimanje zaslona, ​​hvatanje svakog vidljivog segmenta web stranice, a zatim njihovo spajanje u Photoshop®. Ovo ima prednost u preciznom bilježenju onoga što se vidi na zaslonu, tako da animacije i drugi dinamički sadržaj ne moraju biti uklonjeni, ali ima nedostatak što je prilično neuredan proces. Osim toga, zaslonske snimke web stranice imat će postavljenu razlučivost piksela, a slika se može drugačije pojaviti na različitim monitorima jer nema korekcije boje.

Drugi način pretvaranja HTML-a u PSD je korištenje ugrađene naredbe za ispis koju implementira većina web-preglednika. To će stvoriti datoteku — ponekad sliku, ponekad PDF — koju će Photoshop® moći otvoriti i urediti. Kada koristite ovu metodu, dinamički sadržaj, apleti, animacije i slike generirane putem skripti možda se neće ispravno ispisati, a složeno oblikovanje ili okviri na dokumentu mogu se pojaviti kao nepovezana područja unutar PSD dokumenta. Zamjena dinamičkog sadržaja slikama rezerviranih mjesta iste veličine ili mjerila može riješiti neke od ovih problema, iako složeno oblikovanje s kaskadnim stilskim listovima (CSS) i okvirima i dalje može uzrokovati probleme.

Kada koristite program za rastersku grafiku kao što je Photoshop®, morat će se obaviti neki rad na uređivanju slike koja je rezultat pretvorbe HTML u PSD. Tekst općenito postaje vrlo alias, a ponekad postoje vizualni artefakti kao što su male, blijede granice oko elemenata ili male grafike koje nestaju zbog skaliranja. Za vrlo složenu web stranicu s više elemenata, korištenje drugih programa — kao što su Adobe® Illustrator ili Adobe® InDesign® — može biti bolji izbor i može uštedjeti vrijeme.