Naar
boven

Help ons! Kies jouw responsive KG-lay-out

Zoals eerder werd aangegeven ben ik bezig met het responsive maken van Karelgeenen.nl. Op dit moment heb ik twee lay-outs voor de responsive website ontwikkeld waar een keuze uit gemaakt moet worden. Het is hierbij belangrijk om de mening van de lezers te weten.

Hieronder volgen de twee lay-outs. Ik wil je vragen om een keuze te maken tussen deze lay-outs waar je het beste gevoel bij hebt door het formulier onderin in te vullen. Alvast bedankt! Feedback is uiteraard ook welkom ;-).

Korte informatie over de twee lay-outs:

Het unieke van lay-out 1 bestaat voor de mobiele en tablet versie uit uitschuifbare menu’s (zie tabbladen, en het menu). Deze rollen naar beneden of naar boven zodra er op wordt geklikt.

In lay-out 2 zijn de tabbladen een soort hoofdmenu, en de items eronder submenu’s. Het “submenu” zal dus per tablad veranderen, omdat ieder tabblad zijn eigen submenu heeft.

Lay-out 1

mobile-1

tablet-1

desktop-1

 

Lay-out 2

mobile-2

tablet-2

desktop-2

[gravityform id=”23″ name=”Responsive Lay-out” title=”false” description=”false”]

Bedankt voor het meedenken! Reacties zijn welkom =)

Onze Expertise Nodig?

Vul het onderstaande formulier in of bekijk onze online marketing cursussen en online marketing diensten.


Over de auteur:

Dit artikel is geschreven door .

