in our previous post we looked at how and why EverWeb’s Assets tab is good to know about. We explored how you can easily add and manage images and other media to your EverWeb made site.
In this post we’re going to take a deeper look at the Assets tab so that you can get most out of its asset management capabilities.
Managing Your Media Assets Using EverWeb’s Assets Tab
If your website uses only a few images, or other media, you may not think about using the Assets Tab’s management features. It’s worth knowing, however, that there are some useful tools and features available, no matter how many images your project has. using these asset related features can have a direct impact on your project, your site and its performance.
Checking For, and Replacing, Large Image File Assets
One of the things that can drag down the loading of your website’s pages is media that takes a long time to load on the page. Essentially, when you’re building your site, you should always optimize media content before adding it to your site if possible. Typically this will mean checking to make sure that your image files are of a size where they will load quickly when the page is accessed by your visitors. If you find that one or more pages in your site loads slowly, it could be that one, or more, images on the page hasn’t been optimized. You can use the Assets tab to quickly check to see which assets in your project file take up too much space. Simply click on the Assets tab then click on the Settings button (i.e. the ellipse – three dots in a row – within a circle.) You will then see a sub-menu of options. If it not already checked, click on the ‘Show File Info’ option. If this option is already checked, just click away from the menu to close the menu.
Once you have ‘Show File Info’ selected, you’ll see detailed information about the image and media files that populate your Assets list. This information includes file size. To easily see if you have large files, sort the assets list by size. To do this, click on the Settings icon then check the ‘Sort by File Size’ option if it’s not already checked.
If you find that you do have large image files, it’s best to go back to the original file and edit it to reduce its file size. We recommend leaving the source file in touch and make a copy for editing purposes. If the image file is in a PNG format you can quickly save file space by converting it to JPG format, if it’s appropriate to do so. A second easy way to reduce file size is by reducing the physical dimensions of the image before brining it in to EverWeb. This information is also contained in the asset’s File Info. For example, if you have an image sized at 1920×1280 pixels, you might want to reduce this down to 1000×677 pixels instead. Remember when resizing an image file to constrain its proportions so that when you adjust the horizontal value, the vertical value automatically adjusts to keep the same image proportions as the original image.
Once you have created a smaller version of the original file, add it back in to your project file. The easy way to do this, is to select the original large image file asset in the Assets list. Right, or secondary click on the image asset, then select the option to ‘Replace Asset’. Select your smaller sized image file. Using this method means that all of the large image file assets throughout the pages of your project file will be replaced with the new, smaller asset. This obviously will save you lots of time and effort.
Reducing Project File Size
If you have many image file assets in your project file, you may find that you don’t always use all of them. In this case you should remove such image files that are no longer needed. The advantage of removing these unused assets is that it reduces the size of your project file on disk. Your project will then load faster in EverWeb itself and will also keep editing pages snappy within your project.
To remove image files you no longer need, go to the Assets tab, then click on the Settings icon again. Choose the ‘Find Unused Assets’ option. EverWeb will scan the project for any assets that are not used. At the end of the scan a dialog box with the results of the search appears. If you choose ‘Yes’, the selected assets will be removed. If you choose ‘No’, the assets will not be removed but you will see them highlighted in the Assets list. This is useful as you can then scroll through the Assets list to double check that the selected assets are ones you want to remove. If this is the case, press the backspace key on your keyboard to remove them. You will be asked to confirm the deletion, or to cancel.
Good To Know Tips About Managing Assets in the Assets Tab
There are a few other useful options of note for managing assets in your Project’s Assets list. The first is the option to select all the assets that are being used on the current page. You can find these by going to the Settings button in the Assets tab then selecting the ‘Select All Assets on Current Page’ option.
The next useful option is the Delete Asset option. When you use this option, the image file will be removed from the project. When deleting an image from the Assets list, you may still see it in the Editor Window afterwards. Our advice here is to click to another page in the Web Page List, then click back to the original page that had the image asset displayed on it. You should now see a placeholder icon instead of the deleted image. To replace the placeholder icon, simply drag and drop another image file on top of it. Alternatively, select the placeholder, then go to the Shape Options tab and choose an image file using the ‘Choose…’ button in the Fill section.
The last option of note is the ‘Find Pages Using Asset’ option. As we mentioned in our previous post, you only need to add assets once to the Assets list. from there you can use them as many times in your project as you want. Use the ‘Find Pages Using Asset’ option to find the pages in which the asset is displayed. Again this option is found just by right, or secondary, clicking on the asset you want to find, then choosing the ‘Find Pages Using Asset’ option. You will see the pages using the asset highlighted in the Web Page List on the left hand side of the EverWeb User Interface.
EverWeb’s Asset management features are robust so make fast work of managing images and other media. In our last instalment about Assets in EverWeb we will take an in-depth look at organising your project’s assets.
Comments