New labeling for external links and file downloads

Adding additional labeling for links that 'open in new window', providing a clear label that the link users are about to click will open the content in a new browser tab or window, and for links that download a file, that they are about to download a specific type of file and how large it will be. 

This new feature will affect many pages on most sites. 

• When users click on a link and are taken without warning off the current page, and possibly to another site, unless it is clear they are “transporting” there is a momentary (and sometimes more than momentary) pause while they realize they are in a new place.
  • These new icons are a technique we have successfully used before to educate the user that they are about to click off the current page of your site and be pushed into a new browser tab or window.
  • This additional labeling minimizes the “magic transportation” issue that Rebecca is always referring to, by providing advance notice how the link will function.
• Extended labels for downloadable files educate users as to what they will be downloading (size, file types). In mobile, the choice of what and how much to download is critical depending on your device size and bandwidth you are using.

Special icons and file size will be added to certain links.

1. Links that are set to ‘open in new window’ will have an additional icon. That includes links in Body Text, as well as Lists, Titles, Calls to Action and Callouts.  (This will not occur for Buttons or linked images.)
2. Links to downloadable UBCMS files will have a corresponding file type icon and file size. (Documents housed outside the UBCMS will have the icon but not the file size.)

• External Link Icon:
  • The new “open in new window” labeling will affect any link in any part of a page that is explicitly marked by the author or html/external embed developer as opening in a new window (i.e. <a target=…>).
  • Labeling is only applied to the text of links, i.e. for components that use the rich-text editor (Body Text, Caption, Intro Text) or that have a built in link setting (Title, Call to Action, Lists).  Photos, linked images in Photo Teasers and Buttons are not affected.
    
• Downloadable File Icon:
  • The new downloadable file labeling will affect any link in any part of a page that downloads a file, as defined by the URL having one of these extensions: zip, pdf, doc, ppt, xls, jpg, tif, png, gif, eps.
  • There are two versions of the download file icon, one for images, and one for documents.
  • File size will generally be shown for documents that are in the UBCMS, either embedde din the page, or in the DAM.
    
  • File size will generally NOT be shown for sites outside the UBCMS or secure sites such as:
    • Files from a server with a different name in the URL (e.g. files on www.irs.gov from www.buffalo.edu)
    • Files that require login (unless the user is already logged in).
    • Files with insecure URLs (http) linked from pages with a secure URL (https) (the reverse is ok).
  • Labeling is only applied to the text of links, i.e. for components that use the rich-text editor. Photos, and linked images in Photo Teasers are not affected.
  • This labeling will be applied to external embeds and HTML components. Developers may wish to use special CSS to hide them if necessary.