What this book covers

Creating your first Retina image (Must know), will help you create a high-density image and implement it using the HTML <IMG> tag. You will also learn the importance of consistent file names.

Retina background images (Must know), teaches you to use CSS to add high-definition background images.

Optimizing (Must know), explains techniques for optimizing images, what tools are available, and why it matters for speed.

Creating image sprites (Should know), will help you use CSS to add high-definition image sprites that make fewer HTTP requests for increased speed.

CSS border images (Should know), will teach you to create high-definition border images in CSS.

CSS media queries (Should know), explains how media queries can determine when your new Retina images are loaded.

CSS image-set (Become an expert), will teach you a possible future technique for adding Retina images to your site.

Using code instead of images (Must know), explains how to use CSS3 to create resolution-independent graphical elements.

Embedding fonts (Should know), explains how fonts scale on Retina Devices and how they can be added to your site via embedding and font services.

Fonts as icons (Should know), helps you create graphics using fonts.

High-resolution web apps (Should know), helps you create high-quality, web-clip icons for mobile devices and favicons for the browser.

Scalable Vector Graphics (Become an expert), helps you create SVG as a replacement for images.

Canvas (Become an expert), explains how Canvas can be coded to adapt to high-density displays.

Pixel ratio detection with JavaScript (Become an expert), will teach you to use JavaScript to detect if a device has a high-density display and serve the correct image.

Server-side Retina solutions (Become an expert), explains how a server-side code can be used to detect if high-definition images should be served.