Voorlaatste week stage

Bert stofzuigt

Ik weet het, ik weet het: er is al een tijdje geen blogpost meer geweest over het verdere verloop van mijn stage. Ik hoor het u al vragen: hebben ze daar dan eindelijk genoeg gehad van dat stom West-Vlaams accent en hebben ze je een one-way ticket terug naar "Bruhhe" door de strot geramd? Bijna, maar dat verklaart de achterstand niet in mijn blogpost activiteiten.

Week 3 :

Het werk gaat goed vooruit. De site begint qua vormgeving in z'n definitieve plooi te vallen, er moeten enkel nog wat specifieke pagina's opgemaakt worden en daar begint het schoentje wat te wringen.

Er werd namelijk beslist dat er gebruik gemaakt zal worden van de jQuery Masonry module om een overzicht van reportages te kunnen bouwen dat schaalbaar is. Wat zegt u? U begrijpt er niets van? Ik eerst ook niet, maar ik zal het u met mijn beperkte front-end kennis toch proberen uit te leggen:

Iedere reportage wordt voorgesteld als een blok (foto en tekst), uiteraard met een variabele grootte. In standaard HTML-code zou u als stagiair webdeveloper waarschijnlijk de neiging hebben om gewoon alles naar één kant op te duwen en te hopen dat alles in elkaar past (ik weet alvast dat dat mijn eerste idee was), maar helaas: Murphy en zijn wet zijn meedogenloos. Alles één kant opduwen werkt wel, maar men heeft dan altijd ruimte over tussen de blokken, wat uiteraard niet mooi is. Gelukkig is er Super Drupal-man die me meteen wijst naar de voornoemde module: die berekent met behulp van JavaScript de beschikbare ruimte en zorgt ervoor dat alles naadloos past, net zoals een metser die een muur bouwt. Ja hoor, u raadt het al: vandaar de naam Masonry, het Engelse woord voor metselaarskunst.

jQuery Masonry

Er steekt echter een probleem de kop op: met de beste wil van de wereld kan ik de module niet werkende krijgen. De reportages krijgen hun blokvorm, maar de functie om de beschikbare ruimte te berekenen en alles naadloos te doen passen weigert al evenveel dienst als een auto zonder accu. Na een paar uur geroep, getier en een paar traantjes, vind ik met behulp van Robin de oplossing. Blijkbaar is de code van de aangeleverde template niet zo koosjer als eerst gedacht: front-ender Jens houdt er blijkbaar de onhebbelijke gewoonte op na om bepaalde code te verwijderen. Uiteraard werd net de code verwijderd die de module nodig had om correct te kunnen werken, dus na wat heen en weer gescheld tussen front- en back-enders voeg ik dat ene lijntje code weer toe om alles perfect werkende te krijgen. Had ik al vermeld dat mijn vocabulaire scheldwoorden al serieus vergroot is sinds het begin van mijn stage?

Ramp o ramp, op woensdag komt Katrijn Van Giel, opdrachtgeefster van de site en tevens zus van de CEO van 3SIGN, Dries Van Giel, op bezoek om haar bevindingen over de site mee te delen. De vergadering duurt slechts drie uur en brave zielen als we zijn besluiten we toch een bakje friet extra te bestellen voor het middageten om alvast haar honger ietwat te stillen.

Na het middageten gaan we samen aan tafel zitten en krijg ik een heel deel suggesties mee: de hele site header moet aangepast worden om plaats te maken voor een logo, fonts worden overlopen en afgekeurd, content types aangepast, kleuren druk bekritiseerd (hoewel we er maar twee hebben) maar vooral: er wordt beslist om de foto's te tonen via een module FancyBox maar daar later meer over.

Fancybox lightbox

Ik geef een demo van de site en gaf tegelijk ook al wat opleiding aan Katrijn over hoe de site best te gebruiken. Gelukkig kan Katrijn al goed overweg met een computer (en dan vooral met een Mac, bah), zodat ik hier ook niet al te veel tijd aan moet spenderen. Katrijn verlaat ons met de woorden dat ze best tevreden is van het resultaat tot dan toe, wat uiteraard een enorme opsteker is.

Oh ja, er is blijkbaar een kerstmaal op het einde van de week wat al de hele week zorgt voor een gespannen sfeer in het bedrijf: wie bestelt wat, wat wordt er gegeten (en geschonken), wie zal er door de MUG naar huis gebracht moeten worden? Dat soort vragen blijft door mijn hoofd spoken tot die bewuste vrijdag. Alvast prettige feesten aan iedereen.

Vrijdag : kerstfeest....einde...

(Ik heb beloofd niks hierover op mijn blogpost te zetten, dus hier zal u het mee moeten doen. Jammer, ik had namelijk graag over scampi's die geroosterd werden op een kampeervuurtje, scampi's in ketchup-en-kaas saus, de rode en witte wijn, de aperitiefhapjes, het feit dat ik de veilige keuze gemaakt had door voor een gefrituurd gerecht te kiezen en de vele degustiefjes achteraf gehad, maar ik heb het ze beloofd...Sorry)

