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.
Dit topic is bedoeld voor alle vragen m.b.t. HTML, CSS en javascript, kortom alles wat je nodig hebt om (de frontend van) een website te maken.
HTML: Hyper Text Markup Language is de structuur van een website. Door middel van verschillende html tags geef je aan welke elementen bij elkaar horen (bijv: <div>, <ul>), of wat de betekenis van deze data is (bijv. <p>, <h1>). HTML leent zich ook voor opmaak, maar het is makkelijker en verstandiger om hier CSS voor te gebruiken.
CSS: Cascading StyleSheet is de opmaak van een website. In je CSS specificeer je bijvoorbeeld welke kleur bepaalde elementen moeten hebben, hoe groot ze zijn en hoe je ze wilt rangschikken.
JS: Javascript Javascript (niet te verwarren met programmeertaal Java) is een scripttaal, waarmee het mogelijk is je website dynamisch te maken. Javascript kan bijvoorbeeld HTML-elementen aanpassen, toevoegen of verwijderen.
Vragen over PHP, SQL of andere serverside programmeertalen horen niet in dit topic. Deze kun je stellen in [PHP/MySQL] voor dummies of open zelf een topic.
Voor vragen over webhosting, domeinnamen enz. kun je terecht in Het grote (betaalde) webhosting topic
En voor Wordpress is er ook een speciaal topic, als het om meer gaat dan de HTML/CSS van een theme: [Wordpress]Algemeen topic
Code posten
Het is, als je een vraag stelt, vaak handig om hier een stukje code bij te voegen. Post niet klakkeloos je hele website, maar post alleen het stukje code waar je vraag over gaat. Gebruik bovendien de [code]-tag (
, zodat je HTML, CSS of Javascript code goed leesbaar is. Dus niet [quote] of [spoiler] of wat dan ook.Nog beter is om een snippet in Codepen of JSFiddle te plakken. Hierdoor kunnen anderen je ook makkelijker helpen.
Veel voorkomende problemen
Veel problemen zijn te wijden aan het niet kloppen van HTML of CSS code. Een kleine typfout is snel gemaakt, en de webbrowser kan daar soms erg slecht mee omgaan. Om te controleren of je code technisch in orde is, kun je deze controleren met de W3 validator.
Is je code niet correct? Los dan eerst de fouten op zodat de validator geen foutmeldingen meer geeft. Dit lost niet altijd je probleem op, maar zorgt in ieder geval dat alles werkt zoals het hoort te werken, waardoor overige fouten ook veel makkelijker te achterhalen zijn.
IK SNAP ER NIETS VAN HELLEP! WAT IS CSS?
We helpen iedereen graag in dit topic, ook mensen die er helemaal niets van begrijpen. Maar we verwachten wel dat je je best doet om het wel te gaan begrijpen. Lees eens wat tutorials en probeer het altijd eerst zelf. Je krijgt hier tips waar je zelf iets mee moet doen.
Hier een paar artikelen over CSS elementen die vaak voor verwarring zorgen
• CSS Floats 101
• CSS Positioning 101
Heb je zin om HTML, CSS of Javascript leren, dan zijn deze video tutorials een goede plek om te beginnen
• 30 Days to Learn HTML & CSS
• 30 Days to Learn jQuery
• JavaScript from null
Overige tips & tricks
• jQuery Tips and Tricks
• Hidden Features of JavaScript
Populaire frameworks
• [HTML/CSS] Bootstrap
• [HTML/CSS] Foundation
• [JS] jQuery
• [JS] AngularJS
• [JS] Backbone
• [JS] Ember.js
[ Bericht 2% gewijzigd door mstx op 17-02-2015 10:16:05 ]
Op donderdag 2 juli 2009 22:41 schreef RTB het volgende:
als ik elk rap"liedje" een kans moest geven was ik aan het eind van dit millennium nog bezig met het tempo waarin die kotshoop uitgebraakt wordt.
👾
als ik elk rap"liedje" een kans moest geven was ik aan het eind van dit millennium nog bezig met het tempo waarin die kotshoop uitgebraakt wordt.
👾
Die JavaScript voor dummies kan wel uit de OP, al ruim een jaar niet in gepost. De tutorials bestaan trouwens ook niet meer. Daar kan wat mij betreft een link naar codeacademy.com, verder zouden links naar MDN (JS), CanIUse, JSfiddle, jsperf, html5doctor, wellicht wat magazines(?) ook niet misstaan om het weer een beetje up to date te trekken.
[ Bericht 11% gewijzigd door n8n op 16-02-2015 15:12:51 ]
[ Bericht 11% gewijzigd door n8n op 16-02-2015 15:12:51 ]
“Specialization is for insects”.—Robert Heinlein
When the student is ready, the teacher will appear.
When the student is truly ready, the teacher will disappear.
When the student is truly ready, the teacher will disappear.
De tutorials bestaan nog steeds maar hebben een nieuw onderkomen gevonden.
30 Days to Learn HTML & CSS
30 Days to Learn jQuery
30 Days to Learn HTML & CSS
30 Days to Learn jQuery
Whether or not you can become great at something, you can always become better.
And one day you'll wake up and find out how good you actually became, having transcended whatever limits you might have thought you couldn't pass.
Neil Degrasse Tyson
And one day you'll wake up and find out how good you actually became, having transcended whatever limits you might have thought you couldn't pass.
Neil Degrasse Tyson
2 versies van jQuery op 1 pagina, dat klinkt echt als een succesformule.quote:Op maandag 16 februari 2015 12:49 schreef n8n het volgende:
[..]
als je alle mieren een beetje neukt, heb je wel verdomd snelle websites. Pagina's interactief in een kwart seconde, met allemaal fancy dingen alles er op en er aan. Nou zullen wat ng-tags niet het verschil maken maar heel jquery parsen voor een toggle en input validatie wel. 5000 dom-elementen in je pagina (wat je ook 'gewoon' bij Google/Facebook ziet) slaat ook nergens op. Klakkeloos allemaal frameworks er op gooien gebeurt echt te vaak. Soms zie je 2 versies van jquery op een site (los ingeladen) omdat 1 (vaak slecht geschreven) Plug-in toevallig die dependancy heeft maar geen update.
Overigens zie ik ook regelmatig dat er veel verschillende jQuery-objecten van een DOM-element worden gemaakt, da's ook niet handig. Je kunt beter variabelen gebruiken.
Dus niet:
| 1 2 3 4 | $('#foo').functionA(); if (someStatement) { $('#foo').functionB(); } |
En wel:
| 1 2 3 4 5 | var $foo = $('#foo'); $foo.functionA(); if (someStatement) { $foo.functionB(); } |
OP opgeschoond 
Op donderdag 2 juli 2009 22:41 schreef RTB het volgende:
als ik elk rap"liedje" een kans moest geven was ik aan het eind van dit millennium nog bezig met het tempo waarin die kotshoop uitgebraakt wordt.
👾
als ik elk rap"liedje" een kans moest geven was ik aan het eind van dit millennium nog bezig met het tempo waarin die kotshoop uitgebraakt wordt.
👾
dat ook ja, de css-manier met eeuwige chains helpt ook niet echt, maar genoeg over jQuery. De selector engine is trouwens ook alweer een tijdje los verbrijgbaar. http://sizzlejs.com, het gemak van $() zonder de extras.quote:Op maandag 16 februari 2015 21:58 schreef Light het volgende:
[..]
2 versies van jQuery op 1 pagina, dat klinkt echt als een succesformule.
Overigens zie ik ook regelmatig dat er veel verschillende jQuery-objecten van een DOM-element worden gemaakt, da's ook niet handig. Je kunt beter variabelen gebruiken.
Dus niet:
[ code verwijderd ]
En wel:
[ code verwijderd ]
“Specialization is for insects”.—Robert Heinlein
Mooi geworden zo. Misschien een idee om bij het kopje code posten ook iets te zeggen over jsfiddle/codepen?quote:
Whether or not you can become great at something, you can always become better.
And one day you'll wake up and find out how good you actually became, having transcended whatever limits you might have thought you couldn't pass.
Neil Degrasse Tyson
And one day you'll wake up and find out how good you actually became, having transcended whatever limits you might have thought you couldn't pass.
Neil Degrasse Tyson
Donequote:
[..]
Mooi geworden zo. Misschien een idee om bij het kopje code posten ook iets te zeggen over jsfiddle/codepen?
Op donderdag 2 juli 2009 22:41 schreef RTB het volgende:
als ik elk rap"liedje" een kans moest geven was ik aan het eind van dit millennium nog bezig met het tempo waarin die kotshoop uitgebraakt wordt.
👾
als ik elk rap"liedje" een kans moest geven was ik aan het eind van dit millennium nog bezig met het tempo waarin die kotshoop uitgebraakt wordt.
👾
quote:
Lekker bezig
Whether or not you can become great at something, you can always become better.
And one day you'll wake up and find out how good you actually became, having transcended whatever limits you might have thought you couldn't pass.
Neil Degrasse Tyson
And one day you'll wake up and find out how good you actually became, having transcended whatever limits you might have thought you couldn't pass.
Neil Degrasse Tyson
| 1 | mstx _O_ |
Op maandag 29 september 2008 11:45 schreef HostiMeister het volgende:
Dat is zeg maar de Nederlandse taal op een vuige keukentafel voorover buigen en hem dan zonder glijmiddel anaal verkrachten. :'(
Dat is zeg maar de Nederlandse taal op een vuige keukentafel voorover buigen en hem dan zonder glijmiddel anaal verkrachten. :'(
Goedemiddag. Ik ben bezig met een klein projectje. Ik heb 2 DIV's over elkaar. hoe kan ik ervoor zorgen dat de bovenste met een knop als een gordijn naar boven gaat zeg maar. (dmv jQuery) Klein zetje in de goede richting om te zoeken is ook goed. 
Kom er even niet uit.
Kom er even niet uit.
Uitvinder van de biersmiley.
http://api.jquery.com/slideup/quote:
Goedemiddag. Ik ben bezig met een klein projectje. Ik heb 2 DIV's over elkaar. hoe kan ik ervoor zorgen dat de bovenste met een knop als een gordijn naar boven gaat zeg maar. (dmv jQuery) Klein zetje in de goede richting om te zoeken is ook goed.
When the student is ready, the teacher will appear.
When the student is truly ready, the teacher will disappear.
When the student is truly ready, the teacher will disappear.
Thnx! Heb HTML/CSS aardig onder de knie. Wil nu graag wat JS erbij doen.quote:
Uitvinder van de biersmiley.
Hello mensen, ik ben druk doende om me HTML en CSS aan te leren, maar nu vraag ik mij iets af. Veel sites zijn tegenwoordig responsive en als je echt serieus wat wilt dan zul je dus ook HTML5 moet kunnen. Kun je daar ook gewoon mee beginnen of moet je echt eerst de oude basis leren, dus gewoon HTML en CSS en pas daarna HTML 5 en CSS3?
Is het weer om te lachen?
Dan is het handig eerst JS te leren, wat jQuery + die plugin met duizenden regels doet kan in dit geval ook met 10 regels.quote:
[..]
Thnx! Heb HTML/CSS aardig onder de knie. Wil nu graag wat JS erbij doen.
HTML5 en CSS3 zijn html en css. Voor responsive heb je in principe niks nodig, wat media-queries en meta tags maken je leven wel makkelijker.quote:Op woensdag 4 maart 2015 18:27 schreef Tshot het volgende:
Hello mensen, ik ben druk doende om me HTML en CSS aan te leren, maar nu vraag ik mij iets af. Veel sites zijn tegenwoordig responsive en als je echt serieus wat wilt dan zul je dus ook HTML5 moet kunnen. Kun je daar ook gewoon mee beginnen of moet je echt eerst de oude basis leren, dus gewoon HTML en CSS en pas daarna HTML 5 en CSS3?
“Specialization is for insects”.—Robert Heinlein
Ik heb ook wel een klein beetje kennis van JS. Maar ben met iets bezig waarvoor jQuery me handig lijkt. Dit zal niet het enige zijn wat ik eruit nodig heb. Spelenderwijs hoop ik met beide straks goed overweg te kunnen.quote:Op woensdag 4 maart 2015 18:32 schreef n8n het volgende:
[..]
Dan is het handig eerst JS te leren, wat jQuery + die plugin met duizenden regels doet kan in dit geval ook met 10 regels.
[..]
HTML5 en CSS3 zijn html en css. Voor responsive heb je in principe niks nodig, wat media-queries en meta tags maken je leven wel makkelijker.
Uitvinder van de biersmiley.
Hm okay, thanks. Was bang dat ik me anders allemaal regels aan ging leren die later weer overbodig bleken te zijn omdat het in HTML5 heel anders gaat. Ik volg nu een boek wat al wel een paar jaar oud is, maar dat kan dus weinig kwaad begrijp ik?quote:
[..]
Dan is het handig eerst JS te leren, wat jQuery + die plugin met duizenden regels doet kan in dit geval ook met 10 regels.
[..]
HTML5 en CSS3 zijn html en css. Voor responsive heb je in principe niks nodig, wat media-queries en meta tags maken je leven wel makkelijker.
Is het weer om te lachen?
Om de basis onder de knie te krijgen kan dat inderdaad geen kwaad. HTML5 is geen andere HTML, het is gewoon een toegevoegde set nieuwe tags die je kunt gebruiken. Zo kun je bijvoorbeeld <header> tags gebruiken in plaats van <div class="header">.quote:
[..]
Hm okay, thanks. Was bang dat ik me anders allemaal regels aan ging leren die later weer overbodig bleken te zijn omdat het in HTML5 heel anders gaat. Ik volg nu een boek wat al wel een paar jaar oud is, maar dat kan dus weinig kwaad begrijp ik?
Daarmee krijg je dus iets overzichtelijkere code. Ook zijn er wat tags bij gekomen op het gebied van multimedia. Maar alles wat je qua HTML al geleerd hebt zal gewoon blijven werken. Zoals n8n al zei, het blijft uiteindelijk allemaal dezelfde HTML.
Het enige wat anders is, is de doctype declaratie. Je kunt nu
| 1 | <!DOCTYPE html> |
| 1 | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> |
Voor CSS3 is het hetzelfde verhaal. Een serie extra elementen om mee te werken maar al het oude blijft gewoon werken zoals het is.
Whether or not you can become great at something, you can always become better.
And one day you'll wake up and find out how good you actually became, having transcended whatever limits you might have thought you couldn't pass.
Neil Degrasse Tyson
And one day you'll wake up and find out how good you actually became, having transcended whatever limits you might have thought you couldn't pass.
Neil Degrasse Tyson
Duidelijk! Kwestie van mezelf die nieuwe elementen eigen maken dus. Nog een vraag als beginneling: nu kopieer ik vaak stukjes HTML die ik dan een beetje aanpas naar mijn eigen wensen, maar hoe doen jullie dit?quote:
[..]
Om de basis onder de knie te krijgen kan dat inderdaad geen kwaad. HTML5 is geen andere HTML, het is gewoon een toegevoegde set nieuwe tags die je kunt gebruiken. Zo kun je bijvoorbeeld <header> tags gebruiken in plaats van <div class="header">.
Daarmee krijg je dus iets overzichtelijkere code. Ook zijn er wat tags bij gekomen op het gebied van multimedia. Maar alles wat je qua HTML al geleerd hebt zal gewoon blijven werken. Zoals n8n al zei, het blijft uiteindelijk allemaal dezelfde HTML.
Het enige wat anders is, is de doctype declaratie. Je kunt nu
[ code verwijderd ]
in plaats van
[ code verwijderd ]
gebruiken.
Voor CSS3 is het hetzelfde verhaal. Een serie extra elementen om mee te werken maar al het oude blijft gewoon werken zoals het is.
Kennen jullie echt ieder element, iedere class etc uit je hoofd en typ je deze ook steeds opnieuw?
Is het weer om te lachen?
Er zijn altijd randzaken die je ff opzoekt. Voor alle tags en wanneer ze te gebruiken: html5doctor.com
Verder heb je het concept design patterns, dat is een min of meer vaste stijl die je overal op toepast.
Verder heb je het concept design patterns, dat is een min of meer vaste stijl die je overal op toepast.
“Specialization is for insects”.—Robert Heinlein
