Responsive design

Een hippe kreet op het internet tegenwoordig: Responsive design.

Maar wat is het eigenlijk?

Het heeft alles te maken met het ontwerp van je website en de weergave daarvan op de verschillende apparaten.

Verschillende beeldschermformaten

Tot voor kort (nou ja, kort is een relatief begrip) hoefde je alleen nog maar te ontwerpen voor de pc’s en laptops.
Maar de laatste jaren, met de komst van netbooks, (I)pads, smartphones en ultrabooks, heb je ook rekening te houden met een grote variatie in beeldscherm formaten.

De website die je zorgvuldig hebt ontworpen voor schermen van pakweg 1024 px breed, worden niet altijd goed weergegeven op alle andere digitale apparatuur.

Maak je website responsive

Makkelijkste manier: gebruik een plugin!

Plugin

Een van de meest populaire plugins voor WordPress is WP Touch.

Je hoeft deze plugin alleen maar te installeren en je website wordt automatisch “vertaald” op het moment dat het wordt weergegeven op een smartphone of pad. Dat deze plugin erg populair is bij de WordPress gebruikers blijkt wel uit het aantal downloads. Op het moment van dit schrijven is het al ruim 3,8 miljoen keer gedownload!

Responsive plugins

Deze plugins houden rekening met de weergave op de verschillende apparaten.
Zoals bijvoorbeeld Easyrotator, waarmee je image sliders kan maken die zelfs met een touch screen zijn te bedienen.

En als je niet alleen eigen afbeeldingen wilt laten zien, maar ook afbeeldingen met tekst, Youtube, Flickr of Pinterest afbeeldingen, dan is Slidedeck lite een hele mooie responsive contentslider.

Een andere mogelijkheid om je website responsive te maken, is het gebruik maken van geschikte thema’s:

Responsive thema’s

Kant en klaar

Gebruik een thema dat ook geschikt is voor weergave op andere apparaten.

 

 

Lugada

Minimalistisch met witte achtergrond

Twee kolommen met ingebouwde slider

 

 

 

Eclipse

Donkere achtergrond

Handige drag en drop elementen om verschillende elementen toe te voegen.

 

 

Max

Een responsive magazine thema

Slider en personaliseren van layout. Roterende berichten.

 

Zelf maken?

Omdat ik op deze website niet te diep inga op html en css blijft als optie open het ontwerpen met behulp van een kant en klaar pakket. In deze videohandleiding leg ik al uit met welk pakket je dit zou kunnen doen en hoe dat het werkt. Het programma Artisteer is onlangs uitgekomen met een update (versie 4), waardoor je ook hiermee responsive designs zou kunnen maken.

Geef een antwoord