website design in elkaar krijgen

Status
Niet open voor verdere reacties.

lefty999

Gebruiker
Lid geworden
5 jul 2002
Berichten
933
dag beste

ik heb dit design gemaakt (zie bijlage) maar krijg er geen html pagina rond gebouwd zodanig dat in het venster waar de lamp zit een tekst kan geplaatst worden.
Wie kan mij hierbij helpen??


dank bij voorbaat
 

Bijlagen

  • firstlight 2.JPG
    firstlight 2.JPG
    35,3 KB · Weergaven: 57
Dan moet je het in stukken snijden, zodat je een tabel krijgt en het plaatje als achtergrond kan functioneren.

:cool:
 
peter vazed zei:
Dan moet je het in stukken snijden, zodat je een tabel krijgt en het plaatje als achtergrond kan functioneren.

:cool:
kun je mij daarbij helpen? want ik zit ermee dat het op verschillende resolutie's moet werken
 
peter vazed zei:
Dan moet je het in stukken snijden, zodat je een tabel krijgt en het plaatje als achtergrond kan functioneren.

:cool:
Tabellen zijn niet bedoeld om je layout mee op te zetten... Beter gebruik je een paar <div>'s i.c.m. CSS :)

Overigens zit d'r een foutje in: de tekst scrollt in Firefox te laag :)
 
Laatst bewerkt:
JPeetje zei:
Tabellen zijn niet bedoeld om je layout mee op te zetten... Beter gebruik je een paar <div>'s i.c.m. CSS :)

Overigens zit d'r een foutje in: de tekst scrollt in Firefox te laag :)
hoe krijg je het dan klaar in divs?

das voor mij een nieuw iets :p
 
lefty999 zei:
hoe krijg je het dan klaar in divs?

das voor mij een nieuw iets :p
Serieus ? :D. Ha'k niet verwacht, zelfs de beginners krijgen tegenwoordig die kennis er wel ingestampt van de gevorderden... :)

Maar goed, hier wordt heel mooi uitgelegd hoe DIV's werken :). Het snelst leer je trouwens door simpelweg veel te prutsen ;)


A List Apart, prachtige website !
 
JPeetje zei:
Serieus ? :D. Ha'k niet verwacht, zelfs de beginners krijgen tegenwoordig die kennis er wel ingestampt van de gevorderden... :)

Maar goed, hier wordt heel mooi uitgelegd hoe DIV's werken :). Het snelst leer je trouwens door simpelweg veel te prutsen ;)


A List Apart, prachtige website !
jackes een engelse uitleg :s
 
JPeetje zei:
...ja een Engelse uitleg ja. Niet zo aanstellen nou.
achjha zalt es proberen maar snap het niet zo goed hoe het zit met een image als achtergrond te include in alle 4 richtingen
 
lefty999 zei:
achjha zalt es proberen maar snap het niet zo goed hoe het zit met een image als achtergrond te include in alle 4 richtingen
Huh ? Een achtergrond te include in alle 4 richtingen ? Dat moet je toch echt ff beter omschirjven :p
 
JPeetje zei:
Huh ? Een achtergrond te include in alle 4 richtingen ? Dat moet je toch echt ff beter omschirjven :p
jha dus de website wil ik indelen in 4 randen en een center schermdus een header een footer en links en rechts een rand en in het midden dan de tekstveld (dus het kadertje met het lampje
 
lefty999 zei:
jha dus de website wil ik indelen in 4 randen en een center schermdus een header een footer en links en rechts een rand en in het midden dan de tekstveld (dus het kadertje met het lampje
ik snpa het divs en css systeem niet echt goed kan iemand me een voorbeeld geven?

dus neem dat ik in een css de afbeelding footer.jpg oproep als background,hoe maak ik dan dat ik footer.jpg als div vermeld in de website?
 
Dat je het niet snapt, snap ik wel.
Het is ook niet in één keer te bevatten.

Een pagina voor een site bestaat uit html code, meestal gevat in een of meerdere tabellen.
Nu heb je ook opmaak codes, als vet, ander lettertype etc.
Deze worden gewoon in de html code ingevoegd.
Je code wordt een lange onoverzichtelijke brei.
Aanpassen en wijzigen is een crime.

CSS zorgt ervoor, dat je de OPMAAK codes buiten je pagina brengt.
Dit stop je een een style, welke als losse file wordt opgeslagen. (style.css)
Dus voor heel je site kun je door slechts in deze file het font te veranderen je site van dit font voorzien.
Voordeel: vlotter aanpassen en je code is overzichtelijker.

Doordat de huidige browsers css ondersteunen is het gebruik van css aan te bevelen.
Ook kun je css voor de layout -het aanzien- van je pagina gebruiken.

Dus de LAYOUT kun je ook in een style onderbrengen.
Het voordeel:
je content en menu zitten gewoon in een paar divs.
Je code is overzichtelijker en compacter, doordat je de tabellen laat vervallen.
Maar dit, dus de layout, vergt wel wat aandacht.
Je zult heel wat moeten stoeien om het naar je zin te krijgen.
EN.... controleer het wel in IE en Firefox, dit omdat de weergave van sommige css elementen niet altijd op dezelfde wijze wordt weergegeven.

Voorbeeld:
http://www.zeepoort.nl/lampje/css_lampje2.html
bekijk het in IE en FF.

Infosites:
http://www.glish.com/css/
http://www.webreference.com/authoring/style/sheets/layout/advanced/

:cool:
 
Als je een beetje bekend bent met Adobe Photoshop en/of Adobe ImageReady kan je daar mooi je ontwerp in maken en ImageReady automatisch de divs laten creëren..

Vind ik altijd veel makkelijker :)
 
Jolandaatjuh zei:
Als je een beetje bekend bent met Adobe Photoshop en/of Adobe ImageReady kan je daar mooi je ontwerp in maken en ImageReady automatisch de divs laten creëren..

Vind ik altijd veel makkelijker :)
ik ben bekend met photoshop maar imagereader niet echt,maar ik split de backgrounds met photoshop maar die html die hij dan maakt is niet echt bruikbaar voor tekst in te geven :(
 
Het begin van je page ziet er veelbelovend uit.

Maareh... volgens mij is 1st (first) toch als "1 rst". ??:shocked:
 
Paul-RT zei:
Het begin van je page ziet er veelbelovend uit.

Maareh... volgens mij is 1st (first) toch als "1 rst". ??:shocked:
zo heeft hij de url al geregistreerd dus zo zal de naam ook zijn :p

maarheu in photoshop bedoel je zoals ik het deed.
Dus opslaan voor web -->en dan die html file?
 
Ik gebruik Photoshop om mijn ontwerp in te maken.. Zorg dat je in dit ontwerp verschillende lagen gebruikt voor elk stukje dat je klikbaar wilt hebben, en voor elk stukje waar je tekst in wilt kunnen zetten.

Dit bestand open ik vervolgens in ImageReady (krijg je over het algemeen bij Photoshop geleverd). In ImageReady zorg je dat je elke laag "sliced" door met de rechtermuisknop op de laag te klikken en voor de "new layer based slice" te kiezen.

Vervolgens, als alle lagen gesliced zijn, kies je onder "File" de optie "Save optimized as".. Ik hoop dat het zich verder vanzelf wijst, anders lees ik het hier wel weer :)

(Ik weet helaas niet wat de termen in het Nederlands zijn, dus ik hoop dat je een engelse versie hebt. Anders kan ik je later nog verder helpen als ik bij mijn vriend ben, want hij heeft wel een nederlandse photoshop :) )
 
Laatst bewerkt:
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan