Categoriearchief: Web Development

Web Development, Webdesign

Vue.js – lichtgewicht framework voor moderne websites

Een reactie plaatsen

De tijd dat een website op een regenachtige zondagmiddag met HTML, CSS en JavaScript in elkaar werd gezet is voorbij. Moderne websites worden tegenwoordig vaak gemaakt met behulp van een framework. Vue.js (of kortweg ‘Vue’) is zo’n lichtgewicht framework voor moderne websites!

Evenals de meer bekende varianten React en Angular, is Vue een framework dat voorziet in alle eisen waaraan een moderne webapplicatie moet voldoen. Denk aan zaken als webcomponenten, databinding, routing, state management en communicatie met het database via http. Het voordeel van Vue is echter dat het een veel eenvoudiger syntaxis en structuur kent dan de andere frameworks. Het is daarom sneller te leren. De Vue-leercurve is een stuk minder steil dan bij Angular of React. Al in enkele dagen kun je als programmeur het raamwerk van een complete, complexe applicatie in elkaar zetten. De Vue-praktijk sluit nauw aan bij wat webdevelopers gewend zijn, maar is eveneens eenvoudig te leren voor ervaren Java- of C#-programmeurs.

Websites in Vue bestaan niet meer uit losse pagina’s, maar uit kleine, gespecialiseerde componenten die tezamen de applicatie vormen. Elke component heeft dezelfde, eenvoudig te begrijpen structuur. Lees verder Vue.js – lichtgewicht framework voor moderne websites →

SEO / SEA, Web Development

Wat is Search Engine Optimization, ofwel wat is SEO?

Een reactie plaatsen

Deze blogpost is geschreven door Marieke van de Rakt, CEO van Yoast en is een vertaling van deze blogpost. Met enige regelmaat zullen er blogposts verschijnen over het belang van goede SEO en de optimalisatie hiervan. Komend najaar verschijnt er een boek over Yoast SEO getiteld ‘Zo werkt Yoast SEO’. Wil je op de hoogte worden gehouden van de verschijningsdatum van dit boek meld je dan HIER aan voor onze nieuwsbrief. Dit is de eerste blogpost in een serie over Search Engine Optimization: Wat is SEO? Bovenstaande illustratie: © Yoast. (H.F.)

Alles gebeurt tegenwoordig online. Daarom heb je misschien besloten om een website voor je bedrijf of organisatie op te zetten, of je om je bestaande website nieuw leven in te blazen. Bij het zoeken naar tips kom je de term ‘SEO’ steeds weer tegen, maar waar staat dat voor? In deze blogpost leggen we uit wat het betekent en hoe je het het beste kunt aanpakken!

Wat is SEO?

SEO staat voor ‘search engine optimization’. Kort gezegd gaat SEO om het optimaliseren van je webpagina’s, met als doel om een hoge positie te verkrijgen in de zoekresultaten van Google of andere zoekmachines. SEO richt zich op het verbeteren van de positie in de organische – oftewel de niet-betaalde – zoekresultaten. Heb je een website en wil je meer bezoekers trekken? Dan moet SEO een onderdeel zijn van je marketingstrategie.

Google’s algoritme

De positie in de zoekresultaten, ook wel de ranking genoemd, wordt bepaald door het algoritme van Google. En hoewel het algoritme van Google geheim is, hebben we door jarenlange ervaring met SEO een redelijk goed beeld van de belangrijke rankingfactoren. De factoren in het algoritme van Google kunnen in onze ogen worden onderverdeeld in twee categorieën: on-page en off-page factoren.

Lees verder Wat is Search Engine Optimization, ofwel wat is SEO? →

Android, Besturingssystemen, Tips & Trucs, Web Development

De 10 meest gestelde vragen over Flutter

Een reactie plaatsen

