Boost Your Website Performance – The Practical Guide
Boost Your Website Performance – The Practical Guide, available at $54.99, with 58 lectures, 53 quizzes, and has 211 subscribers.
You will learn about This course is a practical guide !!!! You will learn hands-on how to improve the performance of your website You will get a procedure with clear steps and tools that will lead you on the correct path to improve the performance of your website You will learn hands-on to measure the performance of your website pages using page speed insight Learn hands-on to analyze the performance of your website pages using web page test and other tools Learn hands-on to use page speed insight and get recommendation for imroving your website performance Learn hands-on to improve the SEO , accessability and best practice metrics of your web pages Learn performance related concepts like : core web vital : CLS, LCP , TBT, crticial rendering path , render blocking Learn to convert image format to webp and crop files using the image processing packahe – sharp Learn to reduce the css file size using minify and purgeCSS Learn how responsive images , srcset and lazy loading can reduce load time of image files Learn how to optimize the loading time of your web fonts This course is ideal for individuals who are Frontend developers or Fullstack developers or Web developers It is particularly useful for Frontend developers or Fullstack developers or Web developers.
Enroll now: Boost Your Website Performance – The Practical Guide
Summary
Title: Boost Your Website Performance – The Practical Guide
Price: $54.99
Number of Lectures: 58
Number of Quizzes: 53
Number of Published Lectures: 58
Number of Published Quizzes: 53
Number of Curriculum Items: 111
Number of Published Curriculum Objects: 111
Original Price: $99.99
Quality Status: approved
Status: Live
What You Will Learn
- This course is a practical guide !!!! You will learn hands-on how to improve the performance of your website
- You will get a procedure with clear steps and tools that will lead you on the correct path to improve the performance of your website
- You will learn hands-on to measure the performance of your website pages using page speed insight
- Learn hands-on to analyze the performance of your website pages using web page test and other tools
- Learn hands-on to use page speed insight and get recommendation for imroving your website performance
- Learn hands-on to improve the SEO , accessability and best practice metrics of your web pages
- Learn performance related concepts like : core web vital : CLS, LCP , TBT, crticial rendering path , render blocking
- Learn to convert image format to webp and crop files using the image processing packahe – sharp
- Learn to reduce the css file size using minify and purgeCSS
- Learn how responsive images , srcset and lazy loading can reduce load time of image files
- Learn how to optimize the loading time of your web fonts
Who Should Attend
- Frontend developers
- Fullstack developers
- Web developers
Target Audiences
- Frontend developers
- Fullstack developers
- Web developers
You’re here because you have a website with pages loading slowly and you don’t know how to fix this.
I am here because I can help you accomplish your mission. I have B.s.c + M.s.c in mechanical engineering. I have been making software applications for over 20 years in the Hi-Tec industry and have much teaching experience. You can trust me and my teaching methods. I have learned many technologies in the past (check my LinkedIn profile), and I know exactly what is needed to learn and how.
In this course, I show you three practical examples, actually three web pages, and walk you step by step through how to improve their load time and responsiveness so that they will reach a performance score of 99-100
Every website has a front-end side. The front end comprises files: HTML, JavaScript, CSS, Fonts, and Images. These files have a huge effect on how fast your web pages load and respond and this will be the focus of this course.
There is a lot of theory behind web performance and most courses concentrate on theory, but not this course. This course concentrates on real life – you have a web page with bad performance and you want to improve its load time and responsiveness.
When you come to handling web performance issues you need to answer all the following questions which most developers do not have answers to:
– How to measure performance straightforwardly?
– How to analyze performance?
– How to fix the performance issues and reach a performance score of 100 using a clear procedure.
All of these questions will be demonstrated and answered in this course using three web pages.
To make you an expert on this issue we will learn the following concepts
– Core Web Vitals, in particular: LCP, CLS, TBT
– Measure performance correctly using Page Speed Insight and Lighthouse
– Analyze web performance using WebPageTest
– Learn a clear procedure that will lead you to improve the webpage performance score to 100
– Convert image format to WEBP format and how to crop image file using the image processing package – sharp
– Lazy load images using HTML properties
– Use responsive images and srcset for smart image loading per viewport
– Reduce CSS file size using purgeCSS
– Minimize JavaScript and CSS files using the bundler
– Improve SEO, accessibility, and best practices
– Track unused CSS and javascript using Chrome dev tools
– Remove unused JavaScript function using Tree Shaking
– Use Chrome Dev Tools to pinpoint functions that consume a lot of CPU
– Optimizes load of web font using self-host and woff2 format
Course Curriculum
Chapter 1: Introduction
Lecture 1: Web performance and motivation
Lecture 2: Important questions
Lecture 3: Why this course
Lecture 4: Project structure
Lecture 5: Sections
Lecture 6: How to make the most out of this course
Chapter 2: Sample 1 – optimize the performance score of expanding cards to 100
Lecture 1: Setup
Lecture 2: Simulate slow network
Lecture 3: Lighthouse tool
Lecture 4: Web vitals and lighthouse perfromance score
Lecture 5: Local lighthouse tool and limitation
Lecture 6: Web hosting and page speed insight
Lecture 7: Lighthouse tool vs page speed insight
Lecture 8: LCP and its phases
Lecture 9: WebPageTest and browser rendering pipeline
Lecture 10: Understand the limitation of remote fonts
Lecture 11: How to use local font
Lecture 12: Use local images
Lecture 13: Use hero image instead of hero div with background-image
Lecture 14: Responsive images , srcset and LintImages
Lecture 15: Crop hero image to get performance score of 100
Lecture 16: Further improvments
Chapter 3: Sample 2 – optimize the performance score of WebPageTest demo page to 96-99
Lecture 1: Section introduction
Lecture 2: WebPageTest analysis
Lecture 3: Render blocking resources
Lecture 4: 4xx response in WebPageTest
Lecture 5: TBT and performance tab
Lecture 6: Use webp format and sharp package
Lecture 7: Handle incorrectly loaded lazy images
Lecture 8: Responsive image and srcset for dog image
Lecture 9: Use production javascript packages
Lecture 10: chrome coverage tab to remove non used resources
Lecture 11: Convert a render-blocking resource into a non-render-blocking one
Lecture 12: Reduce cls using aspect ratio part 1
Lecture 13: Reduce cls using aspect ratio part 2
Lecture 14: Summary
Chapter 4: Sample 2 – optimize the SEO and accessability to score 100
Lecture 1: Introduction
Lecture 2: Optimize the accessability to score 100
Lecture 3: Optimize the seo to score 100
Chapter 5: Sample 3 – optimize the performance of natours to score 100
Lecture 1: Introduction
Lecture 2: Performance analysis
Lecture 3: Fix error serve image in next-gen format
Lecture 4: WebPageTest analysis
Lecture 5: Solve render blocking issue with local font
Lecture 6: Responsive images with srcset
Lecture 7: More responsive images with srcset
Lecture 8: Use smaller small hero for 100 performance score
Chapter 6: Sample 3 – optimize seo + accessability of natours to score 100
Lecture 1: Motivation
Lecture 2: Optimize accessability for score 100
Instructors
-
Nathan Krasney
Instructor and Developer
Rating Distribution
- 1 stars: 0 votes
- 2 stars: 0 votes
- 3 stars: 0 votes
- 4 stars: 0 votes
- 5 stars: 0 votes
Frequently Asked Questions
How long do I have access to the course materials?
You can view and review the lecture materials indefinitely, like an on-demand channel.
Can I take my courses with me wherever I go?
Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!
You may also like
- Top 10 Language Learning Courses to Learn in November 2024
- Top 10 Video Editing Courses to Learn in November 2024
- Top 10 Music Production Courses to Learn in November 2024
- Top 10 Animation Courses to Learn in November 2024
- Top 10 Digital Illustration Courses to Learn in November 2024
- Top 10 Renewable Energy Courses to Learn in November 2024
- Top 10 Sustainable Living Courses to Learn in November 2024
- Top 10 Ethical AI Courses to Learn in November 2024
- Top 10 Cybersecurity Fundamentals Courses to Learn in November 2024
- Top 10 Smart Home Technology Courses to Learn in November 2024
- Top 10 Holistic Health Courses to Learn in November 2024
- Top 10 Nutrition And Diet Planning Courses to Learn in November 2024
- Top 10 Yoga Instruction Courses to Learn in November 2024
- Top 10 Stress Management Courses to Learn in November 2024
- Top 10 Mindfulness Meditation Courses to Learn in November 2024
- Top 10 Life Coaching Courses to Learn in November 2024
- Top 10 Career Development Courses to Learn in November 2024
- Top 10 Relationship Building Courses to Learn in November 2024
- Top 10 Parenting Skills Courses to Learn in November 2024
- Top 10 Home Improvement Courses to Learn in November 2024