- Course Introduction
- View Project Demo
- Important Dates!
- Download Resources File
Build Creative Website Using HTML5, CSS3, jQuery & Bootstrap
Quick Facts
particular | details | |||
---|---|---|---|---|
Medium of instructions
English
|
Mode of learning
Self study
|
Mode of Delivery
Video and Text Based
|
Course overview
Build Creative Website Using HTML5, CSS3, jQuery & Bootstrap online course goal is to teach students how to develop an innovative and sophisticated responsive website with no prior experience. Candidates will learn the fundamentals of web development technologies and will construct a large creative and modern-looking professional website from the ground up. Build Creative Website Using HTML5, CSS3, jQuery & Bootstrap certification course is designed by Irfan Dayan - Senior Web Developer & Instructor and is made available through Eduonix, a digital training platform that offers technical training courses as well as career assistance through its courses.
Build Creative Website Using HTML5, CSS3, jQuery & Bootstrap online training will teach candidates to develop a wireframe for a website and turn it into a working website, as well as new CSS3 techniques for styling a website and some new concepts such as CSS3 media queries and breakpoints. Candidates will also learn how to use jQuery to add cool features to a website and how to choose and add web fonts, colours, and icons to their website. This course will teach them how to write HTML5 markup in the best way possible, as well as how to integrate the Bootstrap framework, which will significantly reduce development time.
The highlights
- Self-paced course
- English videos with subtitles
- Pre-recorded video content
- 161 online lectures
- 30-day money-back guarantee
- Accessible on portable devices
Program offerings
- Self-paced course
- English videos with subtitles
- 27.77 hours of pre-recorded video content
- 161 online lectures
- 30-day money-back guarantee
- Accessible on portable devices
Course and certificate fees
Fees information
certificate availability
No
Who it is for
What you will learn
After completing the Build Creative Website Using HTML5, CSS3, jQuery & Bootstrap online certification, candidates will get knowledge of the fundamentals of HTML5, CSS3, jQuery, and Bootstrap as well as Javascript for developing websites. Candidates will learn about web fonts, colours, and icons, as well as web tools, animations, wire-framing, and new techniques and strategies for developing professional websites. Candidates will also learn how to develop large CSS3 media queries for real-world websites and optimize the responsive layout for the website Cross-browser testing.
The syllabus
Getting Started!
Setting Up Working Environment
- Install Chrome Browser
- Chrome Web Developer Tools
- Install Brackets Code Editor
- Install Brackets Extensions (Part 1)
- Install Brackets Extensions (Part 2)
Creating Wireframe Of Website
- Learn About Wire-framing
- Let's First Create Website Wireframe
- Complete Website Wireframe
- Know About Wireframing Tools
Building Basic Structure Of Website
- Setup Website Folder File Structure
- What Is HTML?
- Create Basic HTML5 Page Structure
- Add Important Meta Tags
- Add Website Title & Favicon
Learn CSS Basics
- What Is CSS?
- Link CSS To HTML
- Basic CSS Selectors
- CSS Classes & IDs
- CSS Box Model
- CSS Positioning
JavaScript & jQuery Basics
- What Is JavaScript?
- Link Script To HTML
- JavaScript Basics
- What Is jQuery?
- Add jQuery Library
- How To Use jQuery
Bootstrap Framework
- Bootstrap Framework Version
- What Is Bootstrap?
- Add Bootstrap Library
- Bootstrap Grid System
- Bootstrap Grid Examples
- Know About Web Development Resources
Setting Up Fonts, Colors & Icons
- Choose Right Fonts
- Important Note Before You Go Ahead
- Choose Right Icons
- Choose Right Colors
Solo - Creative Responsive Website
- Solo - Creative Responsive Website
Building Preloader for Website
- Introduction - Preloader
- Write HTML - Preloader
- Apply CSS - Preloader
- Hide Preloader Using jQuery
Building Home Section
- Introduction - Home
- Setup Background Video - Home
- Write HTML (Part 1) - Home
- Apply CSS (Part 1) - Home
- Write HTML (Part 2) - Home
- Apply CSS (Part 2) - Home
- Apply CSS (Part 3) - Home
Building About Section
- Introduction - About
- Write HTML (Part 1) - About
- Apply CSS (Part 1) - About
- Write HTML (Part 2) - About
- Apply CSS (Part 2) - About
- Apply CSS (Part 3) - About
Building Team Section
- Introduction - Team
- Write HTML (Part 1) - Team
- Add jQuery Slider (Part 1) - Team
- Add jQuery Slider (Part 2) - Team
- Apply CSS (Part 1) - Team
- Apply CSS (Part 2) - Team
- Write HTML (Part 2) - Team
- Apply CSS (Part 3) - Team
- Add jQuery Animation - Team
- jQuery Animation On Scroll - Team
Building Statement Section
- Introduction - Statement
- Write HTML - Statement
- Apply CSS - Statement
- Create Code Snippets
Building Services Section
- Introduction - Services
- Write HTML (Part 1) - Services
- Apply CSS (Part 1) - Services
- Write HTML (Part 2) - Services
- Add jQuery Responsive Tabs - Services
- Apply CSS (Part 2) - Services
- Apply CSS (Part 3) - Services
Building Work Section
- Introduction - Work
- Write HTML - Work
- Apply CSS - Work
- Add jQuery Filter (Part 1) - Work
- Add jQuery Filter (Part 2) - Work
- Apply CSS To Filters - Work
- Add Zoom Effect - Work
- Add jQuery Magnifier - Work
- Add Overlay Effect (Part 1) - Work
- Add Overlay Effect (Part 2) - Work
- Minor Fix - Work
Building Testimonials Section
- Introduction - Testimonials
- Write HTML - Testimonials
- Add jQuery Slider - Testimonials
- Apply CSS - Testimonials
Building Pricing Section
- Introduction - Pricing
- Write HTML - Pricing
- Apply CSS (Part 1) - Pricing
- Apply CSS (Part 2) - Pricing
- Apply CSS (Part 3) - Pricing
Building Stats Section
- Introduction - Stats
- Write HTML - Stats
- Apply CSS - Stats
- Add jQuery Counter - Stats
Building Clients Section
- Introduction - Clients
- Write HTML - Clients
- Add jQuery Slider - Clients
- Apply CSS - Clients
Building Blog Section
- Introduction - Blog
- Write HTML - Blog
- Apply CSS - Blog
Building Contact Section
- Introduction - Contact
- Write HTML (Part 1) - Contact
- Write HTML (Part 2) - Contact
- Apply CSS (Part 1) - Contact
- Apply CSS (Part 2) - Contact
Building Map Section
- Introduction - Map
- Emmet Extension
- Google Maps JavaScript API - Map
- Write HTML & CSS - Map
- Render Map Using JavaScript - Map
Building Footer Section
- Introduction - Footer
- Write HTML - Footer
- Apply CSS - Footer
Building Navigation
- Introduction - Navigation
- Write HTML - Navigation
- Apply CSS - Navigation
- Create White Navigation - Navigation
- Show & Hide White Navigation Using jQuery - Navigation
- Add ScrollSpy Effect - Navigation
- Add Smooth Scrolling Using JQuery - Navigation
- Add Back To Top Button - Navigation
Perfecting Responsive Layout
- Introduction - Responsive
- Media Queries - Responsive
- Large Devices - Responsive
- Medium Devices - Responsive
- Small Devices (Part 1) - Responsive
- Small Devices (Part 2) - Responsive
- Small Devices (Minor Fixes) - Responsive
- Extra Small Devices (Part 1) - Responsive
- Extra Small Devices (Part 2) - Responsive
- Extra Small Devices (Part 3) - Responsive
- Extra Small Devices (Part 4) - Responsive
- Extra Small Devices (Part 5) - Responsive
- Resize Google Map - Responsive
- Write HTML - Mobile Menu
- Apply CSS (Part 1) - Mobile Menu
- Apply CSS (Part 2) - Mobile Menu
- Show & Hide Mobile Menu Using jQuery
- Responsive Layout Testing & Tools
Applying Animation
- Introduction - Animation
- Add Animation Libraries
- Apply Animation (Part 1)
- Apply Animation (Part 2)
Finalizing, Optimizing & Launching
- Final Touches
- Basic Search Engine Optimization (SEO)
- Optimize Images
- Code Validation
- Cross Browser Testing
- Minify Code
- Going Live!
Conclusion
- Great job! You did it!
Bonus
- Migrating To Bootstrap 4 (Part - 01)
- Migrating To Bootstrap 4 (Part - 02)
- Migrating To Bootstrap 4 (Part - 03)