Creating Web Media

High-quality media is a must for any website. Get tips for creating, optimizing, and implementing graphics, animation, video, and audio in the most modern way possible.

Introduction

• Welcome to "Creating Web Media"

1. Creating Web Media

• SVG symbols with Illustrator
• The video element
• Control colors in SVG with CSS
• High-definition graphics with Sketch
• Add a Twitter feed
• Combine images with Canvas
• Generate assets in Photoshop in no time
• Web graphics from InDesign
• Keeping it in proportion
• Responsive iFrames
• Create a tiling SVG with Illustrator
• Create a tiling SVG with Sketch
• Loop a CSS animation
• The Audio element
• Randomized animation with JavaScript
• Get SVG from Photoshop
• Customize your thumbnails in WordPress
• Read JPG metadata with PHP
• Animate a sprite sheet with CSS
• Animate a sprite sheet with JavaScript
• Interactive inline photo gallery
• Create customizable graphics with CSS
• Fullscreen background video
• Load animation with HTML and CSS
• Video jump points with JavaScript
• Base64 encoding images
• Using GULP with Sketch files
• Responsive images and the image element
• Responsive images and the picture element
• Create a sprite sheet for links
• Indicate download file types
• Inline video for iOS
• Image zoom to point of interest
• Mask an image in SVG
• Animate an HTML canvas
• Trigger content from a video
• Responsive SVG Logo
• Zooming hover state
• Animate SVG with CSS
• Custom Google Maps markers
• Sprite sheet for animation with Photoshop
• Sprite sheet for animation with Sketch