Als u programmeert in welke taal dan ook of overweegt daarmee te beginnen, dan heeft u vast van Flutter gehoord. Het relatief nieuwe systeem van Google zou het Zwitsers zakmes onder de ontwikkelplatformen moeten worden: geschikt voor elk platform en elk type applicatie. Maar wat is het nu echt? Hieronder vind je de antwoorden op de 10 meest gestelde vragen over Flutter.

1. Wat is Flutter?
Flutter is een systeem voor het ontwikkelen van apps voor meerdere platformen. De apps maak je in de programmeertaal Dart. Je kunt daarbij verschillende programmeeromgevingen gebruiken, zoals Android Studio, IntelliJ IDEA of Visual Studio Code. Ik adviseer Android Studio omdat het gratis is en veel specifieke Flutter-functies biedt.

2. Waarom heet Flutter zo?
In het Nederlands is de naam wat ongelukkig. Medici duiden met het woord een hartritmestoornis aan. De naam begint met ‘flut’. Dat is geen goed begin. Engelstaligen hebben deze associatie niet. To flutter, betekent fladderen, zoals van een vlinder. Wellicht is het een verwijzing naar de hoge snelheid waarmee Flutter het scherm vernieuwt: 60 keer per seconde, even snel als de vleugelslag van veel vlinders.
Lees verder De 10 meest gestelde vragen over Flutter →

Web Development, Webdesign

Toveren met CSS Grid Layout

Een reactie plaatsen

CSS is de opmaaktaal voor websites en -apps. Met de bundel van drie boeken uit de Web Development Library over die onderwerp leer je alle mogelijkheden, waardoor je veel betere websites ontwerpt. In het boek CSS 3 van Doolaard en Kassenaar leer je werken met CSS-selectors, maateenheden, het box-model, kleurmodellen en meer. De vele oefeningen maken het tot een perfect (zelf-)studieboek. Ben je de basis voorbij? In CSS Flexbox & Grid Layout helpt Peter Doolaard je met het maken van lay-outs voor webpagina’s met Flexible Box Layout en CSS Grid Layout. Deze technieken zijn bedoeld om op een intuïtieve manier complete webpagina’s, apps en onderdelen van de gebruikersinterface in te delen. Met het boek Bootstrap 4 van Peter Kassenaar kunnen niet-designers hun websites snel op consistente en eenvoudige manier opmaken, terwijl ‘echte’ designers hun hart kunnen ophalen aan de vele mogelijkheden die het framework biedt om het naar eigen wens in te stellen. Vergroot je CSS-expertise en bestel deze drie boeken samen voor een voordelige prijs. Hieronder vind je een voorbeeld over het werken met CSS: Toveren met CSS Grid layout van de hand van Peter Doolaard.(H.F.)

Toveren met CSS Grid layout

Hoe bouw je met dezelfde HTML-codebasis een website met vier gezichten? Je leest het in dit artikel waarin we de website rollingstone.com namaken. De lay-out van deze website varieert van één tot vier kolommen waarbij de inhoud steeds net even anders wordt gepresenteerd. CSS Grid Layout en de nieuwe optie subgrid zorgen voor de magie.

Lees verder Toveren met CSS Grid Layout →

Web Development

Stop misbruik van je contactformulier

4 reacties

Aan het begin van elke dag liep ik met een plastic zakje om mijn hand door mijn mailbox om alle poep van de spambots op te ruimen. Dat was ik allang zat, maar een hek om mijn mailveldje plaatsen, daar kwam het niet van. Tot ik toevallig iets las over verborgen invoervelden, honingpotten en invultijden. Dat werkt. Ik kan weer met blote handen in mijn inbox graaien. Stop misbruik van je contactformulier! (Foto hierboven: Mathyas op Unsplash.)

Spambots: dol op contactformulieren

