Best practices om ervoor te zorgen dat je mobiele bezoekers je site eenvoudig kunnen gebruiken.

Alle Squarespace-sites zijn vanaf het begin zo ontworpen dat ze er goed uitzien op mobiele apparaten. Toevoegingen die je maakt, zoals grote mediabestanden, veel inhoud op een pagina en kleine letterafstanden, kunnen echter problemen veroorzaken met het laden van de site en de mobiele weergave. Deze handleiding beschrijft onze beste werkwijzen om je site mobielvriendelijk te houden.

Test de mobiele compatibiliteit van je site

Om te zien hoe je site op mobiel wordt weergegeven, bezoek deze op een mobiel apparaat, of gebruik apparaatweergave om te bekijken hoe het eruitziet op kleinere schermen. Als je site Fluid Engine gebruikt, zorg er dan voor dat je de inhoud in je mobiele lay-out arrangeert zoals je wilt dat deze verschijnt.

Je kunt ook leren hoe verschillende functies worden weergegeven op een mobiel apparaat door Hoe zal mijn site eruit zien op mobiele apparaten?te bezoeken.

Gebruik de Mobile-Friendly Test van Google om snel de mobiele compatibiliteit van je site te beoordelen. Als de test aangeeft dat je site niet mobielvriendelijk is, of als je problemen ondervindt bij het testen van je site op mobiel, volg dan de tips in deze gids.

Opmerking: De Mobile-Friendly Test van Google is een tool van derden en valt buiten het bereik van onze ondersteuning.

Elk mobiel apparaat behandelt websites anders

Nieuwere telefoons kunnen bijvoorbeeld grote sites beter aan en laadtijden zijn doorgaans sneller op een draadloos netwerk (dan bij een mobiele verbinding).

Sommige mobiele browsers kunnen een foutmelding tonen als je paginagrootte te groot blijkt te zijn. Volg deze tips om je pagina's kleiner te maken.

Houd je pagina's onder de 5 MB

Wanneer een bezoeker een pagina laadt, downloadt hun apparaat alle inhoud ervan. Mobiele apparaten maken gebruik van eenvoudige hardware en zijn afhankelijk van mobiele netwerken voor internettoegang, dus als ze om grote hoeveelheden data vragen, kunnen ze overweldigd raken. Om problemen te voorkomen, minimaliseer het bedrag inhoud op elke pagina.

Omdat de laadtijden afhankelijk zijn van het apparaat en de verbinding, is er geen exacte limiet. Pagina's met meer dan 5 MB inhoud kunnen echter langzaam laden op mobiele verbindingen, dus hoe kleiner, hoe beter.

Om de grootte van de pagina te controleren of tips te krijgen om de grootte van de pagina te verkleinen, bezoek De grootte van uw pagina verkleinen voor sneller laden.

Letterafstand instellen op 0px of hoger

Als de letterafstand van een lettertype is ingesteld op minder dan 0px, kunnen de letters elkaar overlappen op een mobiel apparaat.

Je moet niet vertrouwen op afstandsblokken

Afstandsblokken worden niet ondersteund in Fluid Engine. Ontwerp in plaats daarvan je mobiele lay-out onafhankelijk van je desktop-lay-out.

Afstandsblokken voegen lege ruimte toe aan een pagina, waardoor minimalistische lay-outs ontstaan bij het bekijken van een site op een computer. Op mobiel zijn afstandsblokken echter meestal verborgen. Dit kan de lay-out van uw mobiele site op onbedoelde manieren veranderen. In plaats van te vertrouwen op veel afstandsblokken, kun je overwegen om de opvulling te veranderen om meer witruimte toe te voegen.

Zorg ervoor dat mobiele stijlen zijn ingeschakeld (versie 7.0)

Mobiele stijlen zijn altijd ingeschakeld op versie 7.1. Ga voor meer informatie naar Hoe wordt mijn site weergegeven op mobiele apparaten?

De meeste Squarespace-sjablonen tonen inhoud in een unieke, gestapelde lay-out op mobiele apparaten, zodat bezoekers gemakkelijk door je inhoud kunnen scrollen. Als mobiele stijlen zijn uitgeschakeld, moeten bezoekers knijpen en zoomen om door je site te navigeren.

Om ervoor te zorgen dat mobiele stijlen zijn ingeschakeld:

1. Open het Ontwerppaneel en klik op Sjablooninstellingen.
2. Zorg ervoor dat mobiele stijlen uitschakelen niet is aangevinkt.

Je ziet deze instelling alleen als je sjabloon ondersteuning biedt voor het uitschakelen van mobiele stijlen.

Meer opmaaktips

Voor meer tips voor mobiele opmaak, bezoek Hoe zal mijn site eruitzien op een mobiel apparaat?, waar we uitleggen hoe content op kleinere schermen wordt weergegeven en hoe bepaalde soorten content geoptimaliseerd kunnen worden voor mobiele compatibiliteit.