Afbeelding plaatsen in illustratiekader (Place in frame)

uit de cursus Responsive websites maken met Adobe Muse

Leuk dat je onze site bezoekt,

Ben jij leergierig?. Jij abonnee en dan ik geef jou 5% korting op de eerste maand! Wat vind je daar van? gebruik als kortingscode: DIEHARD

Geef een reactie of stel een vraag

Geef een reactie

Registreer als je wilt reageren.

Deze website gebruikt Akismet om spam te verminderen. Bekijk hoe je reactie-gegevens worden verwerkt.

Responsive websites maken met Adobe Muse

perm_identity Belinda | video_library 71 video's | query_builder 06:00:26

Makkelijk websites maken met Adobe Muse

Leer hoe je met Adobe Muse websites maakt en publiceert. Dankzij de eenvoudige interface kan iedereen zonder voorkennis van HTML-code, CSS en/of JavaScript toch vrij eenvoudig een responsive website creëren en online publiceren. Jammer genoeg is Adobe gestopt met de verdere ontwikkeling van Muse maar het programma is nog steeds te downloaden en te gebruiken.

Doelgroep van deze cursus

Iedereen die websites wil leren maken zonder kennis te willen hebben van broncode, html, css en javascript.

Wat ga je leren

In deze online cursus leer je de verschillen tussen een statische, vloeiende en responsive website. Alle meest gebruikte vensters, gereedschappen en instellingen komen aan bod.  Direct vanaf de eerste instructievideo’s besteden we aandacht aan de meest snelle en efficiënte manier waarop je webpagina’s en -sites zou moeten maken. Dus werken met master pages en stijlen.

Interactieve media met JavaScript Widgets

Je leert de widgets van het programma toe te passen. Dit zijn voorgebakken JavaScript toepassingen waarmee je in een handomdraai bijvoorbeeld een fotogallerij, formulier en interactieve kaarten kunt maken.

Om ervoor te zorgen dat de website er goed uitziet op elk apparaat. Van mobiel, tablet tot desktop besteden we een volledig hoofdstuk aan Responsive Webdesign.

Vereiste voorkennis en vaardigheden

Dit progamma kan iedereen leren, het is laagdrempelig en werkt met het WYSIWYG-principe. Jij creëert prachtige webpagina’s met behulp van de gereedschappen, opties en instelvensters en Adobe Muse schrijft de benodigde code voor jou op de achtergrond weg.

Je kunt afbeeldingen ook plaatsen in een bestaande kaders.

Maar dan moet het wel een illustratiekader zijn die je hebt getrokken met de gereedschappen...

...‘Rectangle Frame Tool’ of ‘Ellipse Frame Tool’.

Frame betekent ‘illustratiekader’.

De gele vormen heb ik hiermee gemaakt, je herkent dit ook aan het kruis binnen de vormen.

De oranje vormen heb ik getekend met de gereedschappen 'Ractangle Tool' en 'Ellipse tool'.

Deze hebben geen kruis in de vormen staan.

Mocht jij de gekruisde lijnen niet zien.

Dan moet je wellicht onder View de optie 'Show Frame Edges' nog activeren.

Geen van de vormen staat geselecteerd.

Ik ga een afbeelding plaatsen via File > Place.

En ik kies opnieuw voor de afbeelding 'terras-plaza.jpg' en klik op "Open'.

De afbeelding verschijnt onder de cursor.

Loop met de muis naar een kader met een kruis erin.

Zie je hoe om het kader een selectierand verschijnt?

Hiermee geeft Muse aan dat hij dit kader nu als doelbestemming ziet voor de afbeelding.

Loop naar één van de oranje kaders. Nu gebeurt er niets.

Muse ziet deze kaders niet als mogelijk afbeeldingskader.

Als ik nu inklik met de muis.

Wordt de afbeelding geplaatst maar in een eigen illustratiekader.

Ik maak dit ongedaan met commando Z.

Als ik boven een illustratiekader loslaat.

dan wordt de afbeelding binnen dat kader geplaatst.

Ik plaats nogmaals een illustratie maar dan in het cirkelvormige illustratiekader.

Afbeeldingen worden proportioneel passend in het kader geplaatst.

Dus dat kan betekenen dat de afbeelding eigenlijk breder of hoger is.

Waarschijnlijk kijk je nu naar een deel van de afbeelding.

Dubbelklik met het selectie-gereedschap in het kader.

En je krijgt de afbeeldingsgrenzen in beeld.

Klik in op de afbeelding en je kunt deze binnen het kader verschuiven.

En zo de uitsnede bepalen.

Klik op een selectiepunt van de afbeeldingsgrens

En je kunt de afbeelding ook nog vergroten en verkleinen

Zodra je gaat schalen wordt het schalingspercentage direct weergegeven.

Zo zie ik dat deze afbeelding ongeveer op % verkleind in het kader werd geplaatst.

Heb je een afbeelding te groot of juist te klein in een kader staan.

Dan kun je die ook automatisch op maat erin laten plaatsen.

Ik maak ook deze afbeelding te groot voor het kader.

Deselecteer de afbeelding.

Klik opnieuw om het illustratiekader inclusief de afbeelding te selecteren.

Ga naar Object > Fitting.

Ik kies eerst voor de optie 'Fit Content Proportionally'.

De afbeelding wordt proportioneel en vullend geplaatst.

Maar nu zie ik wel gele kiertjes tevoorschijn komen boven- en onderin.

Dat komt omdat deze opdracht hoe dan ook de gehele afbeelding binnen het kader moet plaatsen.

Er mogen geen beeldpixels buiten het kader vallen.

Dat levert dan lege ruimte op boven- en onderin.

Omdat de afbeelding een andere verhouding heeft dan het kader.

Kijk maar! Dubbelklik op de afbeelding om de afbeeldingsgrenzen te zien.

Klik naast de afbeelding in het niets om te deselecteren. En selecteer opnieuw het illustratiekader.

Ditmaal druk ik met de rechtermuisknop ingedrukt op de afbeelding.

En kies ik uit het contextuele menu voor Fitting > Fill Frame Proportionally.

Opnieuw wordt het kader proportioneel gevuld.

Maar mogen beeldpixels wel buiten het kader vallen.

Als het hele kader maar gevuld wordt met de afbeelding.

Opnieuw dubbelklikken en je ziet nu deze delen van de afbeelding vallen buiten het kader.

Mocht je deze handeling vaak moeten verrichten.

Is het wellicht handig om de bijbehorende toetscombinaties te leren.

Ze staan weergegeven bij Object > Fitting.

En als laatste pas ik ook deze toe, beeldvullend in kader.