Werk in uitvoering

Sinds enkele dagen draait deze site bij wijze van experiment op WordPress MU, waarmee je verschillende WordPress-websites vanuit één installatie kunt onderhouden.
Read more

Nieuwe website Rolling Sticks

Afgelopen zaterdag is de nieuwe website van drumschool Rolling Sticks in Gouda live gegaan. De site is ontworpen door Arjan van der Weide, de teksten en bedrijfsmatige adviezen zijn van Maurits Speksnijder, en Laterna zorgde voor de vertaling van grafisch ontwerp naar HTML en CSS, en voor de bouw van de site in WordPress.

Bij WordPress is speciale aandacht besteed aan zoekmachinevriendelijke pagina’s en aan het spamvrij houden van het gastenboek en het contactformulier. Hiervoor zijn verschillende WordPress-plugins ingezet, waaronder Akismet, All in One SEO Pack, WP Comment Sorter, Google XML Sitemaps, en niet te vergeten het krachtige en gebruiksvriendelijke cFormsII.

Nog niet zichtbaar op de site is NextGEN Gallery, een fantastische plugin om WordPress-websites uit te breiden met diashows.

Dankzij een zelfgeschreven conversieprogramma is het gelukt om het gastenboek van de oude website naar WordPress om te zetten.

Rolling Sticks

Nieuwe website Intertrek Wandelreizen

Er is geen werkgever of opdrachtgever voor wie ik al zo lang werk als Intertrek Wandelreizen. Al sinds 1998 heb ik de verschillende Intertrek-websites ontworpen en gebouwd. Het vorige ontwerp dateerde alweer van vijf jaar geleden en was om verschillende redenen verouderd. Read more

Netkwesties start weblog

Het e-magazine Netkwesties stapt na zeven jaar gedeeltelijk af van de formule met diepgravende achtergrondartikelen en heeft sinds afgelopen weekend een weblog: weblog.netkwesties.nl. De nieuwe weblog bleek een leerzame vingeroefening met WordPress, aangevuld met enkele welgekozen plugins, zoals de Social News Nederland en Get Recent Comments.

Vernieuwde website Martijn de Groot Communicatie

Communicatieadviseur Martijn de Groot heeft al sinds 2005 een eigen website, ontworpen door SAFvisuals. Deze prachtige maar volledig in Flash gebouwde site bleek echter slecht vindbaar in Google. Ook wilde Martijn de site zelf kunnen onderhouden.

martijndegroot.communicatie

Laterna heeft de site daarom van de grond af aan opnieuw gebouwd met HTML en CSS, en het resultaat overgezet naar WordPress. Net als bij Lopende Zaken is hard gewerkt om de site ook perfect te krijgen in de belangrijkste Mac-browsers, Safari en Firefox. Een belangrijk hulpmiddel daarvoor is BrowserCam, een betaalde dienst die je site laat zien op elk gewenst platform, in elke gewenste browser en in elke gangbare beeldschermresolutie.

Voor technisch onderlegde lezers volgen hier enkele browserproblemen waarmee ik te maken kreeg:

  • Op sommige pagina’s rouleert de foto linksboven met een overvloei-effect. Daarvoor had ik in eerste instantie een Flash-animatie gebruikt, gemaakt met het handige FlashSlider. Dit bleek echter in Firefox een onoplosbaar probleem op te leveren: als je met behulp van layers een element bovenop een Flash-animatie plaatst – in dit geval de kop martijndegroot.communicatie – dan verdwijnt dat element in Firefox steevast ónder de animatie.
    De oplossing: de Flash-animatie vervangen door een stuk Javascript, de Ultimate Fade-in slideshow. Dit op zich voortreffelijke script leverde weer een ander, heel curieus browserprobleem op in Safari (bij elke fotowisseling wordt de z-index van de foto 1 opgehoogd, waardoor de kop na zekere tijd alsnog verdwijnt), maar die waren op te lossen door de kop martijndegroot.communicatie een hele hoge z-index te geven.
  • Ook de horizontale navigatiebalk leverde problemen op in Safari: de witte onderkopjes verschenen niet als je met je muis over de cijfers 1.0 t/m 4.0 bewoog. Na een paar uur puzzelen de oorzaak gevonden: in Safari blijk je met Javascript wel de CSS-eigenschappen van een gegeven blok te kunnen manipuleren, maar niet als die eigenschappen geërfd zijn van een groter blok, de zogeheten parent.
  • De broodtekst liet weer een bug in Internet Explorer zien: bij cursieve teksten verschoof de rechtermarge naar rechts. Dit probleem en de oplossing worden beschreven op Positioniseverything.net. Opgelost met een extra CSS-regel overflow: hidden.
  • Nog een overflow-probleem in de lichtkrant-achtige regels onder de broodtekst. Het CSS-kenmerk overflow: hidden blijkt in de meeste browsers niet te werken als de tekst op nowrap staat en ook nog relatief wordt gepositioneerd. Met dank aan mailinglijst WebProf vond ik een ‘hack’ voor Internet Explorer, maar in Opera (Windows) en Safari (Mac) bleef het probleem bestaan. De enige uitweg: deze regels links en rechts handmatig afkappen. Niet bijster elegant, maar als tijd en budget op zijn, dan is een pragmatische oplossing beter dan helemaal geen oplossing.

Ter vergelijking: de oude Flash-website staat voorlopig nog even hier geparkeerd.

