Course
Skills Expanded
A Web Developer's Guide to Images
Learn about images for web sites and how to use them effectively
What you'll learn
Images are a central part of virtually every web site. Learn the various types of images and when each is appropriate. Review some useful jQuery plugins and CSS 3 features related to images. Study the performance impact of images and how to use the most efficiently. Learn how to use images with responsive web design techniques and high pixel density displays.
Table of contents
Introduction
43mins
jQuery Plugins and CSS 3
38mins
- Overview 1m
- jQuery Cycle Plugin 1m
- jQuery Cycle Plugin Demo 2m
- jQuery Carousel Plugin 1m
- jQuery Carousel Plugin Demo 2m
- jQuery Zoom Plugin 1m
- jQuery Zoom Plugin Demo 1m
- jQuery Overlays Plugin 0m
- jQuery Overlays Plugin Demo 1m
- jQuery LazyLoad Plugin 3m
- jQuery LazyLoad Plugin Demo 2m
- Disable Right Click 1m
- Disable Right Click Demo 1m
- CSS 3 2m
- Browser/Vendor Prefixes 2m
- Fallbacks 1m
- Polyfills 1m
- Rounded Corners 3m
- Rounded Corners Demo 1m
- Opacity 1m
- Opacity Demo 5m
- Multiple Backgrounds 0m
- Multiple Backgrounds Demo 1m
- Icon Fonts 1m
- Icon Fonts Demo 3m
- Summary 1m
Performance
32mins
- Overview 1m
- Fiddler 1m
- Fiddler Demo 2m
- Image Optimization 2m
- Content Expirations 3m
- Content Expirations Demo 2m
- CSS Sprites 1m
- CSS Sprites Demo 4m
- Image Maps 1m
- Image Maps Demo 2m
- Data URI 2m
- Data URI Demo 2m
- CDN 1m
- CDN Demo 2m
- Multiple Domains 2m
- Multiple Domains Demo 1m
- Favicon Caching 1m
- Favicon Caching Demo 1m
- Summary 1m
Miscellaneous
45mins
- Overview 1m
- Aspect Ratios 0m
- Aspect Ratios Demo 1m
- Responsive Images 3m
- Responsive Images (cont.) 2m
- Responsive Images Demo 10m
- High Pixel Density Displays 3m
- High Pixel Density Displays Demo 4m
- Design Placeholders 1m
- Design Placeholders Demo 1m
- Watermarks 1m
- Watermarks Demo 1m
- Upload Images 1m
- Upload Images Demo 2m
- Where to Get Images 1m
- Chart Controls 1m
- Chart Controls Demo 1m
- System.Net.Drawing 0m
- System.Net.Drawing Demo 1m
- HTML5 Canvas 1m
- HTML5 Canvas Demo 1m
- Windows 7 Snipping Tool 0m
- Windows 7 Snipping Tool Demo 0m
- Flickr 0m
- Flickr Demo 1m
- Cool 0m
- Cool Demo 3m
- Summary 1m