DIG Digital Corner
Alles wat je altijd al over computers, hardware, software, internet en elektronische gadgets had willen weten, maar niet op Tweakers.net durft te vragen.
Ff een hele domme vraag. Ten eerste moet ik me nog heel erg verdiepen in webdesign. Ik kan wel een site maken, maar meer met progsels als frontpage en dreamweaver . Nu ben ik een site aan het bouwen in CSS. Ik heb een van de style sheets van Dreamweaver MX gebruikt. NU heb ik alles redelijk goed staan maar wil een bepaalde indeling maken. Vroeger werkte ik vooral met frames en tables maar nu heb je cells (??) in CSS.
Ik kan in links bovenin een targetframe aangeven. Moet ik nu zelf een nieuw frame creeeren in de cell of iets dergelijks. Ik wil dus gewoon dat het menubalkje op dezelfde plaats blijft en dat de textcontent van de cell verandert.
Hier is de opzet : http://www.omegamc.nl
Ik wil dus dat met het aanklikken van de bovenstaande links de content in het witte gedeelte onder ingeladen wordt. Wat moet ik aangeven als target bij die links ?
. Nu ben ik een site aan het bouwen in CSS. Ik heb een van de style sheets van Dreamweaver MX gebruikt. NU heb ik alles redelijk goed staan maar wil een bepaalde indeling maken. Vroeger werkte ik vooral met frames en tables maar nu heb je cells (??) in CSS. Ik kan in links bovenin een targetframe aangeven. Moet ik nu zelf een nieuw frame creeeren in de cell of iets dergelijks. Ik wil dus gewoon dat het menubalkje op dezelfde plaats blijft en dat de textcontent van de cell verandert.
Hier is de opzet : http://www.omegamc.nl
Ik wil dus dat met het aanklikken van de bovenstaande links de content in het witte gedeelte onder ingeladen wordt. Wat moet ik aangeven als target bij die links ?
Wtf is een cell?quote:Op maandag 6 juni 2005 17:58 schreef Kamigot het volgende:
Ff een hele domme vraag. Ten eerste moet ik me nog heel erg verdiepen in webdesign. Ik kan wel een site maken, maar meer met progsels als frontpage en dreamweaver . Nu ben ik een site aan het bouwen in CSS. Ik heb een van de style sheets van Dreamweaver MX gebruikt. NU heb ik alles redelijk goed staan maar wil een bepaalde indeling maken. Vroeger werkte ik vooral met frames en tables maar nu heb je cells (??) in CSS.
Dat kan niet. Dat zijn nu net die frames die obsolete, deprecated, pointless, irritant en lelijk zijn.quote:Ik kan in links bovenin een targetframe aangeven. Moet ik nu zelf een nieuw frame creeeren in de cell of iets dergelijks. Ik wil dus gewoon dat het menubalkje op dezelfde plaats blijft en dat de textcontent van de cell verandert.
Gewoon een nieuwe pagina die wederom de code van de hele pagina bevat. Kijk maar eens hoe Fok en Tweakers.net en eigenlijk iedere grote site het doen. 95% van de professionele websites "can't be wrong"quote:Ik wil dus dat met het aanklikken van de bovenstaande links de content in het witte gedeelte onder ingeladen wordt. Wat moet ik aangeven als target bij die links ?
Ok dus ik moet voor elk linkje een compleet nieuwe pagina aanmaken ? dat vind ik niet echt efficient werkenquote:Op maandag 6 juni 2005 18:06 schreef curry684 het volgende:
[..]
Wtf is een cell?
[..]
Dat kan niet. Dat zijn nu net die frames die obsolete, deprecated, pointless, irritant en lelijk zijn.
[..]
Gewoon een nieuwe pagina die wederom de code van de hele pagina bevat. Kijk maar eens hoe Fok en Tweakers.net en eigenlijk iedere grote site het doen. 95% van de professionele websites "can't be wrong"
Dus ik kan het niet zo maken dat als ik op een linkje klik, er in een bepaald gedeelte van de pagina andere text verschijnt ?
ik heb nu een css file met valid css erin. Maar aangezien internet explorer het niet altijd goed doet, heb ik wat hacks voor IE erin moeten bouwen. Vervolgens is het niet meer w3c valid. Dit heb ik opgelost door de IE hacks uit de CSS file te halen en vervolgens in de head de IE specific css geplaatst hiertussen:
Wat ik me afvraag is of dit een beetje een valid methode is
| 1 2 3 | <!--[if gte IE 5.5]> ... <![endif]--> |
Wat ik me afvraag is of dit een beetje een valid methode is
□ Reality is merely an illusion,albeit a very persistent one-A.Einstein
■ Of ik ben gek of de rest van de wereld.Ik denk zelf de rest van de wereld-Rudeonline
□ The war is not meant to be won.It is meant to be continuous-G.Orwell
■ Of ik ben gek of de rest van de wereld.Ik denk zelf de rest van de wereld-Rudeonline
□ The war is not meant to be won.It is meant to be continuous-G.Orwell
Daar heb je serverside scripting en serverside includes voor Dan wordt het plots gruwelijk efficient juistquote:Op maandag 6 juni 2005 18:14 schreef Kamigot het volgende:
[..]
Ok dus ik moet voor elk linkje een compleet nieuwe pagina aanmaken ? dat vind ik niet echt efficient werken
Dan wordt het plots gruwelijk efficient juist Gelukkig niet. Hoe zouden mensen moeten deeplinken naar die pagina of bookmarken?quote:Dus ik kan het niet zo maken dat als ik op een linkje klik, er in een bepaald gedeelte van de pagina andere text verschijnt ?
Voor enkel een andere tekst overigens kun je Javascript gebruiken, maar dat heeft ook niet iedereen.
Perfect valide: voor andere browsers is het gewoon HTML comment, en alleen IE snapt de equation die je uitvoertquote:Op maandag 6 juni 2005 18:15 schreef DionysuZ het volgende:
ik heb nu een css file met valid css erin. Maar aangezien internet explorer het niet altijd goed doet, heb ik wat hacks voor IE erin moeten bouwen. Vervolgens is het niet meer w3c valid. Dit heb ik opgelost door de IE hacks uit de CSS file te halen en vervolgens in de head de IE specific css geplaatst hiertussen:
[ code verwijderd ]
Wat ik me afvraag is of dit een beetje een valid methode is
Ok bedankt voor de tips. Is het nu verstandig om eerst alle pagina's aan te maken (simpel html met alleen de naam) 1 standaard met alle links goed erin en die dan doorkopieren naar alle andere. Dan hoef ik alleen steedss de tekst te veranderen.
Sorry nog even een vraagje. Hoe maak ik zo'n uitklapmenutje net zoals ze op tweakers hebben ?
Ziet er nu zo uit
[ Bericht 60% gewijzigd door Kamigot op 07-06-2005 14:33:12 ]
Ziet er nu zo uit
quote:<div id="subglobal8" class="subglobalNav">
<a href="#">subglobal8 link</a> | <a href="#">subglobal8 link</a> | <a href="#">subglobal8
link</a> | <a href="#">subglobal8 link</a> | <a href="#">subglobal8 link</a> | <a href="#">subglobal8
link</a> | <a href="#">subglobal8 link</a>
</div>
[ Bericht 60% gewijzigd door Kamigot op 07-06-2005 14:33:12 ]
Doe gewoon View Source bij op Tweakers En de DOM inspector van Firefox is ook erg handig om te ontdekken hoe anderen dingen doenquote:Op dinsdag 7 juni 2005 14:04 schreef Kamigot het volgende:
Sorry nog even een vraagje. Hoe maak ik zo'n uitklapmenutje net zoals ze op tweakers hebben ?
Ziet er nu zo uit
[..]
Ik zou je HTML files gewoon als extensie .php geven en iedere file zo bouwen:quote:Op dinsdag 7 juni 2005 13:46 schreef Kamigot het volgende:
Ok bedankt voor de tips. Is het nu verstandig om eerst alle pagina's aan te maken (simpel html met alleen de naam) 1 standaard met alle links goed erin en die dan doorkopieren naar alle andere. Dan hoef ik alleen steedss de tekst te veranderen.
| 1 2 3 4 5 6 | <?php require_once "include/pageheader.php"; ?> <div id="feitelijkecontent"> <h1>Onderwerp van de pagina</h1> <p>Wat toelichtende tekst</p> </div> <?php require_once "include/pagefooter.php"; ?> |
Dan hoef je helemaal niets te kopieren, heb je feitelijk alleen de content per pagina uitgesplitst staan, ben je klaar voor een eventuele DB-koppeling later, hoef je de header en footer maar op 1 plek te wijzigen als je iets wil veranderen etc. etc. etc.
Copy/paste is evil, write code once and use it forever
ok kom ik weer met een vraagje . Ben bezig met een site en daarin heb ik een <div> geplaatst over een andere div heen en die moet een bepaalde alpha waarde krijgen (wit, 40% alpha). Dit had ik eerst opgelost met opacity, -moz-opacity en filter:alpha(opacity). Maar toen kreeg ik in sommige browsers (mac IE bijv.) een wit vlak ipv een 40% doorzichtig vlak. Deze wijze is dacht ik ook nog niet css valid en nog niet door veel browsers ondersteund (?).
Dus ik heb het op een andere manier opgelost. ik heb een .png gemaakt van 2px*2px die wit is en 40% doorzichtig. Dit is de CSS code in mijn css file:
met de bijbehorende div:
Maar omdat Internet Explorer voor windows .png klote behandelt nog een aparte IE hack toegevoegd boven in de head van de index pagina:
dan werkt het allemaal mooi in IE voor windows etc. maar nu krijg ik een groen vlak als ik Mac IE gebruik :S. Wat doe ik fout of hoe kan ik dit beter oplossen?
Dus ik heb het op een andere manier opgelost. ik heb een .png gemaakt van 2px*2px die wit is en 40% doorzichtig. Dit is de CSS code in mijn css file:
| 1 2 3 4 | #chapter_background { background: transparent url(/px/alpha.png) 0% 0% repeat; .... } |
met de bijbehorende div:
Maar omdat Internet Explorer voor windows .png klote behandelt nog een aparte IE hack toegevoegd boven in de head van de index pagina:
| 1 2 3 4 5 6 7 8 | <!--[if gte IE 5.5]> <style type="text/css"> #chapter_background { background:transparent; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/px/alpha.png',sizingMethod='scale'); } </style> <![endif]--> |
dan werkt het allemaal mooi in IE voor windows etc. maar nu krijg ik een groen vlak als ik Mac IE gebruik :S. Wat doe ik fout of hoe kan ik dit beter oplossen?
□ Reality is merely an illusion,albeit a very persistent one-A.Einstein
■ Of ik ben gek of de rest van de wereld.Ik denk zelf de rest van de wereld-Rudeonline
□ The war is not meant to be won.It is meant to be continuous-G.Orwell
■ Of ik ben gek of de rest van de wereld.Ik denk zelf de rest van de wereld-Rudeonline
□ The war is not meant to be won.It is meant to be continuous-G.Orwell
Er is een css hack voor mac ie 5:
Dan is #foo in mac ie 5 rood, in alle andere browsers groen.
| 1 2 3 4 | #foo { background: red; } /* commented backslash hack \*/ #foo { background: green; } /* end hack */ |
Dan is #foo in mac ie 5 rood, in alle andere browsers groen.
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
Ik heb net dit hele topic even doorgelezen en kwam het stukje over geen tabellen gebruiken voor de lay out dus ook tegen. Nu snap ik de nadelen er wel van natuurlijk, maar bij vrijwel (ben eigenlijk nog geen site tegengekomen waar het niet zo is) zie ik dat er voor de opmaak wel gewoon tabellen gebruikt worden en geen div's. Nu vraag ik me af waarom dat zo is . Vallen de nadelen gewoon mee van tabellen als je je aan wat regels houdt of zijn div's gewoon teveel werk en/of te lastig?
Een dag niet gelachen is een dag niet geleefd.
Dat div's teveel werk zou zijn is onzin, het levert juist minder werk op omdat je html veel simpeler wordt. Als je gewend bent om met tabellen te lay-outen dan vergt het wel een omschakeling in je denkwijze (je moet structuur en opmaak scheiden), en het vergt wat studie. Die omschakeling hebben nog lang niet alle webdesigners gemaakt.quote:Op woensdag 8 juni 2005 21:20 schreef Nietmachine het volgende:
Ik heb net dit hele topic even doorgelezen en kwam het stukje over geen tabellen gebruiken voor de lay out dus ook tegen. Nu snap ik de nadelen er wel van natuurlijk, maar bij vrijwel (ben eigenlijk nog geen site tegengekomen waar het niet zo is) zie ik dat er voor de opmaak wel gewoon tabellen gebruikt worden en geen div's. Nu vraag ik me af waarom dat zo is . Vallen de nadelen gewoon mee van tabellen als je je aan wat regels houdt of zijn div's gewoon teveel werk en/of te lastig?
No Dukes of Hazzard in the classroom
Bovendien gedragen tables zich iets consistenter in verschillende browsers dan divs dat doen. Dit komt met name omdat Internet Explorer op het gebied van CSS nog een jaar of vier achterloopt bij moderne browsers als Opera, Safari en Mozilla. Het vereist dus een klein beetje extra kennis en werk om een div-based layout cross-browser werkend te krijgen, en veel webdesigners laten zich hierdoor afschrikken.
jah ben bekend met de mac ie hack maar wist niet waar ik dat zou moeten gebruiken. Ik heb een oplossing gevonden op het groene vlak: de PNG met 40% alpha channel moest een formaat hebben van minstens 64x64, vond ik via google. Na de resize werkt het opeens goed :S.quote:Op woensdag 8 juni 2005 18:58 schreef SuperRembo het volgende:
Er is een css hack voor mac ie 5:
[ code verwijderd ]
Dan is #foo in mac ie 5 rood, in alle andere browsers groen.
□ Reality is merely an illusion,albeit a very persistent one-A.Einstein
■ Of ik ben gek of de rest van de wereld.Ik denk zelf de rest van de wereld-Rudeonline
□ The war is not meant to be won.It is meant to be continuous-G.Orwell
■ Of ik ben gek of de rest van de wereld.Ik denk zelf de rest van de wereld-Rudeonline
□ The war is not meant to be won.It is meant to be continuous-G.Orwell
Als je deze vraag durft te stellen snap je de nadelen ervan nietquote:Op woensdag 8 juni 2005 21:20 schreef Nietmachine het volgende:
Ik heb net dit hele topic even doorgelezen en kwam het stukje over geen tabellen gebruiken voor de lay out dus ook tegen. Nu snap ik de nadelen er wel van natuurlijk, maar bij vrijwel (ben eigenlijk nog geen site tegengekomen waar het niet zo is) zie ik dat er voor de opmaak wel gewoon tabellen gebruikt worden en geen div's. Nu vraag ik me af waarom dat zo is . Vallen de nadelen gewoon mee van tabellen als je je aan wat regels houdt of zijn div's gewoon teveel werk en/of te lastig?
Nadelen: je semantiek klopt niet, mensen met een niet-PC-screen browser kunnen je site niet gebruiken, searchengines kunnen je site niet fatsoenlijk indexeren, printen werkt niet fatsoenlijk, maintainability is nul, je HTML is 3 keer te groot, opmaak wijzigen is enorme kutklus.
Voordelen: noone knows, maar helaas wordt 90% van de websites op het internet niet door webdesigners maar door omhooggevallen prutsers met een boek 'HTML 2.0 for dummies' uit 1995 gemaakt. En dus zijn er veel tablebased sites.
De nadelen snappen is niet moeilijk. Snappen waarom er dan alsnog zoveel gebruik van gemaakt wordt is lastiger. Als ik in de bron van veeeeel sites (en dan niet de standaard huis/tuin en keuken sites natuurlijk) kijk zie ik dus dat die gewoon gebruik maken van tables, vandaar mijn vraag dus.quote:Op donderdag 9 juni 2005 21:55 schreef curry684 het volgende:
[..]
Als je deze vraag durft te stellen snap je de nadelen ervan niet
Nadelen: je semantiek klopt niet, mensen met een niet-PC-screen browser kunnen je site niet gebruiken, searchengines kunnen je site niet fatsoenlijk indexeren, printen werkt niet fatsoenlijk, maintainability is nul, je HTML is 3 keer te groot, opmaak wijzigen is enorme kutklus.
Voordelen: noone knows, maar helaas wordt 90% van de websites op het internet niet door webdesigners maar door omhooggevallen prutsers met een boek 'HTML 2.0 for dummies' uit 1995 gemaakt. En dus zijn er veel tablebased sites.
Een dag niet gelachen is een dag niet geleefd.
Lichtelijk overdreven maar de main line klopt wel. Overigens hebben programma's als dreamweaver en consorten ook geen positief effect op het flowed designs.quote:Op donderdag 9 juni 2005 21:55 schreef curry684 het volgende:
Voordelen: noone knows, maar helaas wordt 90% van de websites op het internet niet door webdesigners maar door omhooggevallen prutsers met een boek 'HTML 2.0 for dummies' uit 1995 gemaakt. En dus zijn er veel tablebased sites.
Voor mensen die HTML/CSS niet snappen is het ook een logischer manier van werken: je hebt een browser enerzijds en een plaatje met gewenste layout anderzijds, dan is het het handigste voor de leek om het gewoon in blokjes op te snijden en zo te bouwen.quote:Op donderdag 9 juni 2005 22:06 schreef Nietmachine het volgende:
[..]
De nadelen snappen is niet moeilijk. Snappen waarom er dan alsnog zoveel gebruik van gemaakt wordt is lastiger. Als ik in de bron van veeeeel sites (en dan niet de standaard huis/tuin en keuken sites natuurlijk) kijk zie ik dus dat die gewoon gebruik maken van tables, vandaar mijn vraag dus.
Dat zijn echter zoals ik zeg de leken die onterecht beweren verstand te hebben van webdesign. En daar zijn er veel te veel van, helaas ook hier en daar met veel te dikke salarissen.
Je winst om een site te ontwikkelen met een layout zonder tables, pak je eigenlijk ook pas zodra je onderhoud op je site gaat plegen.
Of uit de bandbreedte die je bespaart, alhoewel dat uiteraard pas een argument wordt bij grotere pagina's met veel bezoekers.quote:Op vrijdag 10 juni 2005 16:07 schreef sop het volgende:
Je winst om een site te ontwikkelen met een layout zonder tables, pak je eigenlijk ook pas zodra je onderhoud op je site gaat plegen.
Ik ben ook weer aan het cssen.
Het gaat om deze site: http://matthijs.info/rmrt/
Ik heb 2 div's naast elkaar. #vakjes en #content, ik krijg alleen de grijze lijn in IE niet weg.
Padding: 0xp;
Opgeven heeft geen nut.
Iemand enig idee hoe ik dit oplos, behalve nog een andere div er achter te maken met dezelfde achtergrond?
Het gaat om deze site: http://matthijs.info/rmrt/
Ik heb 2 div's naast elkaar. #vakjes en #content, ik krijg alleen de grijze lijn in IE niet weg.
Padding: 0xp;
Opgeven heeft geen nut.
Iemand enig idee hoe ik dit oplos, behalve nog een andere div er achter te maken met dezelfde achtergrond?
Ik ben nu zelf ook wat gaan spelen aan de hand van wat ik hier tegen gekomen ben o.a..
Nu heb ik een vraag mbt dit:
In #content_splitter staat dus min-height: 230px;, als je dat er neer zet zonder
* html #content_splitter {
height: 230px;
}
wordt de hoogte geen 230px. Met bovenstaande * html... is dat wel het geval. Ook als je min-height: 230px; weghaalt en * html... laat staan.
Nu ik erbij nadenk lijkt het me een methode om cross browser te werken?
Nu heb ik een vraag mbt dit:
| 1 2 3 4 5 6 7 8 9 | #content_splitter { width: 768px; min-height: 230px; background-color: #C9C9C9; display: block; } * html #content_splitter { height: 230px; } |
In #content_splitter staat dus min-height: 230px;, als je dat er neer zet zonder
* html #content_splitter {
height: 230px;
}
wordt de hoogte geen 230px. Met bovenstaande * html... is dat wel het geval. Ook als je min-height: 230px; weghaalt en * html... laat staan.
Nu ik erbij nadenk lijkt het me een methode om cross browser te werken?
Een dag niet gelachen is een dag niet geleefd.
Ik neem aan dat je gebruik maakt van Internet Explorer. Moderne browsers zoals Opera, Safari en Mozilla ondersteunen wel degelijk netjes de min-height property en zullen het blok dus 230px hoog maken als de inhoud kleiner is.quote:Op vrijdag 10 juni 2005 23:20 schreef Nietmachine het volgende:
Nu ik erbij nadenk lijkt het me een methode om cross browser te werken?
Internet Explorer doet dat echter niet, en dan moet je dus via bijvoorbeeld * html werken, wat incorrecte CSS is omdat je hiermee zegt: "alles binnen het element html, wat een kind is van welk ander element dan ook", wat per definitie fout is omdat html het root element is, daar zit niets meer boven. Ook hier is Internet Explorer weer de enige browser die dit niet negeert, zoals zou moeten, maar deze regel wel toepast.
Met andere woorden:
min-height: 230px;
Mozilla, Opera, Safari: Ok, het blok moet minimaal 230 pixels hoog worden, geregeld.
Internet Explorer: Huh? Watte?
* html [...] height: 230px;
Mozilla, Opera, Safari: Erm, * html kan helemaal niet. Dit is fout, dus negeren we dit.
Internet Explorer: Durrr. Hoogte 230 pixels. Okay! Durrr.
