All-in-One HTML/HTML5 and CSS/CSS3 Suite
![Simplilearn Americas LLC](https://static.mytechlogy.com/cache/120eb50138d5e4ddec9e3d84afbf6e36_w30_h30_cp_sc.gif)
Simplilearn Americas LLC
Course Summary
Learn how to make interactive web pages using HTML/HTML5 and CSS/CSS3 fundamentals in an all-inclusive training program that also includes HTML5 game development.
-
+
Course Description
I want to know more about the training program. Whom do I contact?
Please join our Live Chat for instant support, call us, or Request a Call Back to have your query resolved.What are the payment options?
Payments can be made using any of the following options and a receipt of the same will be issued to you automatically via email.Visa Debit/credit Card
American Express and Diners Club Card
Master Card
PayPal
Who provides the certification?
Simplilearn provides the course completion certificate once you successfully complete the Certified iOS App Developer training program.
How will I get my course completion certificate from Simplilearn?
Your course completion certificate will be auto generated in the LMS once you meet the below criteria:
1. Completion of at least 85% of the eLearning course
2. Submission of project as per course requirements
3. Successfully meeting the project evaluation criteria set by our expertsWho are our Faculties and how are they selected?
All our trainers are working professionals and industry experts with at least 10-12 years of relevant teaching experience.
Each of them has gone through a rigorous selection process which includes profile screening, technical evaluation, and training demo before they are certified to train for us.
We also ensure that only those trainers with a high alumni rating continue to train for us.What is covered under the 24/7 Support promise?
We offer 24/7 support through email, chat, and calls.
We also have a dedicated team that provides on-demand assistance through our community forum. What’s more, you will have lifetime access to the community forum, even after completion of your course with us.
-
+
Course Syllabus
Course preview
Applying Designs to WireFrames with HTML5 and CSS3
Chapter 0 - Introduction 03:22
0.1 Introduction 01:56
0.2 Here's What We'll Create In This Course 01:26
Chapter 1 - From Wireframe To Design 21:59
1.1 From Wireframe To Design 05:16
1.2 Choosing Your Designs Colour Palette 06:39
1.3 Tools For Selecting Typefaces 05:18
1.4 Choosing Imagery And Design Elements 04:46
Chapter 2 - Getting The Design Underway 50:51
2.1 Getting The Design Underway 05:15
2.2 Formatting Call To Action Buttons With CSS 08:41
2.3 Additional Shadow Effects To The Buttons 03:11
2.4 Finishing Up The Button Formatting 05:40
2.5 Typographic Treatments With Google Font API 07:42
2.6 Beginning The Features Section Styling 05:29
2.7 Finishing The Features Section 04:08
2.8 Formatting The Organize Section 04:48
2.9 Wrapping Up The Layouts Design 05:57
Chapter 3 - Inserting and Formatting Graphics 17:31
3.1 Inserting and Formatting Graphics 02:49
3.2 Setting Up The Hero Section Graphics 04:53
3.3 Getting The Feature Section Images Inserted 03:04
3.4 Placing The Organize and Share Images 02:52
3.5 Using A Graphic As A Button Label 03:53
Chapter 4 - Cross-Browser Testing 22:49
4.1 Cross - Browser Testing 08:07
4.2 Running Virtual Operating Systems For Testing 09:17
4.3 Making Minor Adjustments For Browser Compatibility 05:25
Chapter 5 - Wrapping Up 00:29
5.1 Wrapping Up 00:29
Build Your Own HTML5 Video Player
Module 1 - Introduction to the Course 02:17
1.1 Introduction To The Course 02:17
Module 2 - How to Build an HTML5 Video Player 47:30
2.1 How To Build An HTML 5 Video Player 08:09
2.2 Coding The HTML 08:09
2.3 Video Player Attributes 07:17
2.4 JavaScript Modifications 08:05
2.5 Working with Adobe Flash 12:32
2.6 Testing Your Video Player 03:18
Building Responsive Websites with HTML5 and CSS3
Building Responsive Websites with HTML5 CSS3 3:29:50
1.1 Welcome 00:48
1.2 A Look At What We'll Build 01:36
1.3 Key Aspects Of Responsive Design 02:43
1.4 Determining Device Resolutions To Target 04:20
1.5 Wireframing Responsive Layouts 04:59
1.6 The Concept Of Using Multiple CSS Files 10:50
1.7 Media Queries and Multiple Style Sheets 08:58
1.8 Building Media Queries Into A Single CSS File 07:38
1.9 Using Media Query Expressions 05:05
1.10 Setting Up The HTML and CSS Files 04:19
1.11 Getting Started With The Header 07:36
1.12 Inserting The Main Nav Menu 06:01
1.13 Inserting The Search Field 06:56
1.14 Problems With Applying Floats 04:19
1.15 Integrating Google Fonts API 03:25
1.16 Building The Hero Section Structure 04:26
1.17 Formatting The Hero Section 09:04
1.18 Inserting and Formatting A Call To Action Button 09:51
1.19 Building The Features Section, Part One 05:46
1.20 Building The Features Section, Part Two 04:57
1.21 Inserting The Organize Section 08:19
1.22 Building The Share Section 05:16
1.23 Building The Call To Action Area 06:36
1.24 Inserting And Formatting The Footer 03:48
1.25 Finishing Touches For The High Resolution Layout 04:07
1.26 Setting Up The Medium Resolution CSS and Testing The Media Query 07:02
1.27 Formatting The Medium Res Header 04:08
1.28 Formatting The Medium Res Hero Section 06:09
1.29 Formatting The Features Section 02:14
1.30 Formatting The Organize And Share Sections 05:17
1.31 Building The Get Section and Finishing Up The Medium Res Layout 02:53
1.32 Setting Up The Low Res CSS and Testing The Media Query 04:41
1.33 Formatting The Low Res Header 02:53
1.34 Resolving Problems Caused By Floats 04:22
1.35 Formatting The Low Res Hero Section 03:18
1.36 Formatting The Features Section 01:46
1.37 Formatting The Organize And Share Sections 02:59
1.38 Building The Get Section and Finishing Up The Low Res Layout 03:07
1.39 Disabling Device Smart Zoom 05:59
1.40 Testing Your Responsive Layouts 04:28
1.41 Setting Up Retina Display Graphics 06:22
1.42 Where To Go From Here 00:29
HTML5 and CSS3 Site Design
Chapter 0 - Introduction 03:12
0.1 Introduction 00:57
0.2 A Look At What Well Build 02:15
Chapter 1 - Let Get Started 25:33
1.1 Lets Get Started 03:25
1.2 In The Beginning HTML Fundamentals 11:18
1.3 Understanding What CSS Is All About 06:34
1.4 Viewing A Page Background Code 04:16
Chapter 2 - Getting Your Files Organized 16:01
2.1 Getting Your Files Organized 06:43
2.2 Creating A Page And Understanding Index Files 05:41
2.3 Setting Up An External Style Sheet 03:37
Chapter 3 - Let Build A Web Layout From Scratch 1:27:45
3.1 Lets Build A Web Layout From Scratch 06:54
3.2 Connecting The External Style Sheet And Testing 08:14
3.3 Inserting And Formatting The Site Header 07:36
3.4 Finishing Up The Basic Layout 04:48
3.5 Debugging For Internet Explorer 03:25
3.6 Understanding How The Layout Works 05:49
3.7 Using Divs For Page Layout 07:14
3.8 A More Economical Approach To Layout And CSS 07:50
3.9 Using Float And Clear 05:54
3.10 Centering The Layout 09:01
3.11 Nesting Layout Objects 07:03
3.12 Spacing Apart The Layout 09:11
3.13 Final Touches 04:46
Chapter 4 - Inserting And Formatting Text 1:17:29
4.1 Inserting And Formatting Text 04:16
4.2 Setting Up Paragraphs And Headings 04:36
4.3 Adjusting The Layout For Text Part 1 07:35
4.4 Adjusting The Layout For Text Part 2 05:19
4.5 Formatting HTML Headings With CSS 06:48
4.6 Formatting Paragraphs 04:09
4.7 Using Class Rules To Format Text 05:22
4.8 More Formatting With Class Rules 09:07
4.9 Working More Efficiently With CSS 06:52
4.10 Inserting And Formatting Lists 06:40
4.11 Using A List To Build The Main Navigation Menu 10:15
4.12 Setting Up The Footer Navigation 06:30
Chapter 5 - Now It Time For Some Graphics 42:18
5.1 Now It Time For Some Graphics 06:28
5.2 Resizing Images With Your Graphics Editor 04:51
5.3 Controlling Graphics With CSS 07:06
5.4 Inserting The FeatureBox Images(Free Lesson) 07:10
5.5 Adjusting The FeatureBox Layout 02:57
5.6 Setting Up The FeatureBox Titles 06:18
5.7 Illustrator, Photoshop, HTML, And CSS Workflow 07:28
Chapter 6 - Site Rollout 26:21
6.1 Site Rollout 03:37
6.2 How To Not Roll Out A Website 07:07
6.3 Roll Out 1 - Setting Internal Hyperlinks 04:36
6.4 Roll Out 2 - Creating The Site Pages 01:33
6.5 ing And Testing The Site 04:03
6.6 A Final Thought On Site Rollout 05:25
Chapter 7 - Inserting Additional Page Elements 1:02:46
7.1 Inserting Additional Page Elements 06:58
7.2 Inserting A Simple Slideshow 08:29
7.3 Inserting And Formatting Tables 08:15
7.4 Inserting A Google Map 07:51
7.5 Formatting A Customer Testimonial Page 07:07
7.6 Setting Up A Contact Us Page 06:44
7.7 Finalizing The Site 11:55
7.8 Organizing The CSS File 05:27
Chapter 8 - Going Live Uploading The Completed Site 25:26
8.1 Uploading The Completed Site 03:52
8.2 Uploading The Local Site To The Remote Server 02:25
8.3 Testing The Live Site 02:04
8.4 Making Edits And Updating The Live Site 06:49
8.5 Testing And Debugging For Other Browsers 09:53
8.6 Conclusion 00:23
HTML5 Mobile Game Development by Example - Educational Game
Section 1 - Start Your Engines 16:11
1.1 Intoduction 04:31
1.2 Html 5 Quintus Basics 11:40
Section 2 - Course Project 1:47:49
2.1 Structure Loading Assets 07:37
2.2 Stages Scenes and Layers 06:49
2.3 Sprites 06:20
2.4 Collision Detection 05:14
2.5 Viewport Camera 06:29
2.6 The Rivals 07:56
2.7 The Princess 07:48
2.8 Game Over 12:23
2.9 Level Options 07:52
2.10 UI Module 06:46
2.11 Game States and Question Generation 07:17
2.12 Number Buttons 07:23
2.13 Answer Area 03:14
2.14 Checking the Answer 09:32
2.15 Adding Sound 05:09
Section 3 - Course Summary 06:04
3.1 Course Summary 06:04
HTML5 Mobile Game Development by Example -Veggies vs Zombies
Section 1 - Start Your Engines 16:26
1.1 Introduction 04:46
1.2 HTML 5 Quintus Basics 11:40
Section 2 - Course Project 2:08:31
2.1 Sprites Loading 10:04
2.2 Zombie Class 04:12
2.3 Collision And Physics 06:10
2.4 Accessing The Game Loop 05:20
2.5 Game UI 05:43
2.6 Modules 09:51
2.7 Touching The Sun 06:52
2.8 Game State Variables 05:00
2.9 Gameplay Module 07:26
2.10 Random Sun Generation 08:32
2.11 Plants 09:39
2.12 Shooting Plants 07:18
2.14 Explosive Chillis 01:46
2.15 Sunflowers 03:40
2.16 Loading Levels From Json Files 09:14
2.17 Plant Buttons 12:18
2.18 Audio 08:46
2.19 Multilevel Game 06:40
Section 3 - Course Summary 03:58
3.1 Course Summary 03:58
Make HTML5 Games with No Coding Required
01 - Make HTML5 Games From Scratch With No Coding Required 3:26:14
1.1 Introduction To The Course Welcome 04:06
1.2 General Interface 05:39
1.3 Insert A Sprite 01:54
1.4 Sprite Properties 03:53
1.5 Adding Movement To A Sprite 02:29
1.6 Adding Borders 03:48
1.7 Edge And Origin 01:02
1.8 Learn How To Scroll To A Sprite 01:57
1.9 Adding A Background 02:01
1.10 Adding Layers 02:08
1.11 Adding Text To Your Game 03:17
1.12 Snapping To The Grid 00:25
1.13 Setting The Sprite Size 06:10
1.14 Learning More About Events 03:11
1.15 How To Rotate Your Sprite 00:46
1.16 How To Rotate Your Sprite With An Event 04:24
1.17 Rotate To An Angle 04:14
1.18 How To Set An Angle 00:43
1.19 How To Shake The Camera 02:47
1.20 Setting Opacity With Events 01:10
1.21 Setting Is Visible With Events 00:47
1.22 How To Destroy An Object With An Event 01:41
1.23 How To Spawn An Object And Basic Bullet Use 07:03
1.24 Bullets Part 2 04:34
1.25 Destroying The Projectile 02:40
1.26 Setting The Projectile s Origin 03:24
1.27 Rotate Towards Mouseclick 01:42
1.28 Move Sprite Towards Mouseclick 01:26
1.29 Introduction To Variables 02:12
1.30 Implementing Variables Rotate Sprite To Mouse 05:31
1.31 Speed Run How To Implement Everything 06:23
1.32 How To Pin Objects To Other Objects 02:40
1.33 Making Objects Solid 01:05
1.34 Collision Masks And Solid Objects 02:03
1.35 How To Use Wordwrap 02:01
1.36 Adding Car Properties To Your Sprite 00:48
1.37 How To Make A Heads Up Display (HUD) 04:13
1.38 Paralax Scrolling 03:07
1.39 Hiding Layers On Demand 01:02
1.40 More Layer Properties 02:10
1.41 How To Move To Co Ordinates And Objects 04:33
1.42 How To Move Layers 03:45
1.43 How To Change The Background Color 02:25
1.44 Changing The Background Color With A Tiled Background 02:30
1.45 Adding A Spotlight Effect 06:34
1.46 Adding Text Boxes 00:51
1.47 Adding Buttons To Your Game 01:30
1.48 Changing Text With Buttons 05:02
1.49 Append Text Feature 02:12
1.50 Adding A Variable To Your Textbox 01:58
1.51 Constantly Update Your Textbox With Text 01:54
1.52 Adding Sound To Your Game 03:13
1.53 Thoughts About Making An Easy Game 08:47
1.54 Thoughts On Making An Easy Game Part 2 03:15
1.55 Making An Easy Game Part 3 05:08
1.56 Finishing The Easy Game Part 4 03:13
1.57 Recap On What We Have Done So Far 05:27
1.58 Simple Physics 02:22
1.59 Add Spawning And Collision 04:30
1.60 Physics Properties 05:17
1.61 Applying A Force To A Physical Object 03:22
1.62 Applying A Force To An Angle 01:00
1.63 Applying A Force To A Position 01:13
1.64 Applying A Velocity 02:02
1.65 Adding Torque To Your Object 00:58
1.66 Adding Angular Velocity To Your Object 01:14
1.67 Applying Torque Towards An Angle 01:14
1.68 Applying Torque Towards A Position 00:56
1.69 How To Create A Revolute Joint 01:37
1.70 How To Make A Tiled Background 03:44
1.71 How To Make A Scrolling Background 01:52
02 - Make HTML5 Games From Scratch With No Coding Required - Part 2 6:57:05
2.1 Project goals and planning 03:13
2.2 Making a simple production spec 07:54
2.3 Adding the player and controls 05:21
2.4 Adding wall collisions 02:52
2.5 Tweaking the player controls 02:23
2.6 Adding projectiles 04:26
2.7 Adding a spread projectile 08:49
2.8 Adding debug features to your game 03:03
2.9 Adding a beam part 1 03:05
2.10 Adding a beam part 2 03:53
2.11 Adding homing projectiles 05:27
2.12 Fixing the homing projectile bug 01:28
2.13 How to make the enemies move towards the target 03:11
2.14 Adding the projectile enemy collision 03:27
2.15 Adding Spawining Objects 02:01
2.16 Adding the random function to the timer 01:15
2.17 Adding a score modifier 05:36
2.18 Adding in Scores and HUD 06:46
2.19 Adding the lives to the HUD 02:43
2.20 Adding the losing lives functionality 02:30
2.21 Adding the weapons type to HUD 06:41
2.22 Adding Powerups to your game 07:45
2.23 Adding points powerups to the game 06:52
2.24 Adding Weapons Select 12:50
2.25 Adding Beam powerup 08:38
2.26 Adding homing Powerup 05:38
2.27 Making a menu 05:34
2.28 Adding functionality to the menus 05:40
2.29 Setting up a game over screen 04:50
2.30 Adding some game over logic 01:48
2.31 Final Thoughts of the game before art 04:05
2.32 Intoduction to adobe illustrator and talking about aesthetic values 09:38
2.33 Making a simple scene 13:41
2.34 Adding gradients to you game 07:34
2.35 Resizing the image to fit the gameplay 05:18
2.36 Adding Snow to the mountains 08:59
2.37 Adding Shadding to the mountain 12:30
2.38 Adding Clouds 11:56
2.39 Adding some trees 22:14
2.40 Fixing the trees 04:22
2.41 Adding the trunks to the foreground trees 04:44
2.42 Adding the canopy to the trees in the foreground 04:56
2.43 Starting our bee character 05:50
2.44 Continuing the bee character part 2 06:36
2.45 Making a bee part 3 03:51
2.46 Adding more detail to the bee 08:50
2.47 Adding legs to the bee - WITH SOUND 08:38
2.48 Adding Wings to the bee 04:23
2.49 Completing the bee and talking about design 03:56
2.50 Creating the wasp 04:41
2.51 Creating the wasp part 2 06:42
2.52 Adding more detail to the wasp 08:34
2.53 Adding Detail to the eye 06:42
2.54 Adding detail to the mouth 09:50
2.55 Adding the Arms 16:48
2.56 Adding the wings to the wasp 07:52
2.58 Talking about the text and the design 07:15
2.59 Making Powerups 11:10
2.60 Making the rest of the powerups part 2 02:52
2.61 Making the projectile 05:19
2.62 Making the beam weapon part 1 01:24
2.63 Making the beam weapon's spark part 2 05:49
2.64 Making the title Screen 08:01
2.65 Adding detail to the title screen 10:34
2.66 Finishing the title screen 05:52
03 - Make HTML5 Games From Scratch With No Coding Required - Part 3 4:54:22
3.1 Finishing the cards 04:32
3.2 Setting up the instruction screen 04:11
3.3 Making the bee animation 09:34
3.4 Making the wasp animation 08:58
3.5 Making the spark animation 03:19
3.6 Exporting Images 13:01
3.7 Setting up the instruction screen 02:34
3.8 Setting Up the menu screen 04:46
3.9 Setting up the highscore screen 03:11
3.10 Adding the art to the game screen 03:19
3.11 Adding the images to the game screen 03:39
3.12 Setting up the text in the game 01:59
3.13 Making the scrolling background 17:16
3.14 Fixing some illustrator and graphic problems 15:27
3.15 Adding the animation to the bee and the wasp 02:21
3.16 Adding the animation spark to the beam 08:37
3.17 Talking about the project and adding sound effects 05:03
3.18 Making the projectile sound effect 04:53
3.19 Making the spread projectile 02:23
3.20 Making the homing projectile 04:35
3.21 Making the beam sound effect 05:40
3.22 Making the wasp death sound 04:12
3.23 Making the bee hit sound 02:43
3.24 Talking about the music and adding our first beat 05:13
3.25 Adding the bass line 03:34
3.26 Adding the melody 09:20
3.27 Finishing the Song 09:02
3.28 Making the game over music 01:19
3.29 Adding the bass line to the game over music 04:19
3.30 Adding the melody 04:24
3.31 Adding the melody to the game over music 08:59
3.32 Making the drums more interesting in the game over music. 03:39
3.33 Composing the main music 03:25
3.34 Composing the bassline 05:51
3.35 Picking the synthsizers 12:27
3.36 Comosing the pre melody 03:17
3.37 Composing the A melody 08:08
3.38 Composing the B melody 07:23
3.39 Making the song a little more interesting 05:50
3.40 Adding the form the to song 05:00
3.41 Adding an intro to the song 07:32
3.42 Making the drums more interesting 06:28
3.43 Adding cymbals and finishing the song 09:32
3.44 Mixing your music 05:17
3.45 Making a powerup Sound effect 01:08
3.46 Making the second powerup sound effect 01:06
3.47 Adding the music to the game 04:50
3.48 Correcting the music coding errors 03:55
3.49 Correcting a music logic problem 02:28
3.50 Adding sound effects part 1 06:55
3.51 Adding sound effects part 2 03:51
3.52 Mixing your audio in the engine 03:57
04 - Make HTML5 Games From Scratch With No Coding Required - Part 4 1:45:11
4.1 Adding a difficulty curve 16:01
4.2 Adding a difficulty curve part 2 02:59
4.3 Making the game more fun 06:07
4.4 Adding high scores and polishing the game 06:12
4.5 Making the icons for the chrome store 14:50
4.6 Making the 16x16 icon 02:53
4.7 Making the banners 1280 and 440 10:50
4.8 Packing your game for the chrome store 05:49
4.9 Final steps of publishing to the chrome store 09:32
4.10 Final steps of publishing to the chrome store 01:05
4.11 Setting up the facebook game 03:28
4.12 Adding a facebook login 04:02
4.13 Publishing your score to your facebook 03:30
4.14 Exporting your HTML 5 webpage 01:46
4.15 Setting canvas URL in facebook 02:44
4.16 Resizing your icon 02:56
4.17 Finalizing your facebook game 02:31
4.18 Final thoughts of Bees versus wasps 07:56
05 - Make HTML5 Games From Scratch With No Coding Required - Part 5 44:27
5.1 Families 08:20
5.2 Famillies part 2 02:55
5.3 Particles Part 1 01:08
5.4 Particles and rotation 01:39
5.5 Adding the particles to the mouse 01:05
5.6 How to rotate the particles manually 01:21
5.7 Particle Spawn Rate 00:56
5.9 Particle spray cones 02:38
5.10 One Shot versus continuous spray 01:15
5.11 Setting values in the event sheet 01:36
5.12 Changing the image 01:49
5.13 Particle speed and art verus technical 02:31
5.14 Setting the particle size 01:22