Expression Web/HB Tours Site/Working with Media

From virtualMV2015wiki
Jump to: navigation, search
 Home  Expression Web <

In this short tutorial we will look at how to work with media such as images, sounds, animation and videoon your web page

Icon Objective.png


By the end of this page you should be able to:


Icon Activity.png Activity: Resizing images

Icon Activity.png Activity: Positioning images

Icon Activity.png Activity: Editing images

Setting transparent colour

One thing you can do to give your site a professional look is to make one of the colours in your image transparent, so it appears to float on your page. The following two images are essentially the same, however the one on the right has had the orange area set to transparent.

  1. Save the image with the orange background to your images folder
  2. Open up the links page (links.html)
  3. If the file is not showing in the Folder List panel you may need to refresh the list (press [F5] )
  4. Drag the image from the _ Folder List _ tab onto the left hand panel
  5. Click on the image to make the drag handles appear
  6. Right click on the image and select  Show Pictures Toolbar  (if it is already showing you will not need to do this)
  7. Click on the  Set Trsansparent Button  button, then click on the orange area in the image.
    • This will make the orange area transparent.


  • When you save the page EW will ask if you want to save your image. If you say  OK  then the image on the disk will be replaced. So make sure you always work with a copy of your image
  • EW has a fairly basic transparency option, and will convert your image into a GIF file. This can create a lot of "noise" in your picture if you ar e using a jpg or png file. If you want transparency it is generally better to use png and create the transparency in a drawing program (like Photoshop or Paint.NET)




Expression Web/HB Tours Site/Working with Media. (2019). In virtualMV's ( Michael Verhaart ) wiki. Retrieved March 22, 2019, from    (zotero)