Leer hoe u SVG-afbeeldingen importeert in Adobe Muse CC. U kunt SVG-afbeeldingen plaatsen, kopiëren en importeren in Adobe Muse.

Opmerking:

Adobe Muse voegt geen nieuwe functies meer toe en stopt op donderdag 26 maart 2020 met de ondersteuning. Zie de pagina Einde van levensduur voor Adobe Muse voor meer informatie en assistentie.

In Adobe Muse kunt u vectorafbeeldingen die zijn gemaakt met programma's zoals Adobe Illustrator, in uw site-ontwerp opnemen. Adobe Muse biedt nu ondersteuning voor de SVG-indeling (Scalable Vector Graphics). U kunt de SVG-indeling gebruiken om logo's, pictogrammen, achtergrond- en browservullingen, enz. te maken, en deze rechtstreeks op het webpaginacanvas in Adobe Muse te plaatsen.

Afbeeldingen die worden opgeslagen in de SVG-indeling, zijn licht- en resolutieonafhankelijk. Ze kunnen daarom worden geschaald tot elke gewenste afmeting zonder dat dit gevolgen heeft voor de tijd die nodig is om de pagina te laden of voor de weergave van uw site. SVG-bestanden worden ook ondersteund op HiDPI-schermen. 

Aangezien SVG-bestanden resolutieonafhankelijk zijn, worden ze in Adobe Muse op dezelfde manier behandeld voor zowel websites met standaardresolutie als voor sites met hoge resolutie. SVG-bestanden worden niet verkleind tot een grootte die de helft is van de oorspronkelijke grootte wanneer ze worden geplaatst op het webpaginacanvas in de ontwerpweergave.

SVG-bestanden verwerken vóór plaatsing in Adobe Muse

Opmerking:

De volgende procedure geldt alleen als u Adobe Muse 2015.1 of een eerdere versie gebruikt.  

Ga als volgt te werk voor SVG-bestanden die zijn gemaakt in Adobe Illustrator:

  1. Selecteer in Adobe Illustrator, nadat u de afbeelding hebt ontworpen, Bestand > Opslaan als.

  2. Selecteer SVG in de vervolgkeuzelijst Opslaan als. Blader naar de locatie waar u het bestand wilt opslaan en klik op Opslaan.

  3. Stel in het dialoogvenster met SVG-opties de volgende kenmerken in:

    • Afbeeldingslocatie: Insluiten
    • SVG-profielen: SVG 1.1
    • Lettertypen - Tekst: Omzetten in omtrek
    • CSS-eigenschappen: Presentatiekenmerken
    • Aantal decimalen: 3
    • Codering: Unicode (UTF-8)
    Geef de SVG-instellingen op in Adobe Illustrator voordat u het SVG-bestand in Adobe Muse CC importeert.
  4. Klik op OK om het bestand op te slaan.

SVG importeren

Als u versie 2015.1 of eerder van Adobe Muse gebruikt, dient u de stappen uit te voeren die worden beschreven in SVG-bestanden voorbereiden voor plaatsen in Adobe Muse voordat u een SVG-bestand importeert en plaatst in Adobe Muse.  

  1. Selecteer in Adobe Muse Bestand > Plaatsen (Ctrl + D in Windows en Cmd + D op Mac).

  2. Blader naar de locatie van het SVG-bestand, selecteer het bestand en klik op Openen.

  3. In Adobe Muse wordt naast de aanwijzer een miniatuurvoorvertoning van het SVG-bestand weergegeven. Klik op een geschikte locatie op het webpaginacanvas om het SVG-bestand te plaatsen. Het geplaatste bestand wordt vermeld in het deelvenster Middelen.

    Deelvenster Middelen

Na het plaatsen van het SVG-bestand kunt u doorgaan met het ontwerpen van uw website. U kunt de SVG-afbeelding uitsnijden met de tool Uitsnijden en het formaat van de SVG-afbeelding aanpassen aan uw ontwerpbehoeften.

SVG kopiëren uit Adobe Illustrator

Met Adobe Muse kunt u inhoud kopiëren van Adobe Illustrator naar het canvas voor de webpagina. Dit kan handig zijn als u niet de volledige inhoud van een illustratie in uw site-ontwerp wilt opslaan en gebruiken.

Wanneer u delen van een illustratie kopieert, wordt de selectie in Illustrator omgezet in SVG en op het klembord geplaatst zodat deze in Adobe Muse kan worden gebruikt. In Adobe Muse wordt de gekopieerde inhoud behandeld als ingesloten SVG en u kunt het formaat van de afbeelding aanpassen volgens uw ontwerpwensen.

  1. Voer een van de volgende bewerkingen uit in Adobe Illustrator:

    • Groep isoleren of Geselecteerd pad: klik met de rechtermuisknop op de groep die of het pad dat u wilt kopiëren en selecteer Groep isoleren/Geselecteerd pad in het contextmenu.
    • Groep of pad handmatig selecteren: selecteer een groep die of pad dat u wilt kopiëren.
    Een groep of pad selecteren
  2. Gebruik Ctrl + C (Windows) of Cmd + C (Mac) om de geselecteerde groep of het geselecteerde pad te kopiëren.

  3. Gebruik in Adobe Muse Ctrl + V of Cmd + V om de geselecteerde groep of het geselecteerde pad op het webpaginacanvas te plakken in de ontwerpweergave.

    Webpaginacanvas

    Het geplakte SVG-bestand wordt vermeld in het deelvenster Middelen.

    Deelvenster Middelen

SVG importeren voor achtergrond- en browservullingen

  1. Afhankelijk van de vraag of u een achtergrondvulling of een browerservulling wilt toevoegen, selecteert u het menu Vulling of Vulling browser. Zie De opties Vulling en Vulling browser gebruiken voor meer informatie.

  2. Klik op Afbeelding toevoegen. Blader naar de locatie van het SVG-bestand, selecteer het bestand en klik op Openen.

    Klik op Afbeelding toevoegen
  3. Geef de juiste instellingen op voor de kenmerken Aanpassen en Positie.

    Geef de juiste instellingen op voor de kenmerken Aanpassen en Positie

Opmerking:

Wanneer de SVG-bestanden worden toegevoegd aan de achtergrond- of browservulling, wordt de afbeelding, omgezet in pixels, weergegeven in de ontwerpweergave wanneer het kenmerk Aanpassen is ingesteld op Schalend inpassen of Schalend vullen. Wanneer echter een voorvertoning van de afbeelding in Adobe Muse of een browser wordt weergegeven, is de weergave zoals verwacht.

SVG-afbeeldingen toevoegen aan presentaties

U kunt SVG-afbeeldingen toevoegen aan presentaties in versie 2015.1 en hoger van Adobe Muse. Sleep en plaats eerst een miniatuurwidget uit de widgetbibliotheek. Selecteer vervolgens de vectorafbeeldingen uit uw Creative Cloud Libraries en plaats deze in uw presentatie.

Videozelfstudie

Videozelfstudie
Danielle Beaumont

Dit werk is gelicentieerd onder de Creative Commons Naamsvermelding/Niet-commercieel/Gelijk delen 3.0 Unported-licentie  De voorwaarden van Creative Commons zijn niet van toepassing op Twitter™- en Facebook-berichten.

Juridische kennisgevingen   |   Online privacybeleid