[jacobjs]

Hej!

en fråga. Om man får en färdig design, typ i psd-format, hur implementerar man den då på en webbsida? Måste man sitta och pula i css tills allt blir rätt eller finns det något enklare sätt?

[Magnus_A]

Det enklaste sättet är att konvertera .psd -filen till lämpligt grafikformat, till exempel .jpeg och lägga upp den på din sida iu en img-tagg. Sedan kan besökarna i lugn och ro beskåda din design.
Någon funktionalitet finns då inte så dom tröttnar väl rätt snart.
Vill du ha klickbarhet så kan du lägga in en imagemap.
Vill du ha funktionalitet så är det bara att hacka på. Css är väl det som gäller, annars går det med ramar, iframes, tabeller eller i stort sett vad som helst som gör att grejerna hamnar ungefär där du vill ha dom.

[knullis]

jag har med sutti och leta efter lite guider för sånt!
alla kan rita en någorlunda sjysst design i photoshop men att sen göra om det till en färdigsida verkar bökigt.
sutti med det ett par gånger och njah jag lyckas inte få till det riktigt..kört med tabeller och ramar i dreamweaver.

nu e inet jag nån designer eller kodare men en steg för steg guide vore skoj nån som vet?

[ChSu]

Det där händer mig ofta. Vanligast är att jag inte får bilder på varje
typsida, så jag börjar med att leta efter återkommande stilelement. Typ
"alla rubriker har en gradient och är i fetstil", "tabeller är alternerande
gråa", "länkar är chockrosa"...

Detta för att kunna ifrågasätta desigens val när det inte finns regelbundenhet
i designen. Bra att kunna göra det först, och ju mindre varians i designen desto
lättare blir det med css:andet senare. Med vana så lär du dig också att hitta
vad du inte fått i en psd än, typiskt hur formulär ska se ut, samt felrapportering
i dem.

När jag väl börjar med CSS så fokuserar jag först på att kunna göra
layouten som krävs. Då är det guld att ha en massa lustiga bakgrundsfärger
typ: .menu { background-color: red; } så jobbar man med dessa boxar
tills de ligger som man vill.

Det är lite av en top-down design. För man fortsätter sedan med att sätta rätt
typsnitt och färger och bakgrunder på blockens innehåll.

[jacobjs]

tack för bra svar. förstår emellertid inte varför det inte finns någon funktion för denna typ av implementering. Skulle väl inte vara så svårt att ordna i DW eller annat program?

[ztream]

Näe, man borde även kunna skriva ut en bil man ritat i Photoshop på en skrivare som gör allting verkligt. Sedan kan man åka till affären och handla i den.

Eller om man inte har körtkort kan man rita en snygg tjej i Photoshop som kör en.

[Jawn]

Kan alltid betala någon, finns dem som gör det för 20$ med full w3 standard och så vidare.

[Andreeas]

Var kan man hitta en sådan person Jawn?

[mazada]

ztream har en riktigt fin poäng där.

Ska man få något gjort som man vill så föreslår jag att man lär sig html, öppnar anteckningar och börjar knacka =) Vill man ha det på ett visst sätt så krävs kunskapen om hur man skapar det, program som dw ser jag som ett redskap när man redan vet vad det gör då har man lite bättre koll.

Eller... notepad ++ är nog det ultimata.

För att svara på frågan hur man går från ps till färdig html så, se till att du endast har det som inte kan skapas med css.. typ text... alltså endast grafiken... ta sedan segemteringsverktyget och dela upp interface i passande enheter, spara för webb och länka in bilderna i htmlsidan. Ps gör faktiskt detta automatiskt... men om man inte vet något om html så blir det svårt att vidareutveckla det som har skapats.

[Samben]

Vet ej om vi är inne på samma spår, men du använder slice tool i photoshop sedan sparar du .psdn som websida (du får en html fil och en mapp med alla bilder du slicat).
Sen leker du ihop det med css och annan kod.