Erwin Jongenelen
Mijn naam is Erwin Jongenelen. Ik ben een student aan Fontys Hogescholen(HBO) ICT Media & Design te Eindhoven. Tussen februari en juni 2013 ben ik de stagiaire bij Karelgeenen.nl met de missie om een nieuw responsive thema te realiseren voor deze website.
19 reacties op "Help ons! Kies jouw responsive KG-lay-out"
  • Jo zegt:
    01 Mrt, 2013 om 17:36

    Ik wil 2 “echte” pagina’s, met plaatjes/foto’s ipv grijze vlakken zodat ik zelf kan zien hoe het er uit ziet op desktop/phone/tablet. Screenshotjes zeggen weinig tot niets.

    Reageren
    • Erwin Jongenelen zegt:
      04 Mrt, 2013 om 09:26

      Hallo Jo, dit is de eerste stap bij het realiseren van een website. Zodra er een keuze is gemaakt tussen deze twee lay-outs, wordt er pas een ontwerp gerealiseerd. Als er direct begonnen zou worden aan het ontwerpen wordt er onnodig veel tijd gestoken in een ontwerp wat uiteindelijk niet gekozen gaat worden. Vandaar deze screenshots.

  • Boudewijn zegt:
    02 Mrt, 2013 om 12:08

    Goed bezig!
    De 2e is naar mening overzichtelijker.
    Succes ermee, karelgeenen.nl is momenteel niet echt praktisch op een mobiele telefoon.

    Reageren
  • Alex Hartman zegt:
    03 Mrt, 2013 om 02:20

    Eerste lijkt me beter omdat daar een duidelijkere navigatie bij zit.

    Toch begint bij beide de content vrij laat. Wil je dat niet meer omhoog hebben?

    En waarom test je ze gewoon niet tegen elkaar?

    Reageren
    • Erwin Jongenelen zegt:
      04 Mrt, 2013 om 09:28

      Hallo Alex, inderdaad een goed punt om de content eerder te laten beginnen. Daar was ik ook al over aan het twijfelen. Dit geldt eigenlijk vooral voor de tweede lay-out. (De eerste kan in en uitgeklapt worden). Wat bedoel je precies met het tegen elkaar testen?

    • Alex Hartman zegt:
      04 Mrt, 2013 om 23:34

      Nou, wat ik vaak gedaan heb is thema’s tegen elkaar testen.

      Je gebruikt dan bijvoorbeeld de SES theme splittest plugin. Met deze plugin kan je thema’s roteren en het gebruikt voor ieder thema een custom variabele, die je kunt toevoegen aan een geavanceerd segment in GA.

      Op die manier kan je per thema zien wat de ToS is, pages per visit, goals percentage etc. Ook kun je dit voor mobiele gebruikers bekijken.

      Op die manier kom je er vanzelf achter welk design als beste uit de test komt.

  • Alex Hartman zegt:
    04 Mrt, 2013 om 23:38

    Nadat ik een reactie plaatst, duurt het eeuwen voor de pagina vernieuwd wordt.

    Daarna krijg ik de melding Internal Server Error op de pagina http://www.karelgeenen.nl/wp-comments-post.php.

    Soms is de reactie dan geplaatst en soms niet.

    Reageren
    • Karel Geenen zegt:
      05 Mrt, 2013 om 08:42

      Bedankt voor de tip Alex, er wordt aan gewerkt. Het lijkt een plugin die wat moeilijk doet ;-).

  • Tim de Vrind zegt:
    06 Mrt, 2013 om 10:56

    Ik zou ook gaan voor optie 1.. overzichtelijker

    Reageren
  • Koen zegt:
    06 Mrt, 2013 om 11:00

    Ik zou voor layout twee kiezen, omdat ik denk dat layout één niet handig in gebruik is doordat er teveel ‘kleine knopjes’ zijn waar je op kunt klikken. Als je dan ergens op wilt drukken, dan druk je snel perongeluk op die daarnaast.

    Groet,
    Koen

    Reageren
  • Richard zegt:
    06 Mrt, 2013 om 11:04

    Inderdaad moeilijk te zeggen met die grijze vlakken. Wat mij opvalt is dat de concentratie ligt op de mobiele apparaten, maar hoe groter het scherm wordt (desktop / tablet) des te rommeliger de layout wordt. Misschien beide varianten online zetten, zodat iedereen het kan testen op zijn of haar (mobiele) apparaten. Zelf ben ik wat aan het knutselen met jquery Masonry layout.

    Reageren
  • Boudewijn zegt:
    06 Mrt, 2013 om 11:21

    Het zou bij nader inzien toch praktischer zijn als het 2 echte voorbeelden zijn.
    Het is zo niet duidelijk genoeg om er een oordeel over te velen.

    Reageren
  • Arjan zegt:
    06 Mrt, 2013 om 12:04

    Ik denk dat layout 2 iets beter leesbaar is.

    Meteen maar een gevaarlijke opmerking in het kader van responsive layout: niet alles wat op een desktop layout past hoeft volgens mij ook op een tablet of telefoon weergegeven te worden. Responsive zit hem in het feit dat de weergave zo wordt aangepast dat het past bij het medium waarop wordt weergegeven.

    In jullie site maak je reclame voor jullie hostingpartner. Dat is natuurlijk erg vriendelijk en nuttig voor linkbuilding etc maar het heeft geen toegevoegde waarde voor weergave op een telefoon. Het is op de telefoon gewoon verspilling van ruimte. Ik verwacht dat gebruikers van telefoon en tablet in hoge mate geïnteresseerd zijn in nieuwe content, dus herstructureer je menuvolgorde door een item als Recente Q&A meteen onder het Categorieën menu te plaatsen.

    Handleidingen en Uit de oude doos zijn voor een telefoongebruiker veel minder relevant.

    Dan nog een suggestie voor usability, ik zie graag reacties van anderen om deze veronderstelling:
    Veel mensen werken met hun duimen op een telefoon, dus de belangrijkste navigatie moet onderaan op het scherm staan en voldoende groot zijn om met een duim te klikken.

    Succes met het verwerken van de reacties. Ik ben nu al benieuwd naar ontwerpen 3 en 4 voor de volgende vergelijking!

    Reageren
  • Richard zegt:
    06 Mrt, 2013 om 12:14

    Dat is een discussie die vaker gehouden wordt. Maak je een “uitgeklede” website voor mobiele apparaten (minder informatie, 2 websites maken / bijhouden) of maak je een website die zich aanpast aan het apparaat (responsive) ?

    Reageren
    • Arjan zegt:
      06 Mrt, 2013 om 12:41

      Richard, ik had niet het bijhouden van 2 websites in gedachten bij mijn opmerking maar slechts een beperkte(re) weergave van alle content op andere apparaten.

      Het verbergen en/of verplaatsen van content is gewoon opmaak werk, daar is geen apart content beheer voor nodig.

      In beide ontwerpen voor de telefoon is hier nu ook al footer menu van de tabblet en desktop versie weggelaten. Nuttig, want het voegt voor de telefoongebruiker niet echt iets toe en verspilt daardoor alleen maar ruimte.

      De guru’s op het gebied van responsive web design spreken, voorzover ik heb gelezen, niet over weglaten van content maar over goede weergave. Mijn argument is dat weglaten (of juist toevoegen, bijvoorbeeld een telefoonknop voor direct response) onderdeel kan zijn van een betere weergave en aangepast aan het medium waarop het wordt gebruikt.

      Ik leer graag bij, dus ik ben benieuwd naar de mening van anderen. We hebben hier nu een mooie abstracte casus om te bespreken.

    • Richard zegt:
      06 Mrt, 2013 om 12:51

      Arjan, OK, ik hoor tegenwoordig vaak dat mensen 2 sites maken, een mobiele .mob en een “normale” De site herkent dan het apparaat en maakt een keuze welke site hij laat zien. Misschien kan je zaken ook binnen 1 website oplossen, dat weet ik dan weer niet (websites bouwen is dan ook niet mijn vak, vind het wel interessant!)

  • Eric van Oevelen zegt:
    06 Mrt, 2013 om 12:49

    Het was handig geweest als je de twee naast elkaar had gezet ;-). De verschillen zitten hem zo te zien vooral in de opbouw van het begin.

    Bij 1 komen Blog, Opleidingen etc. beter naar voren. Ook valt het accent meer op Home t/m Contact.
    Toch vind ik 1 nogal rommelig in de totale opbouw. Mijn voorkeur gaat dus uit naar 2, maar dan met een meer bescheiden logo dan nu het geval is. En misschien in combinatie met Blog t/m Vraag & Antwoord van voorbeeld 1.

    Succes verder!

    Reageren
  • Jan zegt:
    06 Mrt, 2013 om 13:28

    Het zou inderdaad veel handiger te vergelijken zijn als je beide layouts naast elkaar kan zien.
    Verder vind ik ook dat de inhoud eerder mag beginnen, door bv. het logo wat te minderen.

    Reageren
  • tony zegt:
    06 Mrt, 2013 om 16:14

    Content meer omhoog. Mensen zijn altijd geïnteresseerd naar het nieuwe, niet naar wat je aan te bieden hebt. Ben gewoon direct ;). Ik zou voor 2 kiezen.

    Reageren

Reageren