Ik ben een site aan het maken voor de plaatselijke speelotheek.
www.speelplaats.org/Spellebel
Ik bouw die met frames (ik weet het, het is een achterhaalde techniek maar ik ben nog niet thuis in css)

Ik heb de frames een name gegeven en heb vevolgens het knopje "speelgoed" target "spellebel" meegegeven. Het werkt echter niet; de pagina wordt in de navigatiekolom geladen.
Ik heb als test het logo actief gemaakt en als ik die target "spellebel" mee geef werkt het prima maar met die flasfbutton wil het maar niet werken.

Ik gebruik dreamweaver en als ik die knop selecteer en dan op edit klik, kan ik bij target spellebel aanklikken. In de broncode geeft hij dat echter niet weer:

daarom heb ik er dit zelf bij getypt:

Wie kan me vertellen wat ik verkeerd doe?

(Bewerkt door Duke om 13:56, 8-08-2007)

?????

(Bewerkt door Spooter om 11:53, 23-04-2007)

Ik heb die knopjes niet in flash gemaakt, die zitten gewoon in dreamweaver.
(insert/media/flashbutton en dan bij target spellebel aanklikken)

Ik heb geprobeerd je code ertussen te plakken maar dat werkt ook niet....
Heb je nog ander tips?

een keer opnieuw opstarten en....
Voila! het werkt!  

Toch dank voor de tips.

Gebruik geen frames maar probeer zoveel mogelijk css en
xhtml te gebruiken. Makkelijker aanpasbaar, daarmee vol-
doe je aan open standaarden en zorg je ervoor dat dingen
als bandbreedte verbruik worden verlaagd, file sizes,
laadtijden etc.
Ik blijf er bij mensen op hameren maar echt het geeft zo
enorm veel voordeel.

En ik merk dat je in je middelste "frame" je tekst centreerd.
Doe dit bij voorkeur niet. Leest niet makkelijk omdat de
ogen geen referentie meer hebben en zo de tekst niet erg
makkelijk snel kan afscannen.

www.webdesignfromscratch.com

Zie het niet als kritiek, eerder als postitief bedoelde feedback
in de hoop dat je er wat aan hebt

En overigens, de buttons kan je misschien net zo goed als png
plaatjes ofzo gebruiken? Je gebruikt een soort verkleuring als
rollover maar deze kleurafwijking is veel te laag in contrast
in die zin dat hij maar een aantal tintjes verkleurt. Niet erg
drastisch dus. Dit valt niet eens op door de achtergrond kleur.

Ik heb die site voor de Speelotheek in Frames gemaakt omdat ik ook wilde weten hoe dat werkte. Nu wil ik een andere site, die alleen uit jpeg-plaatjes bestaat, ombouwen naar CSS: www.speelplaats.org .
Ik heb echter geen idee hoe CSS werkt. Ik heb er al een poosje op zitten studeren maar ik maak de klik blijkbaar niet.
Zou iemand me uit kunnen leggen hoe het principe van CSS werkt? Moet ik hier een basispagina maken zodat ik in de verschillende pagina's alleen de details maar in hoef te geven? Of begrijp ik er dan niets van?

Bij voorbaat dank voor de tips.

Eric Meyer on Css
More Eric Meyer on Css

Aan de hand van praktijk voorbeelden (lees de index eens van die boeken op die sites) worden een aantal handige tips gegeven en hoe het moet aanpakken. Een mooi voorbeeld is een website gemaakt in tabellen, deze gaat hij in het boek opnieuw maken maar dan met Css.

Als je de achterliggende gedachte, en wat praktijk voorbeelden, wilt weten 'waarom' je XHTML, Css en tabelloze websites zou moeten maken ... lees dan het boek van Jeffrey Zeldman - Desiging with Webstandards (2de ed.) eens moeten lezen.

Allebei guru's op hun gebied. Op de website van Alistapart.com kun je ook veel info vinden. De eerste 2 genoemde boeken zijn goed voor beginners (en gevorderde) en het boek van Zeldman zal je overtuigen (ook andere zul je ermee kunnen overtuigen).

Dank voor de boekentips. Ik was echter al op 10 verschillende sites aan het studeren. Daar vond ik o.a. de volgende stelling:
" There are plenty of excellent books and articles out there, including many written by the contributors to this publication. While most of those works gracefully walk the inexperienced developer through challenging layouts and teach by literal example, few of them acknowledge that using CSS to create standards-friendly sites requires a mindset that is alien to many experienced developers. This requirement hamstrings a lot of talented people, and for two years I’ve been looking for the words that will heal their pain. "

