Introduction to HTML5 / CSS3 and JavaScript

Quickly gain solid HTML5 and CSS3 skills for creating modern, responsive, and user-friendly web designs

Course Code: TT4003 / TT4650

Skill Level: Introductory

Duration: 3 Days

Course Overview

Overview

Introduction to HTML5/CSS3 and JavaScript is a three-day hands-on course geared for web developers beginning their journey in modern web design and coding. Over three days, you'll explore the essentials of HTML5, CSS3, and JavaScript – the core trio that powers the internet. You'll learn how to build visually appealing, responsive websites and applications, skills that are vital in today's digital landscape. Whether you're aiming to improve your daily tasks, enhance your organization's online presence, or start personal web projects, mastering these tools will give you a competitive edge and open doors to creative opportunities.

You'll delve into six key areas, starting with a refreshing look at HTML and XHTML, moving into the nuances of HTML5 with its advanced structures and media options, and tackling HTML5 forms. In the CSS segment, you'll master styling, from basic declarations to advanced techniques in CSS3 like Flexbox layouts and visual effects. The JavaScript sessions will ground you in the essentials, from basic syntax to advanced concepts like Object-Oriented Programming and DOM manipulation. The 50% hands-on labs ensure you get practical experience, applying what you learn to real-world scenarios. These labs are crafted to encourage creative problem-solving and build confidence in applying new skills effectively.

By the end of the course, you'll have a comprehensive understanding of how these technologies work together to create the web. More importantly, you'll think like a web developer, equipped with both the technical skills and the innovative mindset needed to tackle web development tasks. Our industry expert instructor will guide you with practical advice and real-world examples, ensuring you leave the course not just with knowledge, but with the confidence to apply these skills in your daily work. This course isn't just about learning; it's about transforming you into a skilled, adaptable, and forward-thinking web developer.

Learning Objectives

This course combines engaging instructor-led presentations and useful demonstrations with valuable hands-on labs and engaging group activities.

Working in a hands-on learning environment guided by our expert instructor you’ll explore:

Get comfortable with HTML5: Learn to create web pages with modern structure and interactive forms.
Have fun with CSS3: Play with styles, colors, and layouts to make your web designs pop.
Dive into JavaScript: Discover how to bring your web pages to life with interactive elements.
Tackle web challenges: Use debugging tools to solve problems and improve your site’s performance.
Embrace flexibility: Learn how to make your websites look great on any device and browser.

Course Objectives

Learning Objectives

This course combines engaging instructor-led presentations and useful demonstrations with valuable hands-on labs and engaging group activities.

Working in a hands-on learning environment guided by our expert instructor you’ll explore:

Get comfortable with HTML5: Learn to create web pages with modern structure and interactive forms.
Have fun with CSS3: Play with styles, colors, and layouts to make your web designs pop.
Dive into JavaScript: Discover how to bring your web pages to life with interactive elements.
Tackle web challenges: Use debugging tools to solve problems and improve your site’s performance.
Embrace flexibility: Learn how to make your websites look great on any device and browser.

Course Prerequisites

Audience

This Introductory-level course is targeted for aspiring web developers who have software development experience or background. The course can also be adjusted for non-developers upon request.

Pre-Requisites

Basic Computer Literacy and Text Editing: Comfort with using computers, basic software applications, and text editors for coding.
Fundamentals of Web Development: General awareness of web development concepts and processes, including how web pages are structured and served. Basic understanding of HTML including elements, tags, and basic page structure and Introductory knowledge of CSS including styling text and layout basics would be helpful.

Course Agenda

Course Topics / Agenda

Please note that this list of topics is based on our standard course offering, evolved from typical industry uses and trends. We will work with you to tune this course and level of coverage to target the skills you need most. Course agenda, topics and labs are subject to adjust during live delivery in response to student skill level, interests and participation.

HTML Quick Refresh

Define HTML and review its history
Look at XHTML and its relationship to HTML
Identify HTML limitations and improvements
Hands-On Lab

Getting Started with HTML5

HTML5: Status and Support
Semantic Structure and Tags
Handling Complex Media Options

Working with HTML5 Forms

Working with Legacy Browsers
Forms, Input Types, and Data Qualification
Hands-On Lab

CSS Basics

Learn the basics of CSS
Meaning of cascading in CSS
Declaring CSS within your HTML page
Creating styles in an external CSS file
Control how to display and position HTML elements
Overriding standard tag behavior
Adding new classes
Using custom classes in your page
Hands-On Lab

Exploring CSS3

What is new in CSS3
The Advantages of CSS3
Layout of elements using the display property
CSS Flexbox
Hands-On Lab

CSS3 Advanced Selectors

Selecting Using Attributes
Selecting Using DOM Structure
Complex Selecting using Pseudo-Classes
Selecting Using UI Components and State
Hands-On Lab

CSS3 Visual Effects

Font Options, Opacity, and Color
Distributing Content Across Columns
Working with Borders and Boxes
Working with Vendor Prefixes
Functional Techniques
Hands-On Lab

JavaScript Basics

