Het 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 en praten we met Peter Doolaard over de ontwikkelingen van HTML5 en CSS3. Dit is deel 1 uit een serie over het maken van een HSL-kleurenkiezer met HTML, CSS en wat JavaScript. De site die bij het boek hoort vind je HIER. (H.F.)
Er bestaan allerlei hulpmiddelen om de CSS-code van een RGB- of HSL-kleur te bepalen, maar zelf iets bouwen is een perfect oefenproject. In een serie korte artikelen lees je hoe je zelf een kleurkiezer voor HSL maakt met HTML, CSS en een beetje JavaScript. Dit is deel 1: de interface (UI).
Het boek van de maand oktober is Handboek HTML5 en CSS3, 5de editie van Peter Doolaard. Van alle technieken voor het maken van webpagina’s en webapps zijn HTML en CSS de belangrijkste. Zonder HTML geen webpagina’s en zonder CSS blijft het een kale boel. In deze vijfde, bijgewerkte editie van dit handboek leer je omgaan met beide webtalen. Je leert eerst hoe je de content markeert met HTML zodat de paginastructuur klopt. Daarna maak je de onderdelen van de pagina op met CSS. Het uitgangspunt daarbij is dat je niet alleen leert dát dingen werken, maar vooral waaróm ze werken. Deze maand bespreken we het boek, geven we op dit blog wat voorproefjes uit het boek en praten we met Peter Doolaard over de ontwikkelingen van HTML5 en CSS3.
Ooit, lang geleden, dacht ik dat de computers ons mensen zouden bevrijden van allerlei domme routineklussen. Met een beetje slim programmeren kon je werkelijk van alles bereiken en echte programmeurs waren nog veel beter dan ik, verdwaalde biologiestudent, was. Dat was de tijd dat ik programmaredacteur werd van MSX Computer Magazine – en voor wie van na die tijd is, MSX was één van de homecomputers waarop de eerste golf computeraars het allemaal geleerd heeft.
Voor de pc verscheen, lang voordat Internet in beeld kwam maakten we acht keer per jaar een blaadje dat voor zowat een derde vol stond met zogenaamde listings. Basic programma’s om zelf in te tikken. En wie dat te veel werk vond kon bij ons de cassettes bestellen met daarop die programmaatjes. Inderdaad, audiocassettes, met daarop in hoorbare tonen die listings gecodeerd. Diskettes kwamen pas later. Lees verder Webformulier→
Sinds WordPress 5 is het de bedoeling dat je aan de gang gaat met de visuele editor Gutenberg. Hier – bij Computer Creatief – gebruiken we nog steeds de Klassieke Editor. Ik heb Gutenberg uitgezet en de plug-in voor de Klassieke Editor geïnstalleerd en geactiveerd. Als jarenlange WordPress-gebruiker vind ik Gutenberg op dit moment een storende factor in de workflow van het blog. Wat moet je in WordPress gebruiken: Gutenberg of de Klassieke Editor?
Via Google Docs
Naar WordPress sturen vanuit Google Docs via WordPress.com for Google Docs.
De werkwijze bij het blog (bij mij en bij de stukken van andere auteurs die aan mij aanleveren via Word) is alsvolgt. Ik bereid de blogposts voor in Google Docs. Ik schrijf zelf in Google Docs en deel de tekst altijd met mijn vrouw die de tekst naleest op onbegrijpelijke onzin, dubbele woorden enzovoort. De Word-bestanden van andere auteurs, de voorbeelden uit boeken die we plaatsen, kopieer ik ook naar Google Docs-documenten. In Google Docs gebruik ik een Add-on, een uitbreiding, waarmee ik rechtstreeks naar het blog kan publiceren: WordPress.com for Google Docs. Als de tekst, inclusief, titel, tussenkoppen en dergelijke klaar is, kies ik voor de Add-on, voeg nog steeds in Google Docs de WordPress-categorieën en tags toe, en kies voor Save. Lees verder WordPress: Gutenberg of de Klassieke Editor?→
Het is deze maand de maand van WordPress bij Computer Creatief. En tot nu toe hebben we het eigenlijk alleen over de techniek gehad, maar hoe zit het met de inhoud…?
Je kunt nog zo’n mooie WordPress-site hebben opgezet en alle trucs uit het boek van de maand hebben ingezet: als dat wat op je site staat niet interessant is houdt het op. Kortom: bedenk – met name als je een meer klassieke blog wilt opzetten – wat je wilt delen met de wereld. Het is de vraag of de wereld momenteel echt heel erg geïnteresseerd is hoe jou kids opgroeien, en dat Mientje vandaag de eerste meters zelfstandig gefietst heeft. Begrijp ons niet verkeerd: dat kan dan weer wél interessant zijn als je je blog specifiek op al dan niet verre familie en vrienden richt. In dat geval is het verstandig om de hele blog met een stevig wachtwoord te beveiligen zodat ook echt alleen die familie en vrienden van jouw privé-leven kunnen genieten. Een blog kan ook een aanvullende dienst zijn op een bedrijf dat je runt. ‘Storytelling’ ofwel het verhaal achter je bedrijf is een hot item in marketingland. En niet voor niets, want het geeft zelfs het meest complexe bedrijf een menselijk gezicht. Wat gebeurt er achter de schermen? Hoe wordt een product gemaakt? Zet eens een medewerker in het zonnetje. Foto’s van een bedrijfsuitje. Dat soort dingen doen het heel goed.
Luister elke maand naar een nieuwe aflevering van Upgrade, de podcast van ComputerCreatief. Deze maand praat Peter de Ruiter met Dirkjan van Ittersum, schrijver van Het Handboek WordPress 5 over de mogelijkheden van deze laatste versie van WordPress, de software om sites en blogs mee te bouwen, te onderhouden en te vullen.
Internet is een van onze eerste levensbehoeften geworden en als je er niet aanwezig bent, besta je niet. Een hockeyvereniging, een fysiotherapeut of een bedrijf van welke omvang dan ook kan niet meer zonder website. Gelukkig ligt het antwoord voor het grijpen: WordPress. Dit systeem voor het bouwen en onderhouden van websites heeft inmiddels een marktaandeel van vijftig procent veroverd. Het is in de basis gratis en kent onnoemelijk veel uitbreidingsmogelijkheden: voor tekst, beeld, geluid en winkelen. Je bouwt er zelfs je eigen Facebook mee. Lees verder De Upgrade-podcast: maak een website met WordPress→
In de hele wereld maar vooral in IT-sferen is men verzot op afkortingen. Het geeft een gevoel van incrowd versus mystiek, voor hen die wèl of níet weten waar een afkorting voor staat. Zo ook bij UX-design. Het begint immers al met die ‘UX’ (User Experience), dat valt mee. Maar al snel kom je afkortingen tegen zoals MVP, MLF, NUF en MoSCoW. Je denkt dan: wat is hier aan de hand, wat mis ik ?
Bij alles wat we maken en wat anderen hopelijk gaan gebruiken – of het nou fysieke producten of digitale diensten zijn – vraag je je af: welke functies en opties moet mijn creatie gaan bieden ? Welke zijn daarbij cruciaal of optioneel ? Waarmee moet ik beginnen ? Om die afwegingen te maken, ga je nadenken of onderzoeken wat een gebruiker blijkbaar hard nodig heeft of kennelijk verwacht. In die fasen komen dergelijke afkortingen boven water.
MVP
Zo staat MVP voor Minimal Viable Product, oftewel ‘wat moet er minstens in zitten om een bruikbare website of app te zijn ?’ Dus zonder een goede uitwerking van die ene functie heeft het hele idee gewoon geen zin. Je zou denken dat zoiets niet voorkomt, maar er zijn voorbeelden genoeg: een mes dat niet kan snijden, een handdoek-haakje waar niets aan blijft haken, een citroen-stampertje dat niet kan stampen. Lees verder Afkortingen: Van MVP via MoSCoW en NUF naar MLF→
Deze maand besteden we extra aandacht aan WordPress én het Handboek WordPress 5. We praten (weer) met schrijver Dirkjan van Ittersum. Deze keer over de vernieuwingen in WordPress 5 en de mogelijkheden van WordPress. We laten je kennis maken met het boek door wat voorproefjes uit het boek op dit WordPress-blog (Computer Creatief) te plaatsen. Daarnaast vertellen we over onze eigen ervaringen met WordPress. Dit voorproefje behandelt het werkend krijgen van Akismet, de plug-in die je tegen reactiespam kan beschermen. Eerdere voorproefjes (over het maken van een blogpost met Gutenberg vind je HIER en HIER. (H.F.)
Meegeleverde plug-ins
WordPress wordt standaard geleverd met twee plug-ins: Hello Dolly en Akismet. De eerste is een tikje nutteloos, maar de tweede is erg belangrijk. Geen reactiespam met Akismet.
Geen reactiespam met Akismet
De plug-in Akismet is wel nuttig. U bent ermee beschermd tegen spammers die de reactiemogelijk op de site misbruiken om hun berichten over blauwe pillen of andere ongein te plaatsen. Het in gebruik nemen van de plug-in is wel even een werkje, maar met dit stappenplan moet het lukken:
1. De eerste stap begint – uiteraard – met het activeren van de plug-in. In het scherm met geïnstalleerde plug-ins vindt u de link Activeren direct onder de naam van de plug-in. De plug-in is weliswaar geactiveerd, maar u moet nog een Akismet-account hebben om daadwerkelijk spam tegen te houden.
De plug-in is geactiveerd, maar u moet nog een account aanmaken bij Akismet.
2. Een klik op de grote knop met de tekst Akismet account activeren leidt u naar een pagina waar u kunt kiezen tussen het verkrijgen van een nieuwe Akismet-sleutel of het invullen van een sleutel – mocht u die al hebben. Van dat laatste gaan we niet uit, dus u kiest voor de eerste optie Je APIsleutel verkrijgen. U wordt geleid naar een pagina van Akismet, waar opnieuw een link u uitnodigt om een Akismet API key te verkrijgen.
Een Akismet-sleutel verkrijgt u op de site van Akismet zelf.
3. Een klik op die link leidt naar een pagina waar u zich kunt aanmelden met uw e-mailadres, gebruikersnaam en wachtwoord.
4. Kies op de volgende pagina Personal bij een persoonlijke site of Get plus bij een zakelijke site. Wij kiezen hier Personal.
5. Een pagina verder wordt u gevraagd hoeveel u over hebt voor de antispammaatregelen van Askimet. Wanneer u de dienst alleen maar wilt proberen, is nul euro een prima bedrag. Zet het schuifje helemaal naar links en klik Continue. Als u de dienst vaak gebruikt, is het betalen van een bedrag zeker het overwegen waard.
6. Op de volgende pagina verschijnt de API-sleutel. Kopieer de code en keer terug naar uw WordPress-site.
Voer de API-sleutel in op uw WordPress-site.
7. Plak de code in het vakje (zie afbeelding 8.14) en klik op Verbinden met API-sleutel.
8. De site is beschermd. Pas op deze pagina zo nodig nog instellingen aan.
Operatie geslaagd: uw site wordt beschermd door een werkende Akismet-sleutel.
In de webwereld is het frontend vakgebied een hot topic. Steeds meer bedrijven en organisaties kiezen ervoor hun frontend gescheiden te ontwikkelen van het backend. Zo kan het backend zich concentreren op authenticatie, API’s en datavoorziening, terwijl het frontend kan profiteren van compacte en lichtgewicht webapplicaties die op elke device draaien. Vaak wordt gekozen voor Angular of React als frontend framework, om niet telkens het wiel opnieuw te hoeven uitvinden. Maar sinds enige tijd is ook Vue.js een steeds vaker gekozen alternatief.
De vue-homepage..
Vue.js is evenals React en Angular een frontend framework. Dit betekent dat in één geïntegreerde omgeving wordt voorzien in alle eisen waaraan een moderne webapplicatie moet voldoen. Denk aan zaken als webcomponenten, databinding, routing, state management en communicatie met het backend via http. Het gebruik van losse bibliotheken zoals jQuery, knockout, mobx (voor state management) en andere is vaak niet meer nodig. Alles is al beschikbaar in het framework. Het ene framework biedt out-of-the-box iets meer (Angular), het andere framework iets minder (React), maar daar staat dan weer meer keuzevrijheid tegenover. Vue.js biedt wat dat betreft een tussenweg. Er zijn standaard bibliotheken voor routing en state management, maar het is niet verplicht ze te gebruiken. Lees verder Vue.js – het nieuwe JavaScript-framework→
Het Computer Creatief-blog draait op WordPress. Waarom? Omdat het zo makkelijk op te zetten is. Het is eenvoudig zelf te installeren – zeker met behulp van het Handboek WordPress 5 – en anders kan je provider/hoster je meestal wel helpen met het installeren van WordPress. De basis van WordPress staat dan voor je klaar. Het is nu aan jezelf om het niet al te ingewikkeld te maken en de boel veilig op slot te zetten voor de hackers uit de buitenwereld. Hoe kun je een WordPress-blog beveiligen?
WordPress-blog beveiligen
Als je een kale installatie hebt van WordPress dan ben je er nog eigenlijk niet. Het is van belang dat je een veilige installatie hebt. Vanmorgen zag ik in het Activiteitenlog van dit blog dat er door drie onbekenden pogingen waren gedaan om in te loggen. Die pogingen mislukten omdat de boel bij ComputerCreatief goed dichtgetimmerd is. Daarvoor moet je eigenlijk twee belangrijke onderdelen aanpassen: je inlognaam en wachtwoord en zorgen dat de aanvallers na een paar pogingen om in te loggen worden buitengesloten. Lees verder Een WordPress-blog beveiligen→
Het 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 en praten we met Peter Doolaard over de ontwikkelingen van HTML5 en CSS3. Dit is deel 1 uit een serie over het maken van een HSL-kleurenkiezer met HTML, CSS en wat JavaScript. De site die bij het boek hoort vind je HIER. (H.F.)