Als je na het invullen van mijn contactformulier op verzenden klikt, wordt het verwerkt door een eenvoudig PHP-script. Dat haalt alle velden op, filtert de kwaadaardige code eruit en stuurt vervolgens jouw bericht naar mijn e-mailadres. Helaas zijn spambots dol op contactformulieren. In razend tempo vullen ze elk veld in dat ze tegenkomen en sturen het de wijde wereld in.
Lees verder Stop misbruik van je contactformulier →

Web Development, Webdesign

Handboek JavaScript en jQuery

1 reactie

Het zal niemand in de webdevelopment wereld zijn ontgaan. JavaScript is de laatste jaren in sneltreinvaart geëvolueerd. Lange tijd was het een programmeertaal waarmee je klokjes in de statusbalk van de browser kon tonen of eenvoudige animaties in de pagina plaatste. Maar sinds de komst van jQuery in 2006 werd alles anders.

Voor het eerst werden complexe, cross-browser compatible handelingen mogelijk zoals het selecteren van elementen en er allerlei handelingen mee uitvoeren. Het is niet overdreven om jQuery ‘de redding van JavaScript’ te noemen. jQuery is een bibliotheek die in aanvulling op JavaScript wordt gebruikt.

Populariteit

Ook met de populariteit van frameworks zoals React, Angular en Vue is de rol van ‘gewoon’ JavaScript en jQuery nog lang niet uitgespeeld. JQuery wordt meegeleverd met de standaardinstallaties van WordPress (35% van álle honderden miljoenen websites ter wereld draait op WordPress), andere content management systemen, wordt aanwezig veronderstelt in de populaire CSS-bibliotheek Bootstrap en wordt in het onderwijs gebruikt om snel interactiviteit aan webpagina’s toe te voegen. JQuery is meegegroeid met deze ontwikkelingen. Oude opdrachten verdwenen uit de bibliotheek, nieuwe opdrachten zijn toegevoegd.

De laatste jaren zijn er echter ook wijzigingen doorgevoerd in de taal JavaScript zelf. De manier om variabelen te declareren met var werd vervangen door const en let. Er zijn nieuwe manieren om functies te definiëren en bijvoorbeeld communicatie met een achterliggende API en database zijn nu rechtstreeks vanuit JavaScript mogelijk met de opdracht .fetch().
Lees verder Handboek JavaScript en jQuery →

Web Development, Web- & UX-design

Programmeren voor het web: alles over JavaScript

6 reacties

Of je nu net van school komt of al jaren meedraait in de webdevelopercultuur, het zal je niet verbazen dat je continu nieuwe dingen moet blijven leren om je kennis up-to-date te houden. Het is niet meer voldoende om een eenvoudige website te kunnen maken met HTML en CSS. Werkgevers vragen ook om interactiviteit in die website. En dan is JavaScript je enige keuze!  Wil je nu alles over JavaScript leren? Dan is er een bundel van drie boeken over JavaScript die je nu voor een speciale bundelprijs kunt aanschaffen! De boeken JavaScript, EcmaScript en TypeScript, en Node.js schaf je nu samen aan voor €49,99, een korting van bijna €38,-!
(Foto hierboven: Irvan Smith on Unsplash.)

Als backend programmeur kun je kiezen uit tal van programmeertalen en technieken: Java, .NET, PHP, Python, of talloze andere. In de wereld van frontend webdevelopment heb je eigenlijk maar één keuze: JavaScript. Immers, dat is de enige programmeertaal die de browser begrijpt. Maar het JavaScript-landschap is de laatste jaren enorm uitgebreid. Er zijn letterlijk honderden bibliotheken en frameworks beschikbaar. Waar moet je beginnen? Als je googelt op ‘JavaScript’ vindt je miljoenen pagina’s met informatie. Zelfs als je het trefwoord ‘beginnners’ of ‘tutorial’ er aan toevoegt, blijven er nog tienduizenden hits over.
Lees verder Programmeren voor het web: alles over JavaScript →

Fotografie, MS Office, Photoshop, Web Development

Leuke boeken in de aanbieding bij Van Duuren Media

Een reactie plaatsen

