kubernetes / kubernetes/website
Improve Lighthouse performance, accessibility, and SEO scores for kubernetes.io
- Dominant language
- HTML
- Stars
- 5.4k
- Forks
- 15.7k
- Avg merge
- 4d 18h
- Merged PRs (30d)
- 204
Description
## Problem:
A Lighthouse audit of https://kubernetes.io identified several performance, accessibility, and SEO issues that are negatively impacting page quality and user experience.
Additionally, navigating to another page on kubernetes.io appears to reload the entire website rather than performing a seamless page transition. This may contribute to slower navigation and a less responsive user experience. Optimizing page-to-page navigation and reducing full page reloads could further improve perceived performance and Core Web Vitals.
### Lighthouse report:
[k8s-website-report.pdf](https://github.com/user-attachments/files/28941185/k8s-website-report.pdf)
### Key findings include:
* Render-blocking resources causing approximately 290 ms of delay.
* Font loading issues causing approximately 380 ms of delay.
* Unused CSS (~77 KiB).
* Unused JavaScript (~142 KiB).
* CSS assets that could be further optimized/minified.
* Images missing explicit width and height attributes, contributing to layout instability.
* High Cumulative Layout Shift (CLS) score of 0.236 (recommended: < 0.1).
* Images missing alt attributes.
* Links without discernible or descriptive names.
* Insufficient color contrast between foreground and background elements.
### Current Lighthouse Scores:
* Performance: 88
* Accessibility: 87
* Best Practices: 100
* SEO: 83
### Proposed Solution:
* Eliminate render-blocking resources by inlining critical CSS and deferring non-critical assets.
* Optimize font loading using font-display: swap and preload critical fonts.
* Remove unused CSS and JavaScript through tree-shaking and code splitting.
* Ensure CSS minification is enabled in production builds.
* Add explicit width and height attributes to image elements.
* Reduce layout shifts to improve CLS.
* Add meaningful alt attributes to all content images.
* Ensure all links have accessible and descriptive text.
* Improve color contrast to meet WCAG accessibility requirements.
## Additional Information:
### Lighthouse Audit Details:
* Lighthouse Version: 13.0.2
* Environment: Emulated Desktop
* Browser: Chromium 148.0.0.0
* Audit Date: June 9, 2026
### Relevant Lighthouse opportunities:
* Font display — Est. savings: 380 ms
* Render-blocking requests — Est. savings: 290 ms
* Reduce unused CSS — Est. savings: 77 KiB
* Reduce unused JavaScript — Est. savings: 142 KiB
* Minify CSS — Est. savings: 3 KiB
* Image elements do not have explicit width and height
* Image elements do not have alt attributes
* Links do not have a discernible name
* Links do not have descriptive text (4 links found)
* Background and foreground colors do not have sufficient contrast ratio
Contributor guide
Research direction
Start by reviewing the attached Lighthouse report and rerunning the audit against kubernetes.io to confirm the listed performance, accessibility, SEO, and navigation findings. Done means the identified resource, font, asset, image, link, contrast, and page-transition issues are addressed and the Lighthouse scores improve.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css, html, javascript
- Domain
- accessibility, frontend, performance, web-dev
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 42/100