Overview
A great introduction to Web based multimedia is found at Multimedia Tutorial (2009)[1]
Browser media support
You can check what media your browser supports by going to http://html5test.com/
Multimedia
|
Assessed Activity 5.1 (2016) Multimedia [4 marks]
Activity
- Go to www.google.com and click on images. Click on the Advanced Search link.
- Search for the images, sounds, and movies listed below
- In your web site, create a page called multimedia.html, put a title and heading "Multimedia".
- Instructions
- Select an object you would like to search on (I will use a butterfly as an example). Once you have found the media element add to the multimedia.html page (Note: The element should be displayed on the page not as a link).
Images
- Use Advanced Google Search, EXACT PHRASE: butterfly.jpg, (or butterfly.png) This will find pictures of a butterfly
- Use Advanced Google Search, EXACT PHRASE: butterfly.gif, to find animated pictures of a butterfly
- Note: images need to be saved in the same folder as your html file.
Video
- Use Advanced Google Search, EXACT PHRASE: butterfly.avi or butterfly.mov, This will find movies of a butterfly.
- Notes:
- As YouTube is becoming the main source of videos on the Internet it may be difficult to find relevant ones. You can use ".mov samples" to get you started.
- HTML5 introduces the video tag, however only some video types are acceptable (mp4, WebM, and ogg). As an alternative to mov or avi you can use mp4, webm or ogg.
Audio
- Use Advanced Google Search, EXACT PHRASE: butterfly.wav, This will find sounds of a butterfly
- Note:
- HTML5 introduces the audio tag, however only some audio types are acceptable (mp4, wav, and ogg).
Interactivity/Animation
- Add an swf file to your web page
- Research the Canvas tag, and add an example to your web page (this may be a link to a page with the canvas tag used). This needs to be more than a coloured in canvas box!
Marking
- Marks will be awarded based on the completeness of your submission
|
Some sample media
References
- ↑ Multimedia Tutorial (2014). In w3Schools. Retrieved from http://www.w3schools.com/html/html_media.asp