Scribd
Upload
33 views

Multimedia!: Adding Video and Audio Materials!

The document discusses HTML5 audio and video elements, describing their purpose, common attributes, and how to set clips. It also covers plugins that may be required if browsers do not support the new tags, and accessibility issues to consider like providing text descriptions and closed captioning.

Uploaded by

Riajimin
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
33 views

Multimedia!: Adding Video and Audio Materials!

The document discusses HTML5 audio and video elements, describing their purpose, common attributes, and how to set clips. It also covers plugins that may be required if browsers do not support the new tags, and accessibility issues to consider like providing text descriptions and closed captioning.

Uploaded by

Riajimin
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 9

INTRODUCTION

02.07 Multimedia TO HTML

Multimedia!

Adding video and audio materials!


INTRODUCTION
02.07 Multimedia TO HTML

Objectives!

•  Describe HTML5 audio and video


elements!
•  Explain the purpose of plugins!
•  Reflect on Accessibility issues!
INTRODUCTION
02.07 Multimedia TO HTML

HTML5 Multimedia!

•  Designed to avoid the use of extra


software to play music/video!
!
•  Not fully implemented!
INTRODUCTION
02.07 Multimedia TO HTML

Video element <video>!


•  Video tag uses a src attribute or embedded <source>!
•  Common attributes!
•  height, width!
•  autoplay!
•  loop!
•  controls!
•  Text inside <video>..</video> is displayed if browser can
not support tag!
!
INTRODUCTION
02.07 Multimedia TO HTML

Audio element <audio>!


•  Audio tag uses a src attribute to link to audio
file, typically .mp3 or .wav!
•  Common attributes!
•  autoplay, controls, loop!
•  buffered!
•  muted!
•  volume!
INTRODUCTION
02.07 Multimedia TO HTML

Setting clips!
•  You can set both the video and audio elements
to play clips by adding to the src attribute.!
•  .ext#t=5, 25!
•  .ext#t=, 39!
•  .ext#t=, 1:38:45!
•  .ext#t=42!
INTRODUCTION
02.07 Multimedia TO HTML

Plugins!

•  Before HTML5 there was no standard for


video display, plugins were required!

•  Since not all browsers support new tag


some may require Flash!
INTRODUCTION
02.07 Multimedia TO HTML

Accessibility Issues!

•  Make sure to provide links to plugins!


•  Include text descriptions and closed
captioning (or other equivalent content)!
•  Multimedia should enhance your content, not
be a distraction!
INTRODUCTION
02.07 Multimedia TO HTML

Acknowledgements/Contributions!
These slides are Copyright 2015- Colleen van Lent as part of http://
www.intro-webdesign.com/ and made available under a Creative
Commons Attribution Non-Commercial 4.0 License. Please maintain
this last slide in all copies of the document to comply with the
attribution requirements of the license. If you make a change, feel free
to add your name and organization to the list of contributors on this
page as you republish the materials.!
!
Initial Development: Colleen van Lent , University of Michigan School of
Information!
!

You might also like