Fra .psd til .html (Template)

[HaxyQ]

Hei.

 

Jeg sliter med et problem jeg ikke forstår nå, og det er som følgende:

 

Jeg har laget en template (for en nettside) i PhotoShop (.psd) og vil få det over til .html slik at jeg kan finpusse på den i DreamWeaver. Jeg har slicet det jeg trenger, og valgt Save for web & devices. (I PS)

 

Men slik jeg har skjønt det, av andre som har prøvd å hjelpe, så vil ikke bildene (slicene) lagres som bakgrunner, men alle lagres som en egen .gif-fil. Dette gjør visst nok slik at siden tar mye lengre tid å laste siden hele siden da består av masse bilder.

 

Noen ideer for hva jeg kan gjøre? Jeg har aldri laget en template i PS før, for og så åpne det i DreamWeaver og til slutt publisere den.

 

Tusen takk for svar!

[mikk-]

Altså. Hva skulle de ellers blitt lagret som, om ikke bildefiler?

 

Jeg anbefaler ikke å bruke HTML-en som blir generert av Photoshop. Du bør heller slice opp slik at du får de bildene du trenger, og så sette sammen siden med HTML og CSS. Det kan du bruke DW til.

[HaxyQ]

Nei, som sagt, så har jeg aldri drevet med dette før, men har fått med meg at de skal bli til bakgrunnsbilder på nettsiden, noe de tydligvis ikke blir.

 

Jeg kan ganske lite HTML og CSS, det er grunnen til at jeg lager dette i photoshop og dreamweaver.

 

Har du peiling på dette? Vet du hvordan man lager en template i PS og åpner den i DW osv? Jeg kunne trengt litt hjelp.

[mikk-]

Som sagt: Lag slices i PS, sett dem sammen i DW. Trenger du hjelp med dét, kan du lære deg HTML og CSS på HTMLdog.

[HaxyQ]

Jeg har satt dem sammen slik jeg tror det skal være, men problemet er at jeg ikke kan skrive tekst oppå bildene, siden de ikke er "bakgrunner".

Endret 25. februar 2008 av Haxy

[4588pkdkrikue5c]

Som sagt som sagt..

Som sagt: Lag slices i PS, sett dem sammen i DW. Trenger du hjelp med dét, kan du lære deg HTML og CSS på HTMLdog.

[Wackamole]

Hvis du vil gjøre det på den enkle måten (som noen her i forumet hater og forbyr )

 

Så ved vær <td> skriver du <td background="filen/til/stien/til/bildet.gif">

 

typisk eksempel på ps rendering av HTML:

 

<td>
<img src="images/webside_template_01.gif" height="210" width="360"></td>

 

Det du må gjøre er å flytte "images/webside_template_01.gif" og størrelsen opp til <td> taggen (Table Data) slik:

 

<td background="images/webside_template_01.gif" height="210" width="360"> </td>

 

Jeg må advare om at dette IKKE er optimal kode for en webside, men det fungerer!, med mindre du skal ha en haug med funksjoner, mye av sider jeg ser på nettet idag, tar evigheter og laste fordi den er bygd opp av bare bilder (enkle funksjoner som bakgrunn, er blitt èt bilde (kunne gjort enkelt med CSS)).

pluss at <td> taggen (som navnet tilsier TableData), skal egentlig bare brukes sammen med data som hentes feks.:

employeeID		first name		last name
1				 ola			   Normann
2				 kari			  normann? osv...

Du er herved advart ..

 

anbefaler at du lærer deg HTML, og CSS da dette hjelper mye på designen av siden.

 

 

./Famen

Endret 27. februar 2008 av Famen

[HaxyQ]

Tusen takk, skal teste det.

 

Det står:

 

<td colspan="11">

<img src="images/MF-Start_20.gif" width="720" height="500" alt="">

</td>

 

Skal jeg fjerne colspan også?

 

Dette så jo ikke rett ut...

Endret 27. februar 2008 av Haxy

[Habitats]

Jeg vet andre her har nevnt det. Men må bare understreke det. Du bør seriøst droppe hele table/frame setupen. Det blir bare problemer ut av det. Gikk i samme fella selv.

 

Ta og lær deg å kode med DIV/span og CSS i stedet. Du vil tjene så utrolig mye på dette. Det er en utrolig bratt læringskurve, men når du først får det til så vil du takke oss

[Wackamole]

du må ta bort "<img src="templatedesign.gif" height="250" width="300">" også, og colspan må være der

[HaxyQ]

Kan du vise hvordan det skal se ut?

[Wackamole]

Du har gjort rett, men du må gjøre det slik på alle for at det skulle bli et resultat!

[HaxyQ]

Du sier jeg har gjort rett, men også at colspan må være der, noe jeg har fjernet. Kan du ikke vise hvordan det skal se ut?

 

Det ser slik ut før jeg har gjort noe:

 

<td colspan="11">

<img src="images/MF-Start_20.gif" width="720" height="500" alt="">

</td>

[mikk-]

Poenget er vel at dette er riv ruskende feil, og aldri kommer til å fungere bra. Hvis du har tenkt å fortsette å lage websider, så bør du ta til fornuft, og lære deg HTML og CSS først som sist.

[HaxyQ]

Har jeg ikke sagt at jeg ikke orker å begynne å styre og lære meg HTML og CSS bare for å lage èn simpel nettside?

 

Nei, skal ikke fortsette med web-design, vil bare få denne siden opp, så er jeg ferdig med alt som heter html, dreamweaver osv...

[Wackamole]

<td background="images/MF-Start_20.gif" width="720" height="500" colspan="11">

</td>

[HaxyQ]

Takk.

 

Og det må gjøres på alle?

 

Noen plasser står det colspan, noen rowspan, og noen ingenting.

 

Hah, det virket faktisk. Tusen takk, Famen.

Endret 28. februar 2008 av Haxy

[AnaXyd]

Jeg har laget en enkel guide om akkurat dette... Ta gjerne en titt, og kanskje det kan hjelpe deg!

 

https://www.diskusjon.no/index.php?showtopic=872634&hl=

Endret 1. mars 2008 av AnaXyd

[HaxyQ]

Skjønte ganske lite av den guiden :/

[AnaXyd]

Nå må du ikke gi opp med en gang du må gjøre noe selv, for da klarer du ikke dette her. Den guiden er meget enkelt forklart(mener nå jeg), og om du går inn for å klare dette, så gjør du det. Les den en gang til, igjen, prøv osv.