O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Creating Web Graphics Using Photoshop CC

Video Description

Master the ins-and-outs of creating web graphics using Photoshop CC with this one-of-a-kind video training course Creating web graphics in Photoshop has its challenges, but with a little know-how from our skilled instructors, youll be able to generate graphics for the web with ease. Our instructors provide expert, straight-forward, user-friendly training to help you produce image assets for the web the way you want to learn. Start with an overview of web file formats, and then dive into optimizing settings for JPEGs, GIFs, and PNGs. Create slices for optimization and interactivity Add buttons and rollovers and animate web graphics Take advantage of automation techniques like batch processing and creating droplets Includes nearly 4 hours of web graphics video training. If you're looking for real-world instruction on creating Web graphics with Photoshop CC, youll find it here.

Table of Contents

  1. Understanding Web Graphics
    1. Working with Pixels in Photoshop 00:06:22
    2. Optimizing Quality vs. File Size 00:03:09
    3. Techniques for Sizing Images 00:04:19
    4. Naming Conventions for Web Graphics 00:06:26
    5. Overview of Web File Formats 00:05:02
    6. Using the Save for Web Dialog 00:05:28
  2. Optimizing JPEGs
    1. Characteristics of the JPEG Format 00:05:10
    2. JPEG Presets and Optimization Settings 00:07:32
    3. Balancing Quality and Compression 00:05:38
    4. Matting JPEGs 00:04:19
    5. Choosing a Preview and Including Metadata 00:06:23
  3. Optimizing GIFs
    1. Characteristics of the GIF Format 00:04:34
    2. GIF Presets and Optimization Settings 00:06:39
    3. Reducing Colors for Compression 00:06:15
    4. Transparency and Dither 00:06:26
    5. Matting GIFs 00:04:24
  4. Optimizing PNGs
    1. Characteristics of PNG-8 and PNG-24 00:04:46
    2. PNG Presets and Optimization Settings 00:04:25
    3. Adjusting Color in a PNG-8 00:04:48
    4. Transparency in PNG Files 00:07:05
    5. Matting PNGs 00:05:19
  5. Creating Slices
    1. Understanding Slice Types and Options 00:04:37
    2. Slicing for Optimization 00:06:07
    3. Slicing for Interactivity 00:06:21
    4. Converting Slices 00:06:13
    5. Exporting Slices 00:05:20
  6. Creating Buttons and Rollovers
    1. Building a Button 00:06:22
    2. Using Layers to Create Primary and Secondary Images 00:04:47
    3. Adding Layer Styles to Apply Effects 00:06:21
    4. Using Preset Button Styles 00:05:51
    5. Saving Rollover Buttons 00:06:44
  7. Animating Web Graphics
    1. About Animated GIFs 00:05:00
    2. Timeline vs. Frame-Based Animation 00:05:55
    3. Importing Images and Layers as Frames 00:05:58
    4. Tweening Frames 00:05:42
    5. Optimizing Animation 00:04:27
  8. Automation Techniques
    1. Building a Resize Action 00:08:44
    2. Batch Automating for Optimization 00:08:20
    3. Creating a Droplet 00:06:43