Ik geloof dat ik ook een beetje last heb van een "alien mindset" .
Ik heb nu een css doc waar ik een achtergrondplaatje en de tekstspecificaties in heb staan: www.speelplaats.org/speelplaatsnieuw/speelplaats.css
De tekst staat in een HTML doc: www.speelplaats.org/speelplaatsnieuw/index.html
Ik wilde alle onderdelen die op ale pag's terug moeten komen, zoals m'n navigatiekolom, allemaal in het css doc stoppen. Dat lukt niet omdat in dreamweaver alles inactief wordt als je een css doc aanmaakt. Als ik het handmatig probeer in te geven kom ik niet verder dan het achtegrondplaatje erin stoppen, de rest wil niet werken. Als iemand me kan uitleggen hoe ik de navigatiekolom die nu in m'n html doc staat in m'n css doc kan steken, zou ik je heel dankbaar zijn. Of: vertel me wat de denkfout is die ik hier maak zodat ik me een beetje minder alien voel.

Bij voorbaat dank.

Sorry voor deze Off topic reactie. Kun je verder niks mee, maar ik moest het even kwijt.

Tis echt allemaal voor een goed doel.

Ruw weg gezien bestaat een website uit 3 lagen.

1. De HTML gestructureerde code (div'jes), hiermee geef je blokken aan in de tekst. Een blok voor de navigatie div id="nav", een blok voor de header div id="header" en een blok voor de main content div id="maincontent". Ik noem maar wat. In hetzelfde css file kun je weer bepalen hoe de tekst en linkjes in de navigatie div eruit moeten zien. Dit is allemaal apart aan te geven.

2. Met Css (opmaak taal) bepaal je 'hoe' tekst (en andere div blokken) in bv de header eruit komt te zien. Bv arial 18px en paars. En je bepaalt waar het blok komt (float en position) en hoe breed en hoog het moet zijn. En hoe het op andere elementen reageerd in de HTML code (float).

3. Javascript: Daar gaat het in deze topic niet over. Maar dat bepaalt de interactiviteit. Ander hoofdstuk.

Wat de meeste webdesigners vergeten is dat het eindresultaat wat je op internet ziet zeker niet het begin punt van een website. Zet de Css eens uit (bv op mijn website, met Firefox en de Webdeveloper toolbar) en je zult zien dat er geen opmaak in de HTML-code staat. Maar het is nog steeds leesbaar en beter printbaar. Lees het boek van Zeldman als je niet overtuigd ben of het niet snapt waarom je HTML code goed gestructureerd moet schrijven en hoe css werkt.

DTP en webdesign zijn 2 totaal verschillende dingen en er komen specifieke techieken bij kijken. Css is zeer prominent in webdesign land. En echt niet moeilijk te implenteren. Een doorsnee grote website bestaat rustig uit 2000 regels Css code, nou dat tik ik zo uit m'n hoofd. De syntax is heel simpel en eigenlijk elke keer hetzelfde per css blokje wat je schrijft.

@Duke
Eén tip: lees de boeken (deze gaat niet dingen voordoen in Dreamweaver) want Css kun je gewoon met een code-editor (kan ook de code editor van dreamweaver zijn natuurlijk) of het gratis TextWrangler (code editor) intypen. In het begin om css ook te leren en 'live' direct te zien wat er gebeurt als je waardes veranderd zou ik MacRabbit CSSEdit aanraden. Het is een speicaal voor Mac gemaakt programma (van onze zuiderburen uit Belgie) wat alleen maar Css voor je vergemakkelijkt. Je ziet direct (in het programma) wat er veranderd. Safari wordt gebruikt om het weer te geven.

Css kan niks met Flash (ook al zijn het dreamweaver buttons). Het kan hooguit de positie bepalen van een parent DIV.

Ik kan anders wel even voor je kijken Duke en je photoshop om wat in elkaar te flanzen. Stuur me ander een PB'tje.

Uiteraard is héél veel info on-line te vinden, maar grafo's willen de
info hun handjes kunnen vasthouden - ergo: papier...

En een waarschuwing: CSS-termen zijn bedacht door techneuten,
dus (net zoals bij HTML) niet altijd logisch vanuit grafisch oogpunt.
Laat je daardoor niet in de war maken. Bijvoorbeeld: Layers zijn
in CSS een DIV met positie; eerder te vergelijken met een kader
in XPress of InDesign en niet hetzelfde als layers in Photoshop.

O ja, en niet alles werkt even goed ! Sommige CSS lay-out opties
werken in veel browser niet of nog niet goed. Beetje raar, helaas.

En nog héél belangrijke tip: altijd alles testen in Mozilla FireFox.
Niet omdat jij of iedereen zo nodig met FireFox moet gaan werken,
maar omdat FireFox het betrouwbaarste is. Als andere browsers
(3x raden wiens, het merk begint met een M en eindigt op S...)
zich niet gedragen, dan ga je dat daarna oplossen met "hacks"
(zie boek van Cederholm). Dus niet meteen in paniek raken.

Firefox heeft niet het browsermarkt aandeel als Microsofts Intenet Explorer (ofwel IE) dat heeft. Maar IE geeft de W3C standaard HTML code niet altijd goed weer, zeker niet als het om bepaalde css dingen gaat. Daar zijn op internet altijd hele discussies over. Het komt erop neer dat je je website zeker zo goed moet maken dat het in IE ook goed werkt en prima uitziet. Het komt er ook op neer dat het ontwikkel tijd scheelt als je je website voor Firefox maakt. Safari, Opera en Firefox houden zich wat dat betreft veel stricter aan de correcte HTML/Css regels.

"Css-hacks" zou ik direct mijden en niet adviseren want dat leidt alleen maar tot vies gebruik van css en tot slechte gewoontes. Zoals bv Zeldman zou zeggen: we moeten het web gezonder maken door correcte schone code te gebruiken.

Bovendien is je css door hacks niet meer valid volgens het W3C. Microsoft heeft daar (ja toch) een mooi oplossing voor bedacht: Conditional comments. Dat is de enige correcte valid manier om er voor te zorgen dat bepaalde IE versies die kleine css tweaks krijgen waardoor je website (de HTML en css code) er in deze webbrower ook goed uitziet (werkt).

Nu wordt het misschien voor de doorsnee beginnend HTML'er / Css'er wat te technisch. Css is een apart opmaak taaltje wat je moet leren.

Dankzij de uitleg en heel veel voorbeelden is het boek uitstekend geschikt voor beginners. Ervaren CSS webdesigners vinden in dit boek veel nieuwe ontwikkelingen beschreven. Het boek gaat uitgebreid in op CSS3 en op de ondersteuning van CSS door IE7 en FF2

Zoals geschreven een aanrader.

Wat voor mij zeker in het begin heel makkelijk werkte toen ik begon met CSS,
is door één hele pagina in Photoshop op te maken, inclusief teksten, plaatjes... álles
Dat ontwerp hou ik dan zichtbaar in beeld op het moment dat ik met html/css de
pagina in code ga opzetten. Dat gaf me een wat duidelijker beeld over hoe ik dingen
moest plaatsen en oplossen.

Maar hoewel Frames een wat directer resultaat geven, is het echt goed werkbaar krijgen
van die frames nog best een flinke klus. Als je even niet oplet schuiven plaatjes uit de
frames of zorgen ervoor dat frames uit elkaar klappen bijvoorbeeld.

Met CSS ben je in het begin misschien iets langer bezig, maar als het eenmaal staat,
dan staat 't ook als een huis. Plus je bent daarna veel vrijer in het zonder moeite
aanpassen van de layout en/of vormen e.d.

denn88 om 6:19, 10-08-2007
"Css-hacks" zou ik direct mijden en niet adviseren want dat leidt alleen maar tot vies gebruik van css en tot slechte gewoontes. Zoals bv Zeldman zou zeggen: we moeten het web gezonder maken door correcte schone code te gebruiken.

CSS-hacks zijn voorlopig helaas nog overmijdelijk - en dat is niet erg.
Na 10 jaren klooien met tabellen-opmaak en allerlei rare opmaaktrucs,
hoeven de webdesigners nu niet meteen super-schoon te gaan werken
of mogelijkheden te laten liggen die met een toch hack overal werken.

Het gaat om het principe: wil je blijven werken met oudere technieken
(en steeds méér trucs en troep in je website proppen) of wil je werken
met moderne technieken, die steeds minder hacks of trucs zullen eisen,
naarmate browsers hun nukken en kuren verliezen ?

De meeste hacks maken meestal gebruik van 'splitsers' en/of 'sniffers',
die meestal dankzij andere weeffouten in die browser kunnen werken.
Wordt de browser beter, dan kan die hack er simpelweg uit - that's it.

1 Je hebt gelijk, dat je vorm en inhoud gescheiden kan editen.
De html voor de tekst, en een css-bestand voor layout, kleur etc.
Maar navigatie is een beetje van beide (vorm en inhoud).
Die bouw je dus ook op uit een klikbaar deel (text of image) en code (link).
In Dreamweaver kun je je venster in tweeen delen: boven code, onder WYSIWYG.
Veranderingen in je css-bestand worden direct zichtbaar, maar Preview in Browser
blijft echt onmisbaar.

2 Je kunt van CSS-sites allerlei voorbeeldsites downloaden, inclusief css en uitleg.
Een aantal voorbeelden voor indeling in kolommen (ipv frames), onder andere.

http://www.adobe.com/devnet/dreamweaver/articles/three_column_layout.html
http://www.communitymx.com/abstract.cfm?cid=EA87013F0E8B6A50

Zonder te weten wat er met de beschikbare technieken kàn,
vind ik dat je geen goede ontwerper bent. Een ontwerper van
toegepaste kunsten blinkt uit door het tòch stijl- en smaakvol
aanwenden van ter beschikking staande (schaarse) middelen.
En sommige web-technieken kunnen nu eenmaal nog steeds
niet hetzelfde als een stuk papier met inkt (sommige aspecten
bieden minder mogelijkheden, en sommige juist méér).

Mijn advies aan beginnende webdesigners uit grafische hoek:
verdiep je eerst eens in de mogelijkheden (kijk daarbij vooral
naar het werk van anderen, o.a. met die Webdeveloper Bar),
en ga dan pas dingen verzinnen die volgens CSS goed kunnen,
al dan niet met wat hackjes om wat extra kunstjes te flikken...

En wil je als ontwerper absolute vrijheid: kies dan Flash...

Peter Villevoye om 9:40, 10-08-2007
Zonder te weten wat er met de beschikbare technieken kàn,
vind ik dat je geen goede ontwerper bent. Een ontwerper van
toegepaste kunsten blinkt uit door het tòch stijl- en smaakvol
aanwenden van ter beschikking staande (schaarse) middelen.

En wil je als ontwerper absolute vrijheid: kies dan Flash...

Met ook bij het internet geldt;
Als je iets fatsoenlijks wil maken zorg je dat je de basis kent, en het volgens de "regeld" der web doet. Als je een logo ontwerpt ga je dat ook niet op 72dpi doen, maar zorg je dat het een vectorlogo is. En als je een boek ontwerp heb je ook bepaalde regels (afloop, druktechniek, PMS of full color e.d.). En zo heb je ook bepaalde regels voor het internet

Om de Anti Frames Ridders en Clean CSS Voorstanders de mond te snoeren,
kan ik je verklappen, dat geen enkele web-techniek zo schoon en makkelijk
een kader in het midden kan centreren of een balk of paneel onderaan in het
venster kan plaatsen en laten 'meeschuiven' dan frames. In CSS kan het wel,
maar het blijft lastig om zo'n indeling (zonder hacks) ook werkend te krijgen.

Okay, frames hebben veel kleine nadelen die -bijeen opgeteld- zo rottig zijn,
dat veel webdesigners er voor veel websites terecht niet meer mee werken
(moeilijk 'deep' linken vanuit andere sites, gedoe met bookmarks en printen).

Maar de gedachte achter frames (apart navigeerbare delen) was niet slecht
en met iFrames werden veel technische problemen van frames toch omzeild.
Maar ik denk dat we pas over 3 jaren zonder browser-hacks en moeiteloos
het idee van frames kunnen voortzetten en gebruiken m.b.v. CSS.

(Bewerkt door Peter Villevoye om 10:16, 10-08-2007)

Maar aangezien we al een paar jaar naar standards gaan, en zoekmachines
niet/niet goed met frames kunnen omgaan... tja; dat lijkt mij al reden genoeg
om het volgens de "regeltjes" te doen, hehe.

Ook het opmaken van een site met frames vind ik niet handig. Je hebt het binnen
een minuutje staan, maar dan moet je een tijdje later ineens wat heerlijk
vervelende/uitgebreide aanpassingen doen aan die frames. Da's toch wat lastiger

Wat ik wel met CSS mis, is een goede ondersteuning van verticaal centreren

Laag 0: de code die bepaalt welke tekst in welke DIVs terecht komt. Een absolute vereiste als je een werkelijk dynamische website wilt bouwen.

Zo kan je op de statische manier een DIV maken, met daarin HTML code en de content. Maar je kan ook dynamisch werken en een DIV maken, met daarin de aanroep van een PHP functie die de content (inclusief HTML code) ophaalt uit de database.

Op die manier volg je een hele belangrijke regel van programmeren: houd je content en je code gescheiden. Wil je dan iets aanpassen aan de opmaak van je site, dan kan dat op een vaste plek. Wil je iets aanpassen aan de content, dan kan dat op een andere vaste plek. Je zal nooit meer door al je PHP en HTML files moeten graven om nog even dat vergeten item aan te passen.