Zwarte vrijdag (Black Friday) lijkt eigenlijk meer op zwarte spamdag. Al die mailtjes die in mijn mailbox verschijnen… Waarom worden die er niet uitgefilterd door mijn fijnmazige spamfilter? Het zijn vaak aanbiedingen die mooier lijken dan ze zijn en er zijn zoveel aanbiedingen, dat je door de bomen het bos niet ziet. Maar er zijn wél leuke boeken in de Black Friday-aanbieding bij Van Duuren Media: tot en met 4 december een 30-tal boeken voor een tientje per stuk!

Échte kortingen, daar heb je op Black Friday en omstreken behoefte aan. Black Friday valt al lang niet meer alleen op de laatste vrijdag van november. De meeste aanbiedingen kun je al kopen vanaf begin deze week. Zo ook de boeken van Van Duuren Media die als Black Friday-aanbiedingen vanaf nu tot en met 4 december te koop zijn. Het gaat bij deze aanbiedingen om 10 boeken op het gebied van fotografie en 17 boeken op het gebied van ‘informatica’. Lees verder Leuke boeken in de aanbieding bij Van Duuren Media →

Informatica, Web Development

Maak zelf een HSL-kleurkiezer in HTML en CSS (3)

Een reactie plaatsen

Handboek HTML 5 en CSS3Het boek van de maand oktober is Handboek HTML5 en CSS3, 5de editie van Peter Doolaard. Deze maand bespreken we het boek, geven we op dit blog wat voorproefjes uit het boek. Dit is deel 3 uit een serie over het maken van een HSL-kleurenkiezer met HTML, CSS en wat JavaScript. Deel 1 vind je HIER, deel 2 vind je HIER. De site die bij het boek hoort vind je HIER. (H.F.)

Tijd voor het vervolg van een serie over het maken van je eigen HSL-kleurkiezer. In deel 2 is met hulp van het schaduw-DOM de basisopmaak voor de regelaars ingesteld en kreeg de tintregelaar een kleurverloop volgens het HSL-systeem. Die kleur is niet meer dan een achtergrond. De werkelijke waarde komt uit het attribuut value. Hetzelfde geldt voor de andere regelaars. Met JavaScript kunnen we die waarden lezen en verwerken tot een CSS-kleurdeclaratie of de inhoud van een tekstveld. Lees verder Maak zelf een HSL-kleurkiezer in HTML en CSS (3) →

Boekbesprekingen, Web Development, Webdesign

De pijlers van het digitale web – HTML5 en CSS3 – op papier

Een reactie plaatsen

Als je serieus aan de slag wilt gaan met het technisch bouwen van websites, dan is kennis van HTML5 en CSS3 en JavaScript onontbeerlijk.

Nu kan je de technieken voor HTML en CSS op heel veel digitale manieren leren; er zijn zát online tutorials en trainingen ! Maar het gros daarvan is in het Engels. Voor velen is dat misschien geen groot probleem (web-technieken zijn immers volledig Engelstalig georiënteerd). Maar er zijn ook veel mensen die het wel zo prettig vinden als een en ander op zijn minst in het Nederlands wordt beschreven en uitgelegd !

cover boek html css doolaardDe 5eeditie van het boek “HTML5 en CSS3” van Peter Doolaard voorziet daar uitstekend in. Lees die éérst, dan kan je daarna alles gaan nakijken en uitdiepen in allerlei handige online overzichten en hulpmiddelen.

Even wat achtergrond-informatie: anno 2019 bestaat het web 30 jaar. De eerste tien jaren waren woest en wild. Als gevolg daarvan heerste in het tweede decennium vooral moedeloosheid bij de grondleggers. Maar dankzij een hoognodige grondige ommezwaai (HTML5) is het web uit een diep dal gekrabbeld en floreert het nu als nooit tevoren. Lees verder De pijlers van het digitale web – HTML5 en CSS3 – op papier →