Tag Archief van: responsive

Het hamburgermenu is vernoemd naar de drie streepjes: broodje boven en onder, hamburger in het midden. Logisch toch?

Dit hamburgermenu wordt als bekend verondersteld als je mobiele sites bezoekt. NU.nl maakt er bijvoorbeeld gebruik van.

Hamburger Menu Website

Niet iedereen begrijpt dat dit een menu is waarop je kunt klikken. Denk dus goed aan je doelgroep en zorg ervoor dat je bezoekers alles in een nanoseconde begrijpen wat je bedoelt.

510 keer gelezen

Zoek je met een tablet of telefoon in Google? Dan worden sites die niet ‘mobile friendly’ zijn, sinds eind april achtergesteld in de zoekresultaten. Dat betekent dus dat je bezoekers zult verliezen.

Kijk je met je desktop, dan lijkt er niets aan de hand. Google kan je site daar nog wel een goede ranking geven. In je statistiek zal je wellicht niets opvallen qua mobiel bezoek. Er zal immers minder of zelfs geen mobiel bezoek (meer) komen. Het lijkt alsof je daarom geen noodzaak hebt om je site ‘mobile friendly’ te maken, maar niets is dus minder waar. Bovendien gebruiken meer bezoekers tegenwoordig een tablet of telefoon dan een desktop. Je ‘moet’ je site dus wel geschikt maken voor mobiel gebruik.

Responsive of mobiel gebruik, wat is het?

Als je site responsive of ‘mobile friendly’ is, kunnen bezoekers met een tablet of telefoon je site goed bekijken. Dat kan op diverse manieren:

  • Je site past alles automatisch aan. Zo worden tekstblokken onder elkaar getoond en worden foto’s boven en onder de tekst gezet. Zoals deze site dat doet.
  • hamburger menuJe maakt een aanpassing voor mobiel gebruik. Dat kan bijvoorbeeld met een plugin. Je menu komt dan vaak in zo’n ‘hamburgertje’ (ja, zo noemen we dat echt) en alle opmaak wordt verder niet getoond.
  • Je maakt twee sites, met een aparte URL en versie voor mobiel gebruik.

Ik maak bij voorkeur gebruik van optie 1. Een Genesis theme van Studiopress bevat bijvoorbeeld al de code voor mobiel gebruik. Verander je verder niets aan de grootte van kolommen e.d., dan is je site al meteen responsive. Weet je meer van CSS en pas je wel meer aan van het theme, dan moet je dus ook het CSS voor je mobiele gedeelte aanpassen of toevoegen.

Vind Google je site voldoende ‘mobile friendly’?

Google heeft er een tool voor gemaakt. Test het hier.

757 keer gelezen

responsive websiteEen ‘responsive website’ is aangepast voor de beste weergave op meerdere devices, zoals tablets en smartphones. De layout past zich aan als je de site opent in bijvoorbeeld een smartphone, zoals de iPhone of Samsung. Zie het voorbeeld hiernaast op de nieuwste iPhone.

Ook als je het scherm van je browser verkleint, zul je zien dat de weergave van deze site zich daarop aanpast. De blokken die in je browser hiernaast zijn te zien, zul je dan onderaan in je scherm vinden als je naar beneden scrolt. Vergelijkbaar met de weergave op de smartphone.

Om je website responsive te maken kun je je ontwerper of website bouwer vragen om hiervoor een apart ontwerp te maken. Eigenlijk is dat extra werk. Voor WordPress zijn er ook plugins (zoals WPtouch) maar die geven wat mij betreft een te lelijk resultaat, zeker als je weet dat het nu ook anders kan.

Liever maak ik daarom gebruik van de responsive themes van Studiopress. Studiopress levert een aantal themes die al zijn voorzien van een ingebakken responsive versie. Ook deze website is gemaakt met zo’n theme, dat je helemaal naar wens kunt aanpassen (met wat kennis van PHP en CSS).

Wanneer is een responsive site interessant?

Als veel van je bezoekers een smartphone gebruiken om je site te bezoeken, is een responsive variant interessant. In de statistieken van je site moet je het gebruik van mobiel terug kunnen vinden. Maar laat je ook niet gek maken. Veel websites – en ook die ik zonder responsive variant lever – zijn heel goed met een smartphone te bekijken.

Als nog geen 10% van je bezoek via een smartphone komt, zou ik er geen extra investering voor doen. Als meer dan 80% van je bezoek via een mobiel is, dan raad ik je aan om je site zelfs geheel voor mobiel gebruik te optimaliseren.

Wil je een responsive theme, die net als deze site geschikt is voor ‘normale’ browsers, tablets en smartphones? Dan laat ik je graag weten wat mogelijk is.

Meer weten?

Bekijk mijn portfolio, of neem meteen contact met mij op.

1173 keer gelezen