Een website maken - De complete gids

Door Wim Bals

⎯ Naast een artistieke opleiding heb ik ook een opleiding als grafisch vormgever gehad. Het is vooral vanuit die kennis dat ik dit artikel ‘Een website maken’ schrijf.

Vroeger gaf je een catalogus of brochure als kunstenaar, intussen heb je een website als je visitekaartje.
Geef daarom jouw website de nodige aandacht, het is vaak het eerste contact met een potentiële klant.

Als kunstenaar en grafisch vormgever heb ik hier behoorlijk wat research naar gedaan.
Ben je kunstschilder, beeldhouwer, fotograaf, graficus of ben je in een andere artistieke discipline actief?
Dan denk ik dat dit artikel erg nuttig voor je kan zijn.

Uiteraard zal het ook van pas komen wanneer je start met het bouwen van een website in een andere branche.

Graag wou ik mijn visie en kennis met je delen wat de mogelijkheden zijn op gebied van websites. Ik heb het in deze blogpost voornamelijk over websites voor kunstenaars maar deze info kan je net zo goed toepassen voor andere vakgebieden.

Wim Bals Auteur
Kunstenaar en Grafisch Ontwerper

Niet alleen duik ik in het financiële aspect maar kom je ook meer te weten over het technische en esthetische aspect van een website.

Intussen wordt er heel veel aandacht besteed aan Instagram-influencers en Facebook. Heb je dus eigenlijk nog wel een website nodig als kunstenaar?

Facebook en Instagram zijn sociale platformen die vanaf elk moment hun logaritmes kunnen veranderen.
Deze platformen komen en gaan, denk bijvoorbeeld aan Myspace, Deviantart…

Je hebt dus absoluut nog een website nodig.

Op deze pagina

1. Domeinnaam
2. Hosting
3. Software of online editor kiezen
4. Online website builder
5. Wordpress - CMS
6. HTML zelf schrijven
7. Inhoud van de website
8. Begin met bloggen
9. Starten met onlineshop
10. Professionele afbeeldingen
11. SEO Zoekmachineoptimalisatie
12. Inspiratie
13. HTTPS
14. Ontwerp van de website
15. Updaten

De juiste domeinnaam kiezen

Dit is het adres dat je intikt in de browser (Chrome, Firefox, Safari…) zoals www.wimbals.com.

Kies je domeinnaam met daarin jouw naam

Een domeinnaam dien je te registreren bij een registrar (hostingbedrijf) naar keuze en betaal je per jaar.
Dit is op zich niet zo duur en zit meestal al in een hostingpakket inbegrepen.

Hosting voor de website

Jouw website moet voor iedereen toegankelijk zijn.
Simpelweg staat jouw website op een computer (server) die 24/24 in verbinding staat met het internet. Zo kan iedereen jouw website bekijken.

Je betaalt de hosting of webruimte per jaar bij een hostingbedrijf. Hoeveel webruimte je juist nodig hebt hangt af van de grootte van jouw website.
Als je veel afbeeldingen gebruikt heb je uiteraard meer ruimte nodig.

Om jouw website online te zetten heb je webhosting nodig

Er zit behoorlijk wat verschil in de prijzen van de verschillende modules 'webhosting' die deze bedrijven aanbieden.
Vaak nemen mensen een te groot hostingpakket waarvan ze slechts een deel gebruiken. Je kan beter iets kleiner beginnen en nadien upgraden naar een groter (duurder) hostingpakket mocht je dat nodig hebben.

Programma of online editor om jouw website te bouwen

Een brief maak je in Microsoft Word, Google Docs, Libreoffice, Kladblok...
Voor jouw website heb je dus ook een programma nodig.
Ruwweg zijn er drie mogelijkheden om van start te gaan.

Online website builder

Om naar analogie verder te gaan zoals je een brief opstelt in Google Docs, wat in feite ook een online programma is, heb je ook software dat op hetzelfde systeem werkt om jouw website te maken.

Je bouwt je website dus online via je PC.

Squarespace laat je kiezen tussen mooie staaltjes van webdesign

