https://github.com/cloudinary-devs/optimize-media-for-fast-page-loading
https://github.com/cloudinary-devs/optimize-media-for-fast-page-loading
Last synced: 4 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/cloudinary-devs/optimize-media-for-fast-page-loading
- Owner: cloudinary-devs
- Created: 2018-11-15T14:16:25.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2018-11-15T15:03:33.000Z (over 7 years ago)
- Last Synced: 2025-03-20T17:54:07.549Z (about 1 year ago)
- Size: 528 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Optimize Media for Fast Page Loading:
## Fast and Beautiful Images
Building fast and beautiful images for apps the the web.
According to the HTTPArchive, >50% of all data on mobile websites are images, and the number of KB is grew by 5% year over year \(March, 2017- March 2018\).
Research shows that webpages and apps that are slow to load frustrate users.
# Speeding up A Slow Website: Optimizing Images
In this exercise, we will use [Cloudinary](https://www.cloudinary.com), a cloud based image delivery service, to optimize a simple webpage and improve its load time while still serving beautiful images that will delight everyone who visits.
index.html is a pretend "summer vacation blog post" with 15 images. The images were just uploaded straight from Google Photos, and as a result, the page weighs over 10 MB. The first load of the page \(when the images are not cached\) is extremely slow.[Try it!](https://dougsillars.github.io/) \(See what I mean?\)
## Contest
### At RenderConf, Cloudinary is sponsoring a contest. [Submit](https://docs.google.com/forms/d/e/1FAIpQLSdYhsJWpZGrzrg76MmSzkKxSlyfvblDX9_SmaKi7Q39R0FLTw/viewform) your improved sites for a chance to win a £150 Amazon gift certificate!
You can find the code to optimize at [https://github.com/dougsillars/dougsillars.github.io](https://github.com/dougsillars/dougsillars.github.io)