SVG stands for Scalable Vector Graphics. You can save your designs created in Adobe Illustrator in this format and place them on your website designed with Adobe Muse.
Now you should be thinking… Why should I save my logos or icons in SVG instead of PNG or JPG? The main reason is that SVG format is light and resolution independent. This means that the graphics can be scaled to any dimension without affecting the page-load time or the resolution of the element in your site.
In this tutorial you are going to learn how to save graphics in SVG format using Adobe Illustrator and how to use SVG in Adobe Muse.
We are going to use these Round Flat Icons package from Freepik.com for this tutorial. You can use these icons or design your own.
SAVE GRAPHICS IN SVG
- In Adobe Illustrator CC 2017, select the whole icon (you can group it to save time) and drag it to the Asset Export Window.
- In Format options choose SVG. Click on Export and choose the location.
For older versions of Adobe illustrator:
Select the whole icon -> Right click -> Export Selection
A window will open. Choose the location and change the format to SVG. Click on Export and it is done.
USE SVG IN ADOBE MUSE
- Drag the SVG element into Muse. You can drag more than one element at a time. You will notice that your mouse arrow has a number when you drag more than one element.
2. Click on the white canvas to place the SVG. Click and drag to resize the svg element. One of the benefits of using svg in Adobe Muse is that you can resize the graphic in Muse.
This is a basic tutorial using svg icons. You can save any graphics into svg and use them as static backgrounds or slideshows.
Check this tutorial for more detailed information.
