Ex-Change
Website Zomer 2012 The profit of authentic online dialogue
Woord vooraf Voor je ligt de manual van de vernieuwde Ex-change website. Dit boekwerk beschrijft de vormgeving en werking van de site en dient als naslagwerk voor de redacteurs. De hele website, inclusief de webhosting omgeving bij TransIP is gebaseerd op vrij beschikbare Open Source Software en het datacentrum van TransIP, waar de website van Ex-change is ondergebracht op een energiezuinige server draait CO2 neutraal. Het gebruik van dit boekwerk, alsmede de website, vereist enige voorkennis op het gebied van content management in het algemeen en WordPress in het bijzonder. Bij oplevering van de site krijgt de Ex-change redactie een uitgebreide training in het gebruik van WordPress zodat de aanwezige mogelijkheden optimaal gebruikt kunnen en zullen worden.
Veel plezier bij het bladeren door deze manual en de site!
2
Inhoudsopgave Woord vooraf Inhoudsopgave
2 3
Deel 1: Vormgeving en informatiearchitectuur Informatiearchitectuur Ontwerpfilosofie Wireframes Layouts
5 6 7 8
Deel 2: Content management in WordPress Pages en Posts / Berichten en Pagina's Media Library / Media bibliotheek Featured Images / Uitgelichte afbeelding Widgets / Widgets Menu en Navigatie Trim Options (grafische weergave) Theme Features en opmaakhulpjes Iconset
11 11 11 12 13 14 16 20
Deel 3: Technisch Beheer WordPress en updates MailPress Versies bij oplevering
22 22 22
3
Deel 1: Vormgeving en informatiearchitectuur
4
Informatiearchitectuur
5
Ontwerpfilosofie
1. Golden Circle prominent aanwezig op de homepage voor iedere doelgroep 2. Happy Talk, Helder, scherp, eenduidig, consistent en to-the-point 3. Opmerkelijk
Golden circle prominent op de homepage
Eenduidig en consistent
De 'Golden Circle' is een marketing-begrip dat de drie meest belangrijke elementen uit je verhaal beschrijft; Het waarom, het hoe en het wat. Voor Ex-change duiden die begrippen de visie, de deelnemers en overige contribuanten en de projecten die worden gerealiseerd. Het is van belang dat de meest belangrijke contribuanten (studenten en sponsoren) zich beiden goed kunnen herkennen in het beeld dat op de website wordt geschetst. Zij moeten niet alleen begrijpen waarom Ex-change the profit of learning is, maar zich ook met haar kunnen identificeren.
Teksten, maar ook de visuele communicatie, moeten een eenduidig en consistent beeld geven aan de bezoeker zodat deze weet wat hij of zij kan verwachten. Om die eenduidigheid te borgen is het goed gebruik te werken met 1 eindredacteur die vorm en inhoud voor langere periode bewaakt.
Helder en scherp Teksten zijn bij voorkeur scherp geformuleerd in klare taal. Heldere teksten schrijf je 't best niet bij kaarslicht maar in de ochtenduren na douche en goed ontbijt! Gebruik duidelijke taal die zowel voor Mbo-jongeren als journalisten en managers goed te begrijpen is. Het maken van een stevig statement is zo nu en dan warm aanbevolen, mits even zo sterk onderbouwd.
To-the-point Happytalk zijn alle teksten waarbij je in je achterhoofd een stemmetje hoort meelezen... "bladiebladiebladiebla" Vermijd happytalk en onnodige bijzinnen. Websites worden niet gelezen maar gescand, alsof het billboards zijn. Maak daarom gebruik van duidelijke, prikkelende koppen en fotografie.
Opmerkelijk Zorg ervoor dat tekst en ook fotografie opmerkelijk zijn. Als iets het waard is een opmerking over te maken, dan doet men dat ook, op Social Media.
6
Header -Vaste ruimte met zoekveld. Menu -Te configureren in WordPress, inclusief Social Media
Wireframes
buttons.
Featured Slider (optioneel) -4 items naar keuze. Te configureren in het ePanel. Bij voorkeur te gebruiken voor Golden Circle of nieuws en veldpost.
Content Area's (optioneel) -3 items naar keuze. Te configureren in het ePanel. Bij voorkeur te gebruiken als tijdelijke aandachtstrekker cq. advertentie.
Quote (optioneel) -etpol, fijne vakantie, inschrijvingen sluiten, et cetera. Recent Work - Uit het veld
From the Blog - Actueel
-Veldpost door deelnemers. 6
-Blogposts door Henk en
laatste berichten worden weergegeven met foto.
redactie. 3 laatste berichten worden weergegeven in tekst.
Footer (optioneel) -3 kolommen met ruimte voor links, tekst of tweets.
7
Layouts Blogpagina en -overzicht
8
Contact- en videopagina
9
Deel 2: Content Management
10
Content Management in WordPress Pages en Posts / Pagina's en Berichten
Categories / Categorieën
Artikelen in WordPress zijn Page of Post.
•
Pages zijn bedoeld voor statische content die een langere levensduur kent en niet of nauwelijks aan verandering onderhevig is. Een voorbeeld is de pagina over Kitui, of de contactpagina. Meer actuele artikelen zijn Posts.
•
Het verschil -naast de levensduur- is dat Pages in een hiërarchische boom met takken geordend kan worden (vergelijkbaar met een stamboom) en dat Posts juist geen hiërarchie kennen. Posts kunnen in een of meerdere categorieën worden geplaatst en kunnen worden voorzien van Tags. Door deze twee labels te gebruiken kunnen de artikelen in diverse 'groeperingen' getoond worden. Zo kan een officieel bezoek van Henk aan Kenya geplaatst worden in de categorieën "Waar is Henk" en "Nieuws" zodat het bericht via beide wegen door de bezoeker gevonden kan worden. Daarnaast zou een dergelijk bericht getagged kunnen worden met trefwoorden waarop een bezoeker het bericht mogelijk wil vinden. Het is goed gebruik om bezoekers de mogelijkheid te geven te reageren op de inhoud. Op pages kan meestal niet gereageerd worden, maar op posts juist wel.
•
Actualiteiten o Nieuws o Veldpost o Waar is Henk Ontwikkelingsprojecten o ICT o Waterbouw o et cetera Stages en Vacatures o In Nederland o Stages in Afrika
Media Library / Media bibliotheek In de Media Library vindt je alle afbeeldingen en pdf's die op de site worden gebruikt. Deze kunnen in artikelen of slideshows worden gebruikt. Het is niet aan te bevelen de Media Library te gebruiken voor video's. Facebook en Youtube zijn hiervoor beter geschikt.
Featured Images / Uitgelichte afbeelding Een artikel kan worden voorzien van een Featured Image. Deze afbeelding wordt gebruikt bij weergave van het artikel op een pagina waarop nog meer artikelen te vinden zijn. Je kan hierbij denken aan een zoekresultaat, de categorie veldpost of actualiteiten.
11
Features en opmaakhulpjes Het Theme (de vormgeving) is voorzien van diverse hulpjes ten behoeve van de opmaak. Er is een breed arsenaal aan venstertjes, buttons en een slideshow beschikbaar. Verderop in dit document op pagina 16 staan ze weergegeven. In het 'New Post' of 'New Page' venster zijn in de wysiwyg editor een aantal knoppen opgenomen waarmee de gekozen layoutfeature eenvoudig is toe te voegen.
Widgets / Widgets De blokjes content aan de rechterzijde en in de footer zijn 'Widgets'. In het beheerscherm zijn deze dmv drag-and-drop eenvoudig te positioneren of te verwijderen.
12
Menu en navigatiestructuur Net als het plaatsen van de widgets, vindt ook de configuratie van het menu plaats door middel van drag-and-drop. In het overzicht rechts zie je de huidige configuratie van het menu. Je ziet de titel van het label, en het type link. Er zijn Pagina's, Categorieën en een aangepaste link opgenomen. Aan de linkerzijde zie je de interface waarmee items kunnen worden toegevoegd aan het menu.
13
Trim ePanel Options (grafische weergave) De vormgeving van de homepage en diverse andere onderdelen van de site kan met behulp van het ePanel worden geconfigureerd. ePanel • homepage • layout • navigatie • featured slider • content areas • quote • post info • advertenties
14
15
Features en opmaakhulpjes
16
17
18
19
Iconset
20
Deel 3: Technisch Beheer
21
WordPress en updates Het is aan te bevelen het technisch beheer in handen te geven van een ervaren beheerder met enkele jaren ervaring in het beheer van grote WordPress sites, oplossen van verstoringen en schrijven van html5, css3 en php-code. Omdat er geen OTAP straat is, is een failsafe rollback scenario vereist bij iedere update. Voer daarom nooit automatische updates uit, maar doe dit handmatig. Maak voorafgaand aan de update een backup van de database en webroot, zodat deze in geval van een mislukte update hersteld kunnen worden.
Versies bij oplevering • • • • • • • •
WordPress 3.4.1 Trim Theme 1.1 MailPress 5.1 Disqus Comment System 2.72 Google Analytics Dashboard 2.0.3 Google Analitycs for WordPress 4.2.4 Social Sharing Toolkit 2.0.8 cForms 12.2
Omdat Ex-change zich met name richt op bezoekers vanuit Nederland is het verstandig om de updates uit te voeren op een ochtend voor 8.00 uur. Het is aan te bevelen minimaal eens per week te controleren op beschikbaarheid van nieuwe updates.
MailPress MailPress is de plugin die zorgt voor de newsletter functionaliteit. Deze mag nooit automatisch worden bijgewerkt via wp-admin. Volg altijd de update instructies die vermeld worden op de website van MailPress.
22