Unit 2 Module 6: HTML Video.  Use the tag  Use the for adding closed captions or other timed text  Why learn coding skills?  From the experts 

Slides:



Advertisements
Similar presentations
Multimedia Web Site Design Chapter Building an Effective Web Site Creating a Web site is easy, but creating one that is useful and attractive takes.
Advertisements

HTML 5 and CSS 3, Illustrated Complete Unit K: Incorporating Video and Audio.
UNIT K: INCORPORATING VIDEO AND AUDIO 1 Encoding: the process of transforming moving image and/or sound into a digital file. Each encoding method known.
Able Player: A Fully Accessible Media Player Terrill Thompson, University of Washington Ken Petri, The Ohio State University These slides: goo.gl/D9ZG9t.
INF Web Design Using Multimedia on the Web Video - Part 1.
JavaScript 101 Lesson 01: Writing Your First JavaScript.
Universal Media Player Terrill (UMP)
Audio and Video on the Web Sec 5-12 Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development I” Course materials.
Session: 11. © Aptech Ltd. 2HTML5 Audio and Video / Session 11  Describe the need for multimedia in HTML5  List the supported media types in HTML5 
Chapter 11 Adding Media and Interactivity. Flash is a software program that allows you to create low-bandwidth, high-quality animations and interactive.
Daniel Pullin Web Developer | www.cadarn.ac.uk YOUR RESOURCES docx xlsx webm txt rar gz wav html js php.
 Using Microsoft Expression Web you can: › Create Web pages and Web sites › Set what you site will look like as you design it › Add text, images, multimedia.
Basic XHTML Module 2: XHTML Basics LESSON 1. Module 2: XHTML Basics LESSON 1 Lesson Overview In this lesson, you will learn to:  Write XHTML code using.
Dreamweaver MX. 2 Creating External Style Sheets-1 (p. 400) n A style is a group of formatting attributes identified by a single name. n An ________ style.
 In My.Wartburg you can add…  YouTube Videos  Films on Demand (Vogel Lib.)  Internet Pages With a Video  Anything with a URL (
Web Design Unit Assignment #2: Job Skills Favorite Links Page You will create a HTML web page with links to informational websites about a variety of job.
IT Introduction to Website Development Welcome!
Programming Games Show your cannonball. HTML5 video. Miro. Classwork/Homework: Acquire video, convert to multiple formats, and produce simple (just html)
Publishing a Macromedia Flash Movie – Lesson 131 Publishing a Macromedia Flash Movie Lesson 13.
Images, Hyperlinks, and Sound Module 2: XHTML Basics LESSON 3.
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 7 TH EDITION Chapter 2 Key Concepts 1 Copyright © Terry Felke-Morris.
Chapter 13-Tools for the World Wide Web. Overview Web servers. Web browsers. Web page makers and site builders. Plug-ins and delivery vehicles. Beyond.
Processing.js.
CSCI 1101 Intro to Computers 7.1 Learning HTML. 2 Introduction Web pages are written using HTML Two key concepts of HTML are:  Hypertext (links Web pages.
Working with Cascading Style Sheets (CSS) Module 2: HTML Basics LESSON 5.
1 Lesson 3 Power Techniques HTML and JavaScript BASICS, 4 th Edition Barksdale / Turner.
Computing Theory: HTML Year 11. Lesson Objective You will: o Be able to define what HTML is - ALL o Be able to write HTML code to create your own web.
Enhancing Your Web Site—Adding Links Web Page **YOU MUST HAVE COMPLETED THE 1ST 3 WEB PAGES BEFORE YOU CAN DO THIS ONE. **YOU SHOULD HAVE COMPLETED THE.
HTML Use of Multimedia on web page. HTML Media Q. How to call Image file in our web page ? A. That is the easy syntax for defining an image. 2.
IT204 - Web Scripting and Authoring I Introduction to Dreamweaver Unit 6.
The Internet and World Wide Web
Tutorial 7 Working with Multimedia. New Perspectives on HTML, XHTML, and XML, Comprehensive, 3rd Edition 2 Objectives Explore various multimedia applications.
Tutorial 7 Working with Multimedia. New Perspectives on HTML, XHTML, and XML, Comprehensive, 3rd Edition 2 Objectives Explore various multimedia applications.
Week 1 – Beginners Content McAfee & Big Fish Games CoderDojo.
HTML file format  Lesson Objective: Understanding HTML and how it is used to create web pages.  Learning Outcome:  Create a HTML page by interpreting.
Module 2. Lesson C – Part 2. Y AHOO ! S ITE B UILDER.
HTML ( HYPER TEXT MARK UP LANGUAGE ). What is HTML HTML describes the content and format of web pages using tags. Ex. Title Tag: A title It’s the job.
Using RSS Feeds for Distributing Videos Dr. Rick Jerz St. Ambrose University Davenport, Iowa 1.
Site Optimization Module 8: Web Publishing and Maintenance LESSON 3.
Unit 2, Lesson 7 Creating Web Pages and Web Documents.
External Style Sheets Exploring Computer Science – Lesson 3-6.
Invitation to Computer Science 6 th Edition Chapter 10 The Tower of Babel.
Creating and Editing a Web Page Using Inline Styles
FLASH, VIDEO & AUDIO How to add Flash movies into your site How to add video and audio to your site HTML5 and elements.
Using Text Edit. Create Folders to Organize a Site  Identify the location where you are storing your Web sites. Ask your teacher for help if needed.
Lists Module 2: XHTML Basics LESSON 8. Module 2: XHTML Basics LESSON 8 Lesson Overview In this lesson, you will learn to:  Create lists using XHTML code.
Chapter 8 Adding Multimedia Content to Web Pages HTML5 & CSS 7 th Edition.
Hstry.co Interactive Timelines. Sign Up for Hstry.co Easy as 1, 2, 3! Log in to Hstry.co and sign up as a teacher. You can sign up using your Google Account.
CHAPTER 8 Multimedia 1. Using Multimedia ❖ Multimedia: the combination of text, sound, and video to express an idea or convey a message. ❖ Podcasts: a.
Displaying Your Ideas on the Internet How to let everyone admire your project
Create Course with video lesson. Course Coverage What covered in this course? Video lesson creation – Using external site embed iframe tag – Using third.
XP New Perspectives on Creating Web Pages With Word Tutorial 1 1 Creating Web Pages With Word Tutorial 1.
How to embed video in html by kvisoft flip book maker pro Now, more and more people have personal website. It is a window in internet. Adding one video.
CHAPTER 10 AUDIO AND VIDEO. MEDIA PLAYER API HTML5 contains an API (Application Programming Interface) for controlling audio and video players embedded.
Tutorial: How to Creat a Website.
Chapter 4: HTML5 Media - <video> & <audio>
Audio and Video on the Web
Pattern Library Project
Audio and Video Chapter 10.
HTML5 Media.
Basic HTML and Embed Codes
Exercise 8 – Software skills
Unit 3 - A Digital Portfolio
About Multimedia Files
What is HTML?.
HTML Structure.
Intro to Web Development Homework Review
Multimedia Web Site Design
Lesson 7 Graphics.
Presentation transcript:

Unit 2 Module 6: HTML Video

 Use the tag  Use the for adding closed captions or other timed text  Why learn coding skills?  From the experts  Adding Video to pages

 MP4 File  WebM File  JPG File  VTT file Files associated with video

  You may also produce your own video  Producing your own video will require you to :  Produce the video – opportunity to work with video editing software  Convert the video to appropriate format (MP4 and WebM are preferred for cross-browser capability).  Video converter here:  You will need to caption the video:    The caption format needed for HTML is WebVTT Videos to use on your web page

 You will be checking video players in a variety of browsers  Chrome  Explorer  Mozilla  Etc.  Make sure that the file path is correct in order for the video to play  If video doesn’t work with a browser try it with another browser as it may be a browser issue Lesson 1: Adding Video to Web Pages

 Reading:  rs_h264_video_support_after_googles_vp8_fails_to_ga in_traction rs_h264_video_support_after_googles_vp8_fails_to_ga in_traction  Reflection Questions:  Who are the good guys in this conflict  Who are the bad guys? Lesson 1 (Continued)

 To add an uncaptioned video to your video.html file Lesson 1 Outcome