Adding media to your page

Adding an image

1. Images are best added on a line on their own so create a new line & simply click the "Media picker" in the editor bar [] and the "Select media" sidebar will open (usually in the root folder)
   
2. Navigate through the folders to the one containing your image
3. Click on the image and the media link will be inserted but the "Alternative text" left blank
   
4. If the image is "decoration" you can leave the alternative text blank - all other images must be described (this is a requirement of the Equalities Act)
5. Hit "Submit" and your image will appear
6. You can select the image (it will turn blue) and drag a corner to resize it
   (Be careful increasing the size of images as the quality can be reduced)

Adding a link to a file

The only difference between adding an image and linking to a file is that you have to use text on your page to handle the links.

1. Add a piece of text you can use to link through to the file
   The text should be a "call to action" and meaningful (don't use "click here")
   Note: This is an Equalities Act requirement, based on WCAG 2.4.4
   Link Purpose (In Context)
   eg:
   
   • Read the Umbraco editors guide
     not
   • To read the Umbraco editors guide click here
2. Select the text you will be turning into a link and use the link button [] to open the link sidebar - the "Link to file" button is slightly hidden between the "Select" and "Cancel" buttons at the bottom of the sidebar
   
3. The file selector side bar is similar to the image select sidebar you used above - click down through the folders to find your file
   
4. Once you've selected the file Umbraco fills in the link and allows you to change  the title (by default the miedia item title) and "Target"
   (normally you should leave this unchanged - see "Notes on Targets" below)
    
5. Hit "Select" and your text will be linked to the file.

Notes on Targets

You can open links on web sites in several ways, the most common of which are:

1. In the same window/tab which allows you to move back and forward between the pages you have visited by using the back & forward buttons on your browser
   This is the default behaviour
2. In a new window/tab which breaks the back button - you need to close the window/tab to move back to the original window/tab.
3. In the full body of the window - this only applies to "framed" sites
4. In the parent frame - also "framed" sites

Umbraco offers the option to change the default behaviour to one of the options 2, 3 or 4 but unless you have very good reasons to do this you shouldn't.

There are plenty of bad reasons to open links on new pages and few good reasons.

Bad reasons to open in a new page/tab

• Because you like it that way.
  This means changing default behavior. You may like opening all links in new windows/tabs but most users are comfortable with the default behavior.
• Because you want users to never leave your page.
  Other sites should have normal-style links, but our site is special. Our site is more important and should never be left behind.
• "Internal" links and "External" links are different.
  Some people think this is "a convention." It's not.
• The link is to a PDF
  A PDF (or other "file") is no different to any other web link? You can still use the back button to come back from it.
• My boss/client wants it that way
  Aer they web user experience experts? No! If they don't trust you with this, what do they trust you about? Explain the default and refer them to the Digital Team if they are particularly difficult.

Good reasons to open in a new page/tab

• There is media already playing
  For instance: music, video, a podcast. If you want users to be able to open a new link and still hear the media you can open a new page/tab.
• The user is working on something on the page, that might be lost if the current page changed.
  A good example would be filling in a form & they need to check terms & conditions
  "Reading an article" doesn't qualify.
• Some technologically obscure reason
  I'd be surprised if you find on on our site, but if you do let me know.