JavaScript Defined
Variables and Operators
Flow Control and Conditionals
Hands-On Lab

Debugging Tools

Using the strict mode and setting breakpoints
Browser debugging tools
Monitoring resource usage and performance
Emulating devices Exceptions in JavaScript
Exceptions in JavaScript
Hands-On Lab

JavaScript Functions

Functions in JavaScript
Invoking Functions
Function Constructor
Function Scope and Closures

JavaScript Arrays, Math and Date

JavaScript Literals
JavaScript Arrays
Working with Numbers and Dates
Hands-On Lab

JavaScript Event Handling and the DOM

Events and Event Handling
HTML Document Object Model
Accessing the DOM
Dynamically Working with the DOM
DOM Challenges
Hands-On Lab

Object-Oriented JavaScript

JavaScript “Objects” and “Classes”
Constructors and Prototypes
Prototypes
Extending Classes with Prototype
Reusable, Flexible Classes
Hands-On Lab

Course Materials

Student Materials: Each participant will receive a digital Student Guide and/or Course Notes, code samples, software tutorials, step-by-step written lab instructions (as applicable), diagrams and related reference materials and resource links. Students will also receive the project files (or code, if applicable) and solutions required for the hands-on work.

Hands-On Setup Made Simple! Our dedicated tech team will work with you to ensure our ‘easy-access’ cloud-based course environment, or local installation, is accessible, fully-tested and verified as ready to go well in advance of the course start date, ensuring a smooth start to class and effective learning experience for all participants. In some cases we can also help you install this course locally if preferred. Please inquire for details and options.

Every-Course Extras = High-Value & Long-Term Learning Support! All Public Schedule courses include our unique EveryCourse Extras package (Course Recordings, Live Instructor Follow-on Support, Free *Live* Course Refresh Re-Takes, early access to Special Offers, Free Courses & more). Please inquire for details.

Raise the bar for advancing technology skills

Attend a Class!

Live scheduled classes are listed below or browse our full course catalog anytime

Special Offers

We regulary offer discounts for individuals, groups and corporate teams. Contact us

Custom Team Training

Check out custom training solutions planned around your unique needs and skills.

EveryCourse Extras

Exclusive materials, ongoing support and a free live course refresh with every class.

Attend a Course

Please see the current upcoming available open enrollment course dates posted below. Please feel free to Register Online below, or call 844-475-4559 toll free to connect with our Registrar for assistance. If you need additional date options, please contact us for scheduling.

Course Title	Days	Date	Time	Price
Introduction to HTML5 / CSS3 and JavaScript	3 Days	Dec 18 to Dec 20	10:00 AM to 06:00 PM EST	$1,995.00	Enroll

Mix, Match & Master!
2FOR1: Two Courses, One Price!
Enroll in *any* two public courses (for 2023 *OR* 2024 dates!) by December 31, for one price! Learn something new, or share the promo!

Click for Details & Additional Offers

Learn. Explore. Advance!

Extend your training investment! Recorded sessions, free re-sits and after course support included with Every Course

Gain the skills you need with less time in the classroom with our short course, live-online hands-on events

Trivera QuickSkills: Free Courses and Webinars

Training on us! Keep your skills current with free live events, courses & webinars

Trivera AfterCourse: Coaching and Support

Expert level after-training support to help organizations put new training skills into practice on the job

The voices of our customers speak volumes

Excellent training. Even though it was online, I did not have any issues understanding or getting the answers for the questions I had. The lab exercises are interesting to apply what was learnt. Overall very good training. Thank you!

Anitha

Both the instructor and the course material were very thorough - the course material has many helpful references - the labs were well laid out, making it easy to learn from and get done on time

Steve C.

A very good balance of teaching time to lab time. I've done other courses that I found to be much lighter on content and heavy on labs to waste time. This was a refreshing change of pace.

Adam G

Instructor was beyond phenomenal. He had an in depth knowledge of the course material and always ensured that everyone understood what was being discussed. I really enjoyed the mix of theory and practical examples of each part of the course.

Cillian M

First time in my life I have attended remote class and I find it great. Personally I don't feel there is any area which require improvement!

Rishi M

Great job overall. Great communicator and explained complex concepts in a simple, easier to understand format.

Jeremy G

Excellent detail about the Spring framework which directly relates to my role as a senior engineer. I found the content and style to be very enjoyable, and would encourage me to ask questions where previously I might not have paid much attention, eg. pom version numbers / spring starters being imported. The focus on the different styles of unit testing was also excellent and I would plan to incorporate in day to day work.

Edward K

Best programming class I've ever been in, head and shoulders above any thing I took in college as part of a computer science degree. The instructor was thorough and very detailed, he was very good abut explaining all possible scenarios a situation would apply to. The way the albs were structured and the class was conducted was very good for interaction and hand on learning.

Danish J

The instructor was clearly knowledgeable about Java and programming in general. He was very attentive to every student's individual needs and constantly encouraged questions, concerns, student issues to be raised and addressed each one thoroughly.

Mark M

Special Offers
Limited Offer for most courses.

SAVE 50%

Learn More