Uploaden van jouw bestanden kan je makkelijk via cPanel op jouw webruimte. Ook hier kan je op Youtube filmpjes bekijken hoe dit in zijn werk gaat.

Squarespace, Wix en Weebly zijn de voornaamste spelers in dit segment. Het zou me te ver leiden om alle onderlinge verschillen bloot te leggen maar hun werkwijze is vrij identiek. Simpel gezegd lijkt het een beetje op online een fotoboek samenstellen. Jij kiest de foto’s en tekst en gaat ze in het ontwerp van deze systemen uploaden.

Ook Google springt op deze kar met platform Google Sites. Op zich is dit systeem van Google niet verkeerd om je website te bouwen. Zo kan je uiteraard goed gebruik maken van de integratiemogelijkheden die Google Drive te bieden heeft.

Google Sites is helaas wel (te) beperkt in de layout mogelijkheden en meer gesofisticeerde aanpassingen zoals metatags en dergelijke.
Toch zijn er de binnen de beperkte functionaliteiten toch wel wat mogelijkheden, bekijk de website inspirerende kunst als voorbeeld.

Een voorbeeld gemaakt met Google sites

Als je voor een online website builder kiest heb je geen, of uiterst weinig, kennis van html nodig. Kan je een post op Facebook plaatsen en een e-mail sturen, dan is deze optie voor jou de beste keuze.

In de betalende pakketten zit meestal de domeinnaam, webhosting en online editor inbegrepen. Bij de gratis formule dien je vaak zelf nog een domeinnaam te registreren. Anders heb je bijvoorbeeld een domeinnaam zoals jouwnaam.wix.com.
Uiteraard ziet dat er niet erg professioneel uit en wil je jouwnaam.com .

Richtprijs per jaar

Van 0 (met reclame, of Google Sites) tot € 400 per jaar (= € 4.000/10 jaar!)
Domeinnaam, webhosting en online tool om je website te updaten.

Voordelen

❖ Geen of weinig html-kennis nodig
❖ Kant-en-klare layouts
❖ De firma's houden een backup voor je bij

Nadelen

❖ Weinig of geen invloed in de layout en broncode.
❖ Kan prijzig worden als je veel pagina’s hebt (Squarespace).
❖ Door de ‘Patriot-act’ hebben Amerikaanse instanties toegang tot al jouw gegevens.
❖ Je bent toch behoorlijk wat tijd kwijt om alles in te stellen

Content Management systemen zoals Wordpress

Wordpress is in de eerste plaats eigenlijk een blogsysteem dat gebruikt wordt om websites mee te bouwen.

34% van de websites op het internet draait op dit platform. Met andere woorden een heel populaire manier om jouw site te beheren.
Door deze enorme populariteit ligt hier uiteraard ook het zwakke punt. Veel hackers viseren vooral Wordpress websites en zoeken hierin naar veiligheidslekken.

Hoe werkt het?

Op jouw hostingpakket dien je de Wordpress-module in te schakelen. Dit is op zich vrij gemakkelijk. Er bestaan enorm veel Youtube video's met een stap-voor-stap handleiding.

Wordpress is open-source en gratis te gebruiken. Wel kan het zijn dat je voor bepaalde website templates moet betalen. De prijzen zijn vaak nog redelijk.

Als alternatief gebruiken webdesigners ook wel Silverstripe of Joomla.

Een ander verhaal wordt het als je jouw Wordpress website ‘à la carte’ laat maken door een webdesigner. Je hebt dan uiteraard meer controle over de ‘feel and look’ van je website.

Vaak worden Wordpress websites traag door de ellenlange code die ze gebruikt. Meestal komt dit door plugins die gebruikers installeren waardoor de website behoorlijk log kan worden.

Wordpress gids 'Kickstart WordPress' door Robbert Ravensbergen

Kickstart WordPress is het best verkopende Nederlandstalige boek over Wordpress.

Wordpress kan je perfect onder de knie krijgen met een goede handleiding.
Het voordeel van zo'n handleiding is dat je een complete Nederlandstalige handleiding binnen bereik hebt.

Plugins zijn een belangrijk voordeel als je met Wordpress werkt. Heel veel firma's zoals Mailchimp, Woocommerce, Yoast SEO... bieden allemaal een mogelijkheid om te integreren in Wordpress via een plugin.

Het is jammer genoeg niet altijd rozegeur en maneschijn...
Wordpresssystemen kunnen gevoelig zijn als doelwit voor hackers. Door de enorme populariteit van Wordpress en de miljoenen gebruikers wereldwijd is het geliefkoosd om hierop aan te vallen. Vaak zoeken hackers veiligheidslekken bij de talrijke plugins die niet worden bijgewerkt door de ontwikkelaars en/of gebruikers.

Richtprijs

€ 50/jaar tot € 5.000 (ontwerpkosten) + € 120/jaar
Zoals je kan zien is het verschil tussen een standaard template of volledig maatwerk heel verschillend.

Voordelen

❖ Relatief eenvoudig systeem
❖ Geen of weinig html-kennis nodig
❖ Enorme keuze aan plugins
❖ Gratis templates
❖ Integratie met online shopping modules
❖ Responsive layout (mobielvriendelijk

Nadelen

❖ Gevoelig voor hackers
❖ Door de verschillende updates kunnen plugins niet naar behoren werken
❖ Kan traag worden door de talrijke plugins
❖ Maatwerk kan duur zijn
❖ Je bent zelf verantwoordelijk voor de backup van je website

macbook html
Maak je website met HTML en CSS

Barebone HTML - zelf code schrijven

Wat je zelf doet doe je meestal beter…

Via deze optie schrijf je de code dus helemaal zelf.
Je bouwt dus je website eerst op je PC thuis en plaats die nadien op jouw aangekochte webruimte (hosting).

Veel mensen laten zich afschrikken door de op het eerste zicht moeilijke html-code. Uiteraard kan je eenvoudig beginnen en nadien stap-voor-stap je kennis uitbreiden.

Op deze manier ben jij volledig verantwoordelijk voor het ontwerp, de ontwikkeling/uitvoering en het onderhoud van jouw site.

Je hebt complete controle over het uitzicht en gedrag van de website

Ik maak mijn website zelf op deze manier en kan me enorm uitleven op zowel creatief als technisch vlak. De voldoening die je uit het zelf programmeren haalt kan je niet beschrijven!

Code schrijven in Brackets gaat een stuk sneller dan in kladblok

Je kan de meest spectaculaire website maken met een gratis programma zoals bijvoorbeeld Kladblok. Ik kan je echter het gratis Atom of Brackets aanraden als je deze weg wil gaan om je website te bouwen, dit gaat stukken sneller dan bijvoorbeeld Kladblok.

pagespeed-insights
Door onder andere een 'schone' broncode scoort www.wimbals.com 100% in Google Pagespeed Insights

Door jouw code volledig zelf te schrijven heb je volledige controle wat er met jouw website gebeurt. Overbodige code zet je er dus niet in waardoor jouw site supersnel kan zijn. Op deze manier geef je de gebruiker wat die graag heeft, een site die snel laadt op desktop, tablet en mobiel!

Youtube biedt veel instructiefilmpjes die tonen hoe je op deze manier eenvoudig van start kan gaan. Let op, er zit dus wel een leercurve aan te komen als je deze weg in wil.

Een belangrijk voordeel is dat je supersnel kan ingrijpen in de manier waarop jouw site op het scherm komt. Of wanneer Google plots beslist om zijn algoritmes aan te passen, ook dan kan je kort op de bal spelen.

Dit is dus een enorm voordeel tegenover een Wordpress of Squarespace website waarvan je toch altijd afhangt van een bedrijf of community die al of niet beslissen of zij veranderingen doorvoeren.

Heb je geen zin om vanaf nul te beginnen?

Dan kan je bijvoorbeeld een gratis template downloaden en zelf de kleuren, vorm en inhoud aanpassen.
Uiteraard heb je dan al wat basiskennis van HTML.

Prachtige gratis voorbeelden kan je vinden en downloaden via HTML5up. Op deze manier hoef je je niet bezig te houden met het technische aspect. Je vult gewoon de inhoud aan en upload ze naar jouw webruimte. Best of both worlds!

HTML5up biedt schitterende templates die je gratis kan gebruiken mits naamsvermelding

Uploaden van jouw bestanden kan je makkelijk via cPanel op jouw webruimte. Ook hier kan je op Youtube filmpjes bekijken hoe dit in zijn werk gaat.

Richtprijs

Ongeveer € 50/jaar (domeinnaam en webhosting)

Voordelen

❖ (Spot)goedkoop
❖ Snel aanpasbaar
❖ Website kan razendsnel zijn
❖ Mobielvriendelijk mits de nodige kennis
❖ De meest uitgebreide websites zijn mogelijk met gratis programma’s

Nadelen

❖ Html-kennis is noodzakelijk
❖ Kan arbeidsintensief zijn
❖ Zelf verantwoordelijk voor eventuele fouten
❖ Je bent zelf verantwoordelijk voor de backup van je website

Wat plaats je op je startende website?

Tot hiertoe kwam vooral het technische aspect van een website bouwen aan bod.
Het is dus de hoogste tijd om jouw online portfolio van content (inhoud) te voorzien.

Eerst en vooral plaats je jouw naam op elke pagina.
Dit klinkt misschien voor de hand liggend maar vaak wordt de vergissing gemaakt om enkel een signatuur of logo linksboven op de pagina te plaatsen. Een foute keuze, zeker in het licht van zoekmachine optimalisatie.

De belangrijke contactpagina

Een contactpagina heb je uiteraard ook nodig. Complete gegevens zoals adres, e-mailadres en telefoonnummer zijn essentieel om te vermelden. Het is een kwestie van vertrouwen te scheppen naar je klanten toe.

Ben je (semi-)professioneel vergeet dan ook niet jouw BTW-nummer te vermelden. In België is dit trouwens verplicht om mee te delen.

Op de contactpagina kan je ook de social-media links plaatsen. Plaats deze links zeker niet op jouw keuzemenu. Daardoor jaag je je bezoeker gelijk weg van je site!
Vergeet ook zeker geen call-to-action knop toe te voegen. Hierdoor ontvang je de e-mail gegevens van je lezer.
Een call-to-action kan bijvoorbeeld een formulier zijn waar de bezoeker zich kan inschrijven voor een nieuwsbrief.
Of kan bijvoorbeeld een 'giveaway' zijn zoals een catalogus in pdf-formaat.

Vergeet je blog niet!

Naast de kunstwerken die je toont is het ook belangrijk om een blog bij te houden.
Zo krijgen de bezoekers, en mogelijke kopers, meer inzicht in jouw werk en wat je motiveert.

Het niet te onderschatten voordeel is ook nog dat Google je dankbaar zal zijn met de inhoud die je voorziet.
Bepaalde trefwoorden zullen hierdoor naar jouw website verwijzen waardoor je weer meer bezoekers krijgt.

Hoe meer ‘eyeballs’ op jouw kunst, hoe groter de mogelijkheden dat er werk van je aangekocht wordt.

Wordpress biedt hier als websitebuilder de uitkomst omdat het oorspronkelijk opgestart was als programma waarmee je blogs maakte.

Starten met een online shop?

Wanneer je als kunstenaar samen met galeries werkt is het op zich moeilijk om een werkelijke online shop in je website te integreren.
Stel dat een bepaald schilderij zich in een galerie bevindt maar ook op jouw website in de online shop. Het schilderij wordt aangekocht op de site maar is zopas verkocht in de galerie… Dan heb je pas een probleem.

Je kan dit eventueel oplossen met enkel de werken in de online shop te plaatsen die je in je atelier hebt. De keuze blijft bij jou als kunstenaar in dit geval.

Prijs van een kunstwerk

Toon de prijzen van je kunstwerken

Heb je al eens een restaurant binnen gegaan waar er geen prijzen op kaart staan?
Je eerste gedacht is dan heel waarschijnlijk: dit is veel te duur voor mij... Het is dus zeker raadzaam om je prijzen van de schilderijen te tonen via de website. Op die manier beantwoord je al de vraag die de bezoeker heeft.

Lees zeker volgend artikel als je hier meer over wil weten: prijzen op de website.

Professionele afbeeldingen maken je website een lust voor het oog

Zorg steeds voor professionele foto’s van je kunstwerken op de website. Foto’s met verkeerde kleurtemperatuur, niet goed bijgesneden, te zware bestanden etc. komen heel amateuristisch over.

Zorg steeds voor professionele foto's van je schilderijen

Ben je zelf niet in de mogelijkheid om goede foto’s te nemen laat dan een fotograaf dit klusje voor je klaren. je bespaart je eigen er heel wat tijd en kopzorgen mee.

Zorg ook steeds voor een mooie, en actuele, foto van jezelf die je kan plaatsen bij je biografie. Mensen zien graag het gezicht achter het ‘product’.

SEO - 3 letters die Google als muziek in de oren klinkt

Search engine optimization (SEO), zoekmachineoptimalisatie in het Nederlands, is het optimaliseren van een website door het bijsturen van techniek, content en autoriteit om hoger in de zoekresultaten, van onder andere Google, te komen.

Probeer je hierin zeker verder te verdiepen als je het echt goed voor hebt met je online presentatie.

Inspiratie

Waarom kijk je niet naar de website van je directe concurrenten, wat doen goed of net niet goed? Vaak geeft het kijken naar andere websites je vaak een idee welke richting je wil uit gaan met jouw project.

Elke dag toon Awwwards gloednieuwe websites

Zoek je inspiratie in verband met webdesign? Neem dan zeker ook eens een kijkje naar Awwwards.
Dit is een website die telkens een ‘Site of the Day’ kiest tussen hun genomineerde inzendingen.
Soms betreffen het heel experimentele sites of gedurfde layouts maar het kan uiteraard geen kwaad om hier wat inspiratie op te doen.

HTTPS - Een versleutelde website

Een beveiligde website kan je herkennen aan HTTPS in plaats van HTTP dat voor de domeinnaam komt.

HyperText Transfer Protocol Secure, afgekort HTTPS, is een uitbreiding op het HTTP-protocol met als doel een veilige uitwisseling van gegevens.

HTTPS versleutelt je website (SSL)

Deze toevoeging kan je regelen via de hosting van jouw domeinnaam, vaak in één klik.
Het is een teken naar de bezoeker van je site dat hij of zij jouw website veilig kan bezoeken.
Ook geeft Google de voorkeur op HTTPS-resultaten wanneer zoekresultaten worden weergegeven.

Kies voor een passend ontwerp van je website

Hou rekening met het ontwerp van de website dat er zoveel mogelijk aandacht gaat naar je product. Je kan jouw website nog zo flamboyant als mogelijk maken, op het einde van de rit wil je toch je kunst tonen en verkopen.

Hou zeker ook rekening met een logisch en intuïtief keuzemenu van de verschillende pagina's.

Een logisch menu navigeert de bezoeker door alle pagina's

Met een goed doordachte structuur en ontwerp kom je al een heel eind en vinden je bezoekers het aangenaam kijken naar je kunstwerken!

Een website maken en daarna is alles klaar?

onderhoud-website
Updaten en bijsturen van je website is een continu proces.

Zo werkt het helaas niet.
Nieuwe technieken, trends, inzichten of opfrissen van de website is een continu proces dat nooit klaar is.
Net dat maakt een website beheren weer zo leuk!

Je kan bijvoorbeeld inzicht krijgen via Google Analytics welke pagina's goed scoren.
Of hoe bezoekers je website vinden.

Zo zie je maar, een website maken blijft altijd boeiend.

Ik wens je veel succes met starten of optimaliseren van je site!

Lees verder
8 tips bij de aankoop van een schilderij
Schilderijverlichting
Welk formaat van schilderij kies ik?
Prijzen vemelden op de website