Nieuwe website Lopende Zaken

Bureau Lopende Zaken

Bijna iedereen die websites ontwerpt, ontwikkelt in de loop der jaren een duidelijk herkenbaar stijltje. Zo hou ik zelf van strak en stijlvol, zonder veel ornamenten. Maar soms is het heel leerzaam om eens over de grenzen van je eigen stijl heen te kijken.

Lopende Zaken, een projectbureau op het gebied van recreatie, geschiedenis en culturele planologie, schakelde Laterna in voor het ontwerpen en bouwen van een nieuwe site. Bij de briefing bleek de opdrachtgever sterke wensen te hebben: de vormgeving moest kleurrijk zijn, veel beeldmateriaal bevatten en passie voor cartografie uitstralen.

Laterna maakte vijf totaal uiteenlopende ontwerpschetsen, waaruit Lopende Zaken een uitkoos als basis voor de website. Het gekozen ontwerp werd verder visueel uitgewerkt, waarbij een deel van de vele ideeën en suggesties van de opdrachtgever een plaats kreeg. De spil van de site wordt gevormd door het enorme portfolio van het bureau, dat zowel tekstueel (knop Projecten) als visueel (klik op het kaartje in het linkerkader) kan worden bekeken.

Veel aandacht is besteed aan browseronafhankelijkheid. Op verzoek van de opdrachtgever heb ik de site ook geschikt gemaakt voor de Safari-browser op de Mac. Dat bleek geen triviale eis, maar dankzij extra scripting en veel geduld is dat uiteindelijk toch gelukt.

Betaaldiensten

Een eerste experiment met betaalde webcontent, in samenwerking met Routewerk: op wandelsite Tweevoeter kun je sinds kort betaalde wandelroutes downloaden. Dit experiment is voorafgegaan door grondig onderzoek naar de bestaande betaaldiensten op internet, zoals iDeal, Paypal en ClickandBuy.

Uiteindelijk hebben we gekozen voor betalen via de telefonische betaaldienst Mollie, die bijvoorbeeld ook gebruikt wordt door Nieuwsbank.nl. De betaling is in hooguit twee minuten geregeld: je belt een 0900-nummer, je toetst een zescijferige code in en je krijgt meteen toegang tot de route, die je vervolgens kunt uitprinten. De kosten worden automatisch verrekend via je telefoonrekening. Je hebt geen creditcard of abonnement nodig en de transactie verloopt geheel anoniem.

Een ideale betaalmethode? De praktijk zal het leren.

Nieuw cms Santiago.nl

Genootschap van Sint Jacob

Santiago.nl, de website van het Genootschap van Sint Jacob, is deze week vernieuwd. Weliswaar is de layout niet veranderd, maar de ‘achterkant’ van de site is daarentegen wel ingrijpend verbouwd. Laterna heeft namelijk met behulp van Movable Type deze site van een contentmanagementsysteem voorzien. Hierdoor worden de redacteuren en andere vrijwilligers van deze pelgrimsvereniging minder afhankelijk van de twee webmasters en kunnen ze ook zelf nieuwe content en updates invoeren.

Daarnaast heeft Laterna het afgelopen jaar het Genootschap veelvuldig geadviseerd over de verdere ontwikkeling van de site, het beheer en internetontwikkelingen in het algemeen. In een later stadium worden de vormgeving en de verdere technische uitbouw onder handen genomen.

Een simpele zakelijke website met WordPress

Na een e-mailwisseling met een opdrachtgever ben ik de laatste week aan het experimenteren geslagen met WordPress, dat ik eerder deze maand vergeleek met MovableType.

Ik schreef dat je WordPress niet alleen voor weblogs kunt gebruiken, maar ook als een simpel contentmanagementsysteem voor een bescheiden zakelijke website. Is het inderdaad zo simpel, vroeg die opdrachtgever zich af?

Mijn eerste test is te bekijken op www.klog.nl. Het enige wat ik nog niet voor elkaar heb, is de volgorde van de statische pagina’s rechts. Waarschijnlijk zie ik hierbij iets heel simpels over het hoofd.

De volgende stap: een theme downloaden en kijken hoe deze testsite met voornamelijk statische pagina’s er dan uit komt te zien. Wordt vervolgd!

Nieuwe website Remco van Blokland

Fotograferen doet Remco al heel lang, nu heeft hij ook een site om zijn fraaie foto’s – voornamelijk van muziekoptredens – te etaleren.

Remco van Blokland

Het ontwerp maakte Remco zelf in Photoshop, Laterna paste het aan voor de meest gangbare beeldschermresoluties en vertaalde het naar browseronafhankelijke HTML en CSS. De fotogalerijen worden automatisch gegenereerd door een PHP-script, waardoor het eenvoudig is om bestaande galerijen aan te passen en nieuwe aan te maken.

Hoewel de schermafdruk anders doet vermoeden, is de hele site zonder ‘frames’ gebouwd. Dit zorgt voor een betere opname in Google en maakt het mogelijk om te dieplinken naar afzonderlijke galerijen. Verder is het e-mailadres op de contactpagina onleesbaar gemaakt voor ’spambots’.

De site voldoet aan de officiële HTML-standaard en ook aan bijna alle overheidsrichtlijnen, op punt R-pd.8.18 na (e-mailadres coderen).

» www.remcovanblokland.nl