HTML5 Digital Classroom
3.0 (1 rating)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
20 students enrolled
Wishlisted Wishlist

Please confirm that you want to add HTML5 Digital Classroom to your Wishlist.

Add to Wishlist

HTML5 Digital Classroom

HTML5 Digital Classroom
3.0 (1 rating)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
20 students enrolled
Published 2/2012
English
Price: $50
30-Day Money-Back Guarantee
Includes:
  • 11.5 hours on-demand video
  • Full lifetime access
  • Access on mobile and TV
Have a coupon?
Description

HTML5 Digital Classroom covers the fundamentals of HTML5 including new syntax and form features, use of multimedia as well as supporting technologies including Geolocation, Canvas, Offline Storage and CSS3 styling and media queries. Included in this video training package are lessons covering the fundamentals of CSS layout which remain essential for understanding how HTML5 page and web applications work.  83 video lectures within 15 chapters explain layout fundamentals, HTML5 essentials and an introduction to mobile design of websites. Over 11 hours of total video content!

About the presentor:

Jeremy Osborn is director of content at American Graphics Institute (www.agitraining.com). He is the co-author of the HTML5 Digital Classroom, and has contributed to several books on web technology, including the Dreamweaver Digital Classroom. He brings more than 15 years of experience in web and graphic design, filmmaking for both print and digital media to his work at American Graphics Institute (AGI). At AGI, Jeremy also provides professional development training for corporate clients. Jeremy holds an MS in Management from the Marlboro College Graduate Center, and a BFA in Film/TV from Tisch School of the Arts at NYU.

Students Who Viewed This Course Also Viewed
Curriculum For This Course
Expand All 83 Lectures Collapse All 83 Lectures 11:15:16
+
Defining HTML5
2 Lectures 19:10

In this section you’ll receive a quick tour of key concepts and  features from the HTML5 core. Specifically, the new HTML5 syntax for web pages,web forms, and support for multimedia.

Preview 10:52

In this section you’ll receive a quick tour of key concepts and  features from the HTML5 family. Specifically this includes an overview of Geolocation, Drag and Drop Web Storage, Web Workers, Web Sockets and CSS3.

An Introduction To HTML5 Family
08:18
+
Fundamentals of HTML, XHTML and CSS
6 Lectures 39:22

In this lesson you’ll learn some of the basics of HTML markup. Specifically you’ll take a look at how the web browser renders an html page as well as other fundamentals such as the role of the head section as well as html attributes and values.

An Introduction To HTML Markup
06:11

In this lesson you’ll learn how to create a hyperlink and add an image to a page in HTML. You’ll also learn the difference between block and inline elements as well as the difference between required and optional attributes.

Adding Links And Images
06:58

In this lesson you’ll learn the role of validating web pages in HTML. Specifically you’ll learn about the HTML doctype as well as how to use the online markup validation service  provided by the W3C.

Validating Your Web Pages
06:57

In this lesson you’ll learn how to style a heading on your page with CSS. Specifically, you’ll be learning the basics of CSS syntax and where CSS styles are located within a page.

Styling A Heading with CSS
06:26

In this lesson you’ll learn how add a CSS class selector to your page. Specifically, you’ll be using a CSS class in order to change the color of individual words within your page.

Using A CSS Class
05:52

In this lesson you’ll learn how to add an external styles sheet to an HTML page.  Specifically, you’ll be learning about the difference between internal and external styles and how to move rules from one to the other.

Creating An External Stylesheet
06:58
+
Formatting Text With CSS
6 Lectures 46:20

In this lesson you’ll learn the basics of styling text in CSS. Specifically you’ll learn how how to work with the font-family property and how to create a font stack.

The Basics of Styling Text with CSS
05:49

In this lesson you’ll learn the basics of sizing text in CSS. Specifically you’ll learn how to set the foundation of font-sizing on the page using a combination of the percentage and em values.

Preview 08:17

In this lesson you’ll learn how to change the amount of space between text elements using the CSS margin property. Specifically you’ll be learning about the default margins that browsers add to text elements and how to control those margins.

Adding Space Between Text with Margins
05:47

In this lesson you’ll learn how work with line-height and other text styles in order to change the appearance of text on your page. Specifically, you’ll be working with the line-height property to add space between paragraph lines, working with font-weight in order to change the boldness of your text and working with the text-transform property in order to set your text as uppercase.

Working with Line-Height and Other Text Styles
07:16

In this lesson you’ll learn how to work with lists in HTML.Specifically, you’ll be learning how to use the three main catefories of lists: Unordered lists, Ordered Lists and Definition lists.

Working With Lists
08:18

In this lesson you’ll learn how to style lists using CSS. Specifically you’ll be background colors to your lists as well as modifying the margin and padding of your list styles.

Styling HTML Lists
10:53
+
Introduction to CSS Layout
9 Lectures 01:10:57

In this lesson you’ll learn the role of a CSS reset file when creating page layouts. Specifically you’ll learn how to attach a CSS reset file to your page and how to modify the CSS reset style sheet as needed.

Working with a CSS Reset File
07:33

