Overzicht van responsieve indeling

Responsieve functies worden niet ondersteund in AMP HTML-advertenties. Voor videoadvertenties, geanimeerde gif's en beeldadvertenties kunnen indelingen voor meerdere formaten worden gebruikt.

Bij een responsief ontwerp wordt gebruikgemaakt van een flexibele indeling die wordt aangepast aan verschillende viewportstanden of -formaten, zodat u niet meerdere indelingen hoeft te maken. Google Web Designer biedt verschillende tools waarmee u een responsief ontwerp kunt maken.

Google Web Designer biedt verschillende tools waarmee u een responsief ontwerp kunt maken. U kunt ook een vloeiende indeling maken door objectformaten en -posities in te stellen met percentages. Als u elk element wilt aanpassen voor verschillende viewportformaten of formaatbereiken, gebruikt u mediaregels.

Beeldadvertenties kunnen niet responsief zijn. Ze kunnen wel de responsieve workflow in een indeling voor meerdere formaten gebruiken om verschillende formaten uit 1 document te exporteren.

Afmetingen van responsieve pagina's

Het volledige document responsief maken

Bij responsieve documenten moeten de breedte en hoogte van de pagina op 100% worden ingesteld, zodat alle beschikbare ruimte op het scherm wordt gevuld.

  • Bestaande documenten: Vink in het deelvenster Responsief het selectievakje Responsieve indeling aan.

  • Nieuwe bestanden: Vink in het dialoogvenster Nieuw bestand het selectievakje Responsieve indeling aan als u afmetingen opgeeft. (Deze optie is niet voor alle bestandstypen beschikbaar.)

Als u de content op de pagina responsief wilt maken, kunt u de vloeiende indeling en mediaregels gebruiken.

Vloeiende indeling

Formaten en posities op basis van een percentage

Overzicht van het gebruik van procenteenheden

Naast de pagina-afmetingen kunt u ook het formaat en de positie van elementen opgeven met percentages in plaats van pixels. Als u percentages opgeeft, blijven het formaat en de uitlijning van een element ten opzichte van de bovenliggende container behouden, ook als de bovenliggende container wordt gewijzigd.

Als u elementen uitlijnt, kunt u met de optie Vloeiende indeling voor de tools voor uitlijning en distributie makkelijk posities op basis van een percentage instellen.

Mediaregels

Kenmerken en css-stijlen overschrijven voor verschillende standen en formaten

Met mediaregels kan uw document het formaat en de stand van een viewport waarnemen en op basis daarvan verschillende stijlen en kenmerken toepassen. Op een telefoon kan content bijvoorbeeld in één kolom worden weergeven, terwijl dezelfde content op een tablet in twee kolommen wordt weergegeven. Deze wijzigingen (die overschrijvingen worden genoemd) vinden plaats voor opgegeven formaten of formaatbereiken.

In het deelvenster Responsief kunt u schakelen tussen verschillende sets met regels:

  • Standaardregels: Selecteer Basisdocument bewerken als u wijzigingen aanbrengt in de standaardset met stijlen of als u wijzigingen aanbrengt die van toepassing zijn op alle viewportformaten (zoals toevoeging of verwijdering van items, componenten of gebeurtenissen).
  • Mediaregels: Selecteer een specifiek formaat of een formaatbereik om de standaardstijlen en -kenmerken voor dat viewportformaat te overschrijven.

Als een mediaregel is geselecteerd, kunt u stijlen en kenmerken instellen die alleen van toepassing zijn op dat formaat of formaatbereik. U kunt bijvoorbeeld de positie, het formaat, de bron, de zichtbaarheid of de animatie van een element aanpassen. Met Google Web Designer kunt u ook tekstcontent, instellingen voor tekstaanpassing en componenteigenschappen overschrijven.

Meer informatie over mediaregels en overschrijvingen.

Was dit nuttig?

Hoe kunnen we dit verbeteren?

Meer hulp nodig?

Probeer de volgende stappen:

Zoeken
Zoekopdracht wissen
Zoekfunctie sluiten
Hoofdmenu
17361553172383945408
true
Zoeken in het Helpcentrum
true
true
true
true
true
5050422
false
false
false
false