About this Course
HTML5 and CSS3 are the foundation of any web project. This course will introduce students to the techniques used in the development of any web site. Over the two-day class students will learn how web applications work, and how to produce the HTML, CSS and Javascript code that work behind the scenes to create a full web experience. Through the use of instructor-led, hands-on exercises and real-world examples students will learn the latest techniques and standard practices used in web design and production. The samples and exercises begin with a basic HTML page structure then build into more complex page designs with interactive interfaces, slideshows, video and forms. All of the applications used in class for coding are available as free downloads, so students can practice on their own after the class without purchasing any expensive software.
Audience Profile
Web Design with HTML5 and CSS3: Is intended for students wanting to learn web design for their personal use or for business related projects. Students will learn to create web pages and web sites using the latest web publishing technologies.
At Course Completion
Students will have a working knowledge of HTML and CSS techniques used in the creation of web projects. Students will be familiar with the coding practices and applications used in basic to intermediate web design projects. Students will also have a better understanding of the online resources available to them and how these resources can be used as they continue building their web development skills.
Outline
Introduction to web development
- A short history of the HTML and CSS standards
- Browser Compatibility
- Accessibility
- SEO
- Responsive Design
How to code, test, and validate a web page
- The HTML and CSS syntax
- The basic structure of an HTML document
- Elements and Tags
- Attributes
- Comments and Whitespace
- CSS rule sets and comments
- Basic Selectors
- Validating HTML and CSS files
How to use HTML to structure a web page
- The title element
- Adding a favicon
- Including Metadata
- Adding Headings and Paragraphs
- How to code special blocks of text
- Adding Character entities
- How to code the core attributes
- Structuring the content of a page
- HTML5 semantic elements
- When to use div and span elements
- Coding links, lists, and images
- What are absolute and relative URLs
- Page Layout
Using CSS to format the elements of a web page
- An introduction to CSS
- Specifying measurements and colors
- Selectors for elements, element types, ids, and classes
- Pseudo-class and pseudo-element selectors
- How the cascade rules work
- Setting the font family and font size
- Adding shadows to text
- Floating images
- Adding an External style sheet
The CSS box model for spacing, borders, and backgrounds
Using CSS for page layout
- Floating elements in 2- and 3-column layouts
- Floating and clearing elements
- CSS3 to create text columns
- Positioning elements
- Absolute positioning
- Fixed positioning
How to code ordered, unordered and description lists
Add links to pages, media files, emails, phone, and Skype addresses
Creating navigation menus
An Introduction to Responsive Web Design
- Fluid layouts vs. fixed layouts
- Sizing fonts and images in a responsive design
- Using CSS3 media queries
How to work with images
- Understanding the types of images used on the Web
- HTML5 figure and figcaption elements
- Creating image rollovers
- Creating a favicon
How to work with tables
- Table headers and footers
- CSS properties used to format a table
- CSS3 structural pseudo-classes for formatting tables
- HTML5 figure and figcaption elements with tables
- Merge cells in a column or row
How to work with forms
- How to create a form
- Buttons, text fields, radio buttons and check boxes
- Drop-down lists and list boxes
- Text areas
- How to use labels
- The fieldset and legend elements
- Align and format controls
- Set the tab order and assign access keys
- HTML5 attributes and CSS3 selectors for data validation
- New HTML5 form controls
Adding audio and video to your website
Working with fonts and printing
CSS3 transitions, transforms, animations, and filters
Introduction to JavaScript and jQuery for the non-programmer
Prerequisites
Students should be familiar with using personal computers with a mouse and keyboard and possess basic typing skills. Students should be comfortable accessing information on the computer. Specifically, you should be able to launch and close programs; navigate to information stored on the computer; and manage files and folders. Students should be familiar with web browsers such as Internet Explorer, Chrome or Firefox.
Venue: LIVE Online
Address:
Description:
Live Online Training
Get the same training you expect in the classroom without leaving your office or home. These are NOT recorded classes. They are LIVE sessions with an expert instructor. We use the latest in video conferencing technologies and audio so you can confidently participate in any class just like being right there in person. We guarantee the effectiveness of our online training delivery approach that we will give you your money back if you are not totally satisfied. Ask us for a demo.
Online class requirements:
- Moderate to fast Internet
- A phone or computer headset is required in order to hear the instructor/moderator). You can use Computer Audio (VoIP) or you can dial in from a regular phone. For convenience, we recommend a hands-free headset or phone.
- Training software must be installed on your computer (trial versions are acceptable)
- RECOMMENDED: Dual Monitors or computers. For optimal online learning experience, we recommend participants have dual monitors or two computers. Your online classroom credentials allow you to join multiple times from multiple computers. Participants should use one monitor or computer to view the instructor’s shared screen and another monitor or computer to work with the software.
What happens when you enroll in an online class
When you register for an online class, you will receive a welcome email followed by login access to the Citrix GoToTraining virtual classroom. A workbook (printed copy or eBook) will be sent to you prior to the start of class.
Online Training Advantages
Convenience: You don’t have to travel and can attend from your home, office or anywhere with an internet connection. Our online classes are conducted using GoToTraining, a more robust version of the popular GoToMeeting screen sharing and conferencing platform. To accommodate multiple time zones, courses are typically scheduled from 10am – 5pm Eastern with a one-hour lunch break at 12:30 – 1:30 pm Eastern and a 10-minute break in the morning and afternoon. When conducting custom online course for your group, class times can be modified to accommodate your timezone.
Interactive Learning: Our online training is fully interactive. You can speak and chat with the instructor and classmates at any time. Various interactive techniques are used in every class. Our small class sizes (typically 4 – 8 students), allow our instructors to focus on individual performance and issues and to work closely with you to meet your unique needs. Classes are designed to be a hands-on learning experience, providing opportunities for you to try your new skills while the instructor is available for review, questions, and feedback. You have the option to give the instructor permission to view your computer to provide one-on-one assistance when needed.