horen, zien, zwijgen

Week 4 + 5 :

Deze korte week wordt gekenmerkt door het proberen herinneren waaraan ik werkte, want een week-en-half verlof met twee serieuze feestdagen tussen hebben geen goed gedaan aan de werklust. Een maandag-gevoel hebben op een donderdag blijkt redelijk nefast voor de productiveit dus spendeer ik mijn tijd aan het onderzoeken hoe ik de Fancybox module aan de praat ga krijgen.

Ik had u inderdaad beloofd het hier over te hebben, ik was het vergeten na die dagen verlof, waarvoor mijn excuses.

Foto's kan je standaard laten tonen in de browser, maar dit is een lelijke en weinig aanpasbare optie, zeker voor een site van een fotografe. Fancybox is een jQuery plug-in die het mogelijk maakt afbeeldingen op verschillende manieren te laten tonen aan een bezoeker van de site.

Voor Katrijn.com is er gekozen om de foto te laten 'uitspringen' in een kadertje met een witte transparante achtergrond, uiteraard met zelfgetekende bedieningsknoppen en eigen stijl, dus mijn plan om de standaard instellingen te gebruiken mogen al meteen de vuilbak in.

Maar eerst stuit ik opnieuw op een groot probleem: wat ik ook doe, Fancybox wil niet werken.

Uiteraard wordt de schuld meteen opnieuw op de front-ender gestoken en werd zodoende al zijn template code opnieuw bekeken, maar deze keer bleek het Jens zijn schuld niet. We verontschuldigen ons voor de toegebrachte blauwe plekken en zoeken verder. Na heel wat zoeken (Robin in de php-code, ik in de JavaScript code (alles is mogelijk!) ) is het toch Robin die de oplossing vindt: ieder element dat gebruik wil maken moet van een 'title' attribuut voorzien worden, zelfs al is het geen foto en zelfs al is dat attribuut gewoon leeg! Niemand heeft ooit gezegd dat webdevelopment logisch was....

Nadat we Fancybox eindelijk werkende gekregen hebben, is het tijd om het over 'responsive' te hebben. Kort uitgelegd wil dit zeggen dat een site zo gebouwd wordt om te vertonen op ieder toestel die op het Internet kan surfen, zonder verlies van functionaliteit. Dit wordt bereikt door de opmaakcode van een website zo af te stellen op bepaalde 'breekpunten', punten waar layout en design verschillen van de standaard versie. Een voobeeld: site X toont een blauw kader bovenaan indien met een gewonen pc naar die site gekeken wordt, terwijl diezelfde site op een smartphone datzelfde blauwe kader onderaan de site toont. Zo kunt u 'responsive' interpreteren.

Responsive design

Ik heb slechts 1 probleem: front-ender Jens (die komt wel heel veel in deze post voor) is de residentiële 'responsive'-expert maar heeft een slechte timing. Jens is namelijk de rest van de week ziek en ik heb hem nodig om uit te leggen hoe de werkwijze hier bij 3SIGN is. Ik heb namelijk al wat ervaring met 'responsive webdesign', maar heb dit nog nooit gecombineerd met Sass, Compass en Respond-to (zie blogpost week 1). We besluiten om de site van een eerder project te ontleden zodat ik kan zien hoe Jens deze 'responsive' gemaakt heeft en ik maak me zijn werkwijze meester. Hoewel: meester is misschien niet het juiste woord. Het blijkt toch nog wat denk en rekenwerk in de voeten te hebben, maar na een dag of twee begint er toch resultaat te komen.

Ondertussen doe ik ook een vreselijke ontdekking: bij één van mijn strooptochten langs de bureau's vind ik mijn CV terug die ik opgstuurd had toen ik nog een keuze moest maken waar ik mijn stage ging doen. Niets nieuws onder de zon zou je zo zeggen, maar na nader onderzoek merk ik plooilijnen op mijn CV op. Na een CSI-achtige reconstructie (lees: herplooien langs de lijntjes) ontdek ik waarvoor mijn CV gebruikt is: blijkbaar houden ze hier van vliegtuigjes vouwen! Ieder bedrijf mag dan wel zijn eigen manier hebben om documenten onderling over te dragen, maar ik moet toch bekennen dat mijn trots enigszins gekrenkt is.

De terugkeer van Jens wordt gevierd met vragen zoals "Wie ben je? Wat doe je hier eigenlijk?" en hij staat me meteen bij in mijn queeste naar een 'responsive' website. De code wordt bekeken en goedgekeurd, blijkbaar ben ik dan toch niet al te slecht bezig.

'Wie is het?' bordspel

De site nadert voltooing en moet enkel hier en daar nog wat gepolijst worden, maar ik ben best tevreden van het resultaat. Zeker het vermelden waard want deze week komt mijn mentor op stagebezoek. De inhoud van die gesprekken zijn jammer genoeg onder het label 'Staatsgeheim' geklasseerd dus ik kan, op straffe van verlies van mijn linker kleine teen, hier echt niets over vertellen. Het enige wat iedereen onthouden heeft hier bij 3SIGN is dat echt alles mogelijk is.