Fixing the Image Problems of the Web using Machine Learning
summary
Web images bloat pages—average first-view payload is 2.2 MB with 1.4 MB of images—because people upload huge wrong-format files and sites serve full-size originals as thumbnails. Practical fixes shown: use picture/srcset, run lossless optimizers, read EXIF thumbnails for instant previews, use CSS blur-up instead of heavy JS, and do server-side intelligent crops (face/segmentation) with services like Cloudinary. Use image classification and captioning via Microsoft Cognitive Services (and datasets like ImageNet/Open Images) to auto-generate alt text; an assistive app built on these APIs demonstrably works.
AI-written summary · about
chapters (12)
- 0:00Image problems on the web
- 3:42Images bloating the web
- 8:14Web connectivity and growth
- 10:20Automated image optimization tools
- 14:11Extracting image metadata with JS
- 16:58Image fallback content
- 19:45Analyzing image colors with ML
- 20:06AI image resizing
- 24:01Image tagging and captioning with ML
- 31:03Detecting faces and emotions
- 33:14AI impact on accessibility
- 37:45Closing thoughts
related talks
47mThe image problem of the web and how to solve it with AI
31mEngaging Ecommerce with the Visual Web
37mEnhancing Media Experiences in the Age of AI: A Practical Guide
44mMachine Learning to optimize images
22mFAULT TEXT: The Adversities in Automated Alternative Text with Henri Helvetica
36mLeveraging Machine Learning APIs to Write Better Software
01h 04mBuilding Efficient and Frugal Image Data Processing Pipelines
32mTeach JS About Aesthetics with Machine Learning