In this lesson you’ll learn the role of the HTML Div element as it relates to page layout. Specifically you’ll be working with a page of text that has been organized for you using the div element and then styling these elements with background colors.

Working with the HTML Div Element
10:06

In this lesson you’ll learn how to understand how the CSS float property works. Specifically you’ll be looking at the three main values of the float: left, right and none and in this case as applied to an image.

Understanding the Float Property
08:43

In this lesson you’ll learn how to apply the CSS float property to div elements in order to create columns in your page layout. Specifically you’ll be using a combination of floats, width and background color in order to begin a two column fixed-width layout.

Creating Colums with the Float Property
05:27

In this lesson you’ll learn how to use the CSS clear property when working with column layouts. Specifically you’ll be adding a clear property to your footer in order to push it below two floated columns.

Working With The Clear Property
06:07

In this lesson you’ll learn how to build a basic horizontal navigation bar using a combination of HTML and CSS. Specifically you’ll be adding an unordered list and list items for your navigation and then styling it with the CSS float property and other styles.

Creating a List-Based Navigation Bar
08:00

In this lesson you’ll learn how to control the layout of your columns using the CSS padding property. Specifically, you’ll be looking at the effects of adding padding to your sidebar and main columns and how this affects layout.

Controlling Column Layouts with Padding
07:21

In this lesson you’ll learn how to control the layout of your columns using the CSS margin property. Specifically, you’ll be looking at the effects of adding margins to the elements inside your sidebar and main columns and examining the differences between layout with margins versus padding.

Controlling Column Layout With Margins
10:55

In this lesson you’ll learn how to create style for a page footer. Specifically, you’ll be adding a background image and formatting text within a footer.

Styling a Footer with CSS
06:45
+
Advanced Layout
5 Lectures 44:45

In this section you’ll be removing the background color styles for your layout columns and replacing them with more visually appealing styles.

Creating Basic Layout Styles
06:18

In this section you’ll be adding a background image to a container on your page in order to create a gradient effect.

Working With CSS Background Images
07:23

In this section you’ll be adding some CSS code to ensure that your layout is sufficiently adaptable. Specifically you’ll be adding better support for floated columns and adding a condtional comment for Internet Explorer.

Solving Common Layout Problems
09:23

In this section you’ll be styling a horizontal css navigation bar to improve its appearance. Specifically you’ll be replacing background colors as well as adding rollover or hover links to improve your user’s experience.

Creating An Enhanced CSS Navigation Bar
12:47

In this section you’ll learn how to use absolute positioning in order to precisely add a new splash image to your page.

Using Absolute Positioning For Precise Layout
08:54
+
Using HTML5 Markup
7 Lectures 57:25

In this section you’ll get an overview of HTML5 syntax. Specifically, you'll get an introduction to the core elements used to build HTML5 pages.

HTML5 Syntax Fundamentals
06:55

In this section you’ll learn how add some of the new HTML5 input attributes to forms on your page. Specifically you'll be working with the placeholder, required, autofocus and autocomplete attributes.

Adding HTML5 Input Attributes
08:45

In this section you’ll begin to convert a pre-existing web page to HTML5. Specifically, you’ll be adding the header element and learning how to add support for HTML5 in older browsers.

Adding Your First HTML5 Element
09:31

In this section you’ll begin add two new elements to a preexisting web page, specifically the nav and section elements. Additionally, you will also be learning how to style HTML5 elements with CSS.

Adding Nav And Section Elements
08:18

In this section you'll add the footer element to your page as well as learn the multiple roles the footer might have on a page

Adding the Footer Element
07:49

In this section you will add article and aside elements to your page. Specifically you'll be using the article to group content that can be considered independent and you'll be using the aside element to group content that is somewat related to your page.

Adding the Article and Aside Elements
10:17

In this section you’ll add additional HTML5 elements to your page. Specifically you’ll be working with the figure and figcaption elements in order to mark up images and captions on your page.

Working with Additional HTML5 Elements
05:50
+
Creating HTML5 Forms
8 Lectures 01:01:13

In this exercise you’ll learn some techniques to make sure your forms have a good foundation and support for accessibility. Specifically you’ll be adding labels, legends and fieldsets to a pre-existing form.

Best Practices Creating HTML Forms
07:26

In this section you’ll learn some good CSS styling techniques for HTML forms. Specifically you’ll learn how to style a form element itself as well as form legends and labels.

Best Practices for Styling an HTML Form
05:45

In this section you’ll learn some good CSS styling techniques for styling labels in your forms. Specifically, you'll be floating labels as well as examning the use of the "for" attribute.

Best Practices for Styling Labels
08:15

In this section you’ll learn how add some of the new HTML5 input types and attributes to forms on your page. Specifically you’ll be using the url and email input types.

Adding HTML5 Input Types
06:58

In this section you’ll learn how add some of the new HTML5 input attributes to forms on your page. Specifically you'll be working with the placeholder, required, autofocus and autocomplete attributes.

Adding HTML5 Input Attributes
08:45

In this lesson you’ll be creating a datalist menu as well as exploring the uses of the min and max attributes

Working with Lists, Datalists, and the Min and Max Attributes
10:05

