Samenvatting
Een afbeelding zet je in een element met het veld Afbeelding, op het tabblad Instellingen. Naast dat veld staan twee knoppen: de een opent het bestandsbeheer, de ander maakt de keuze weer leeg.
Onder dat veld staan nog twee velden. Afbeelding grootte laat het bestand kleiner opslaan, en Afbeelding vulkleur laat je opmaak de kleuren van een SVG-bestand bepalen.
Je kunt per schermgrootte een ander bestand kiezen. De maat die je kiest, geldt voor alle schermgroottes samen.
De gelijknamige velden op het tabblad Opmaak horen bij de achtergrond van een vlak. Die staan in Kleuren en achtergrond.
Wanneer gebruik je dit?
Je gebruikt dit als er een foto, een logo of een icoon op je pagina moet. Elk element met een afbeeldingveld werkt op dezelfde manier.
Je gebruikt het ook als je pagina te langzaam laadt. Een bestand dat kleiner is opgeslagen, kost minder laadtijd.
Wil je bepalen welk deel van je foto in beeld blijft, dan is dat een ander onderwerp. Dat staat in Verhouding en uitsnede.
Wil je beeld pas laten laden zodra de bezoeker in de buurt komt, gebruik dan Lazy load.
Hoe werkt dit in Mach3Blocks?
De drie velden staan onder elkaar op het tabblad Instellingen, en zij staan niet bij elk element. Welke velden je ziet, volgt uit de soort die je hebt geselecteerd.
| Veld | Bij welke elementen | Bijzonderheden |
|---|---|---|
| Afbeelding | de vijf media-elementen, de drie iconen en de zeven controls | je kunt hier per schermgrootte een ander bestand kiezen |
| Afbeelding grootte | dezelfde vijftien, plus de zeven tekstelementen | vraagt het recht Websites/presentaties stijlen |
| Afbeelding vulkleur | dezelfde tweeëntwintig elementen | vraagt hetzelfde recht en doet alleen iets bij een SVG-bestand |
Een tekstelement heeft dus wel de maat en niet de bestandskeuze. De maat geldt daar voor elke afbeelding binnen die tekst.
Het veld Afbeelding
Het veld zelf toont welk bestand er staat. Zodra je een bestand hebt gekozen, lees je de bestandsnaam af zodra je het veld aanwijst.
De knop Bladeren opent het bestandsbeheer. Daar zoek je het bestand op en wijs je het aan. Het uploaden en het ordenen van bestanden hoort bij een ander scherm.
De knop Wissen haalt de keuze weer weg. Zolang er geen bestand is gekozen, is die knop niet aanklikbaar.
Naast het veld staat de knop Schermgrootte waarde toevoegen. Daarmee kies je op een smaller scherm een ander bestand dan op een breed scherm.
Het veld Afbeelding grootte
Dit veld slaat je bestand kleiner op. Je kiest een maximale breedte, een maximale hoogte, of beide.
| Keuzelijst | Wat je kunt kiezen | Bijzonderheden |
|---|---|---|
| Maximale breedte | Geen, 240px, 320px, 480px, 640px, 960px, 1280px of 1920px | hieruit volgen ook de varianten voor smallere schermen |
| Maximale hoogte | dezelfde acht keuzes | levert wel een kleiner bestand op, maar geen varianten |
Beide lijsten staan standaard op Geen. Kies de maat waarop je afbeelding op je pagina het grootst wordt getoond.
Je hoeft daarbij geen ruimte in te bouwen voor schermen met een hoge resolutie. Het platform maakt zelf de varianten die zulke schermen nodig hebben.
Het veld Afbeelding vulkleur
Dit veld is een vinkje en staat standaard uit. Zet je het aan, dan komt een SVG-bestand als echte tekening in je pagina te staan.
Daardoor kan je opmaak de kleuren van die tekening overschrijven, met het opmaakveld Vulkleur. Bij elk ander bestand gebeurt er niets.
Stappenplan
- Open de pagina in de editor.
- Selecteer het element waar de afbeelding in moet.
- Open het tabblad Instellingen in het instellingenpaneel.
- Klik op Bladeren naast het veld Afbeelding.
- Wijs het bestand aan in het bestandsbeheer.
- Kies een Maximale breedte bij het veld Afbeelding grootte.
- Controleer de afbeelding op het canvas.
Voorwaarden en rechten
Voor het veld Afbeelding is geen recht nodig. Wie het instellingenpaneel kan openen, kan een bestand kiezen.
De twee velden eronder vragen wel het recht Websites/presentaties stijlen. Zonder dat recht zijn Afbeelding grootte en Afbeelding vulkleur niet zichtbaar.
Het aanwijzen van een bestand gebeurt in het bestandsbeheer. Dat scherm vraagt geen apart recht; wie de website kan openen, kan daarin een bestand aanwijzen.
Gevolgen en beperkingen
Een bestand dat kleiner is opgeslagen, laadt sneller. Dat is het enige gevolg dat je bezoeker merkt van de maat die je kiest.
| Wat je instelt | Wat je ervan terugziet |
|---|---|
| geen maat | je bestand blijft zoals het is, en krijgt varianten op zijn eigen breedte |
| een maximale breedte | een kleiner bestand, plus varianten voor smallere schermen |
| alleen een maximale hoogte | een kleiner bestand, zonder varianten voor smallere schermen |
| een maat op een SVG-bestand | geen kleiner bestand, want die soort valt buiten de vijf |
- De maat geldt voor alle schermgroottes samen. Alleen de bestandskeuze kan per schermgrootte verschillen.
- Een afbeelding mag hoogstens 10 MB zijn en moet een van twaalf formaten hebben. Die grenzen staan in Technische grenzen.
- Staat er ook een video in hetzelfde element, dan wordt je afbeelding het voorbeeldbeeld. Er komt dan een afspeelknop over de afbeelding heen.
- Het veld Afbeelding vulkleur bestaat niet op een website die nog op een oudere platformversie staat.
- Je bezoeker ziet de wijziging pas nadat je de website opnieuw hebt gepubliceerd.
Als het niet lukt
- Zie je de twee velden onder de bestandskeuze niet, dan mist je gebruiker het recht Websites/presentaties stijlen. Vraag het aan bij de beheerder van je account.
- Is Wissen niet aanklikbaar, dan staat er nog geen bestand in het veld.
- Doet het vinkje voor de vulkleur niets, dan is je bestand geen SVG. Kies een SVG-bestand of laat de kleuren zoals ze zijn.
- Blijft je bestand even groot na het kiezen van een maat, dan valt de soort buiten de vijf soorten die worden verkleind.
- Zie je op een smal scherm een andere afbeelding dan verwacht, dan staat er een aparte keuze voor die schermgrootte.
- Vind je het veld Afbeelding helemaal niet, dan hoort het niet bij dat element. Selecteer het media-element eromheen.
- Mist het veld voor de vulkleur helemaal, dan kent jouw website dat veld nog niet.
- Ziet je bezoeker het verschil niet, dan is de website nog niet opnieuw gepubliceerd.