Een website van A tot Z

Bij het bouwen van een website moet je aan heel veel zaken denken. Op deze pagina wordt het bouwproces van A-tot-Z uitgelegd. Ieder onderwerp linkt door naar kleinere tutorials die een bepaald onderwerp uitleggen. Na het volgen van de tutorials op deze pagina ben je in staat zelfstandig een Mach3Blocks website te bouwen.

A. Een website aanmaken

Er zijn twee manier om te starten met een website. Je kan een lege website aanmaken en deze stapsgewijs opbouwen of je start met een template en bouwt jouw website op basis van deze template. Maak je gebruik van een template dan heb je sneller wat staan, maar de mogelijkheden om alles aan te passen zijn beperkter.
Tutorial: Een website aanmaken.
Tutorial: Pagina aanmaken.

B. Het thema vormgeven

De vormgeving van de website kun je per blok, element en op themaniveau bepalen. Het is erg belangrijk om bij de start de website direct op themaniveau te vormgeven. Op die manier zorg je ervoor dat de website consistent is qua designkeuzes. Daarnaast kun je daardoor op een later tijdstip eenvoudig wijzigingen doorvoeren. 
Tutorial: Vormgeven op themaniveau.
Tutorial: Lettertypes.

C. Headers en footers instellen

Op iedere pagina staat dezelfde header en dezelfde footer. In de header staat bijvoorbeeld het menu en in de footer staan adresgegevens en andere zaken die belangrijk zijn om op iedere pagina te kunnen inzien. Deze header- en footerblokken wil je centraal kunnen aanpassen zodat wijzigingen direct op de gehele website doorgevoerd worden.
Tutorial: Globale blokken.

D. De website vullen met content

Wanneer de basis van de website is gelegd in de stappen hierboven, dan wordt de website gevuld met content. Voorbeelden van content zijn: tekst, afbeeldingen, video en formulieren. Maak het jezelf makkelijk en bepaal welke type blokken je wil gaan gebruiken en maak deze favoriet. Vanuit het kopje favorieten kun je deze blokken snel op de diverse pagina's slepen. Vervolgens vul je de blokken per pagina met content.

Let op: Zorg ervoor dat er geen specifieke opmaak per blok wordt ingesteld, maar dat dit op themaniveau is gedaan. Op die manier hoe je controle over de vormgeving en krijg je een consistente goed te onderhouden website.
Tutorial: Favoriete blokken.
Tutorial: Blokken plaatsen.
Tutorial: Formulieren.

Mach3Blocks optimaliseert automatisch jouw afbeeldingen zodat afbeeldingen niet te groot worden ingeladen in de pagina. Het is daarbij nog wel steeds belangrijk dat je geen mega grote afbeeldingen upload.
Tutorial: Afbeeldingen.

E. Website optimaliseren

Een Mach3Blocks website kun je perfect optimaliseren voor zoekmachines. Mach3Blocks regelt echter een aantal zaken standaard voor je.

  1. De publicatietechnologie is opgezet voor het realiseren van snelle websites.
  2. Afbeeldingen worden automatisch geoptimaliseerd.
  3. Er wordt automatisch een sitemap.xml bestand gegenereerd.
  4. Er is een standaard robots.txt met instructies voor zoekmachines.
  5. De URLS van de website zijn standaard zoekmachinevriendelijk.
  6. CSS en Javascript wordt geminified aangeboden aan bezoekers en zoekmachines.

Daarnaast zijn er zaken die je zelf wil instellen:

  1. De headings H1, H2, H3.
    Tutorial: H1, H2, H3 instellen.

  2. De metainformatie per pagina.
    Tutorial: Paginatitel instellen.

  3. Google Analytics
    Tutorial: Google Analytics code plaatsen.

F. Code aanpassen

Voor de techneuten en SEO specialisten is er ook toegang tot de code van de website mogelijk. Hiermee kun je de website tot het kleinste detail op codeniveau aanpassen of uitbreiden. Deze functie is uiteraard wel voor eigen risico. Gelukkig kun je ook zelf backups maken van jouw website.
Tutorial: Code aanpassen

G. Website publiceren

Wanneer je website gereed is om online te gaan, dan kun je deze publiceren. Tijdens het publiceren (dat enige seconden duurt) zet Mach3Blocks de websitebestanden over naar de productieomgeving en optimaliseert deze. Jij hoeft daarna alleen nog de domeinnaam te verwijzen naar de gepubliceerde website door de DNS in te stellen.
Tutorial: Website publiceren.
Tutorial: DNS instellen.