In this section you'll be adding the range input type to your page in order to create a slider control to your page in supported browsers.

Working With The Range Input Type
06:29

In this section you'll learn how to use a custom build of the Modernizr JavaScript library in order to provide fallback to browser that do not support HTML5 form features

Providing Fallback Support for Browsers
07:30
+
Introduction to JavaScript and jQuery
5 Lectures 40:09

In this section you’ll be learning some JavaScript basics. Specifically you’ll be learning about JavaScript functions and variables as well as the document.write functionality within JavaScript.

JavaScript Basics
11:56

In this lesson, you'll learn the basics of using JavaScript events in order to add simple interactivity to your page.

JavaScript Events
04:27

In this lesson you’ll learn the basics of the Document Object Model as it relates to JavaScript and HTML and you’ll also learn about JavaScript Frameworks.

DOM And JavaScript Frameworks
07:32

In this section you’ll learn how to add support for the jQuery Javascript library to a page and then you’ll add a hide function to an element on your page.

Hiding An Element With jQuery
07:42

In this section you’ll learn how to add support for the jQuery Javascript library to a page and then you’ll add a hide function to an element on your page.

Adding jQuery Show Effect
08:32
+
Working with Video and Audio in HTML5
5 Lectures 42:10

In this section you’ll learn how to use the HTML5 video element in order to add video to a page. Additionally, you’ll look at supported attributes of the video tag including autoplay, poster images and controls.

Adding HTML5 Video to a Page
08:46

In this section, you'll learn how to provide video format support for multiple browsers. Specifically, you'll be adding alternative options for the Mpeg-4 video as well as the OGG video formats.

Adding Video Format Support for Multiple Browsers
09:43

In this section you’ll learn how to add fallback support for html5 video in older browsers.  Specifically, you’ll add a download link for older browsers as well as support for Flash.

Adding Fallback Support for Older Browsers
08:17

In this section you’ll learn how to begin using JavaScript in conjunction with the HTML5 element. Specifically, you’ll be adding a button to your page and then controlling the width and behavior of the button using JavaScript.

Controlling Video with JavaScript
11:17

In this section you’ll learn how to add the Audio element to your page in order to embed audio on your websites.

Adding HTML5 Audio to Your Page
04:07
+
Working with Canvas in HTML5
9 Lectures 01:12:40

In this section you will learn the role of canvas within HTML5 as well as some of the benefits. You will also get an overview of how to use the html canvastemplate file we provide for the exercises in this lesson.

Understanding the Basics and Benefits of Canvas
07:44

In this section you'll learn how to draw rectangles in canvas. Specifically, you'll be using the strokeRect, stokeStyle and fillRect, fillRect functions

Drawing Rectangles In Canvas
07:50

In this section you’ll learn how to draw lines and circles on your page as subpaths. Specifically you’ll be working with the moveTo and lineTo functions as well as arc and beginPath functions.

Drawing Lines And Circles with Subpaths
11:07

In this section you’ll learn how to draw curves on your page in Canvas. Specifically you’ll be working with the quadraticCurveTo and bezierCurveTo functions.

Drawing With Curves
10:22

In this section, you’ll learn how to add text to a page using canvas syntax. Specifically, you’ll be working with the fillText and font functions and learning how to style the text you’ve added.

Adding Text in Canvas
06:32

In this section you’ll learn how to apply gradients to your artwork in Canvas. Specifically, you’ll be working with linear gradients and radial gradients as well as learning how to define transparency in gradients.

Working With Gradients And Transparency
10:04

In this exercise you’ll learn how to apply transform effects such as scaling, rotating and translating to objects on your page

Using Transforms in Canvas
06:44

In this section you’ll learn how to add image objects to a page in Canvas. Specifically, you’ll be working with the drawimage function as well as adding code to ensure the image has enough time to load when the page is opened.

Adding Images in Canvas
05:35

In this exercise you’ll learn how to create a drawing loop, otherwise known as an animation, using Canvas syntax. Specifically you’ll be using the draw, drawbackground and setInterval functions

Creating a Looped Animation in Canvas
06:42
6 More Sections
About the Instructor
Digital Classroom
4.7 Average rating
6 Reviews
56 Students
2 Courses
AGI Training

Digital Classroom provides expert instruction that fits into your schedule. With best-selling books and video tutorials, the Digital Classroom makes it fast and easy to learn essential skills that you need. Digital Classroom authors and presenters have created many official training guides for companies like Adobe and Microsoft, and you can benefit from their expert instruction.

When you learn from Digital Classroom, you are learning from experienced instructors who have trained thousands to learn creative software tools. They teach classes on Adobe software and design technologies at AGI Training. They are also the authors of dozens of books including:

Digital Classroom tutorials are created by experts, and are peer-reviewed and edited for accuracy, completeness, and clarity. All tutorials are professionally recorded and edited, and are suitable for Mac OS and Windows users, with the authors providing clear instructions for users on both operating systems. See a complete line of Digital Classroom books at www.DigitalClassroomBooks.com.

Digital Classroom presenters are available for private and custom training engagements through American Graphics Institute. Details at www.agitraining.com