My personal site was designed specifically to load quickly, work across multiple browsers, be responsive, and be accessible. Utilizing code splitting, lazy loading CSS styles, image lazy loading, E-tags, CSS and JS compression tools, a CDN, and server-side rendering, I am able to ensure that the website loads efficiently and provides a fast first contentful paint. A CSS preprocessor, smart use of Flex boxes and CSS Grid, and extensive testing in other browsers ensure that the website is compatible with older browsers. I used Aria labels and CSS to improve the website’s accessibility. The front page contains four different designs depending on the width of the device; this design is complemented by the use of CSS Houdini and ES6 as progressive enhancements. These techniques come together for a website with a perfect across-the-board Lighthouse score.
- CDN
- CODE SPLITTING
- CSS HOUDINI
- CSS3
- E-TAGS
- ES6
- GULP
- HTML5
- LAZY LOADING
- MYSQL
- PHP
- WORDPRESS