Table of Contents for
Responsive Web Design with Adobe Photoshop
Responsive Web Design with Adobe Photoshop
Published by
Adobe Press, 2015
- Cover Page
- Title Page
- Copyright Page
- Acknowledgments
- Contents
- 1. Photoshop’s New Groove
- 2. How Did We Get Here?
- 3. The Case for Designing in the Browser
- 4. A Plea for Photoshop–Browser Harmony
- 5. Vetting Direction
- 6. Establishing Style
- 7. Establishing the System
- 8. Getting Back into Photoshop with Page Layers
- 9. Extracting Your Way Out of Photoshop
- 10. Extending Photoshop
- 11. Remembering Etiquette
- 12. Adopting a Completely New Workflow
- Index
- Responsive Web Design with Adobe Photoshop
Contents
Can I Still Get by Without Knowing Code?
The Core Tenets of Responsive Web Design
The Minutiae of Version Disparity
The Merits of Comparable Tools
We Need to Make This Responsive!
The Faults of Traditional Photoshop
Some Fonts Are Better Than No Fonts?
Double the Effort, Double the Pain
3 The Case for Designing in the Browser
You Get a Tool! And You Get a Tool! Everyone Gets a Tool!
Fluid by Nature: The Inherent Benefits of the Browser
PSDs for Proofreading, Browser for Evaluating Behavior
Reaffirming Expectations That Things Look Different in Different Browsers
Assessment as a Client Education Tool
4 A Plea for Photoshop–Browser Harmony
Creative Mode vs. Correct Mode
Using Photoshop Only When Necessary
Practical Photoshopping: An Overview
Within the Realm of Possibility
Including Your Stakeholders in the Design Process
Finding and Storing Inspiration
Conversations, Not Deliverables
Covering a Lot of Ground Quickly
Do Not Make It Look Like a Website
Do Make It Look Like a Website
Why the Style Guide Should Live in the Browser
Building the Component Library
Contents of a Comprehensive Component Library
Choosing the Best Environment for Your Components
8 Getting Back into Photoshop with Page Layers
The Struggle to Increase Fidelity
Don’t Get Too Comfortable in Photoshop
Leveraging Linked Smart Objects
There’s No Easy Way to Suggest Tweaks
Framing Content and the Big Picture
Some Elements Suffer from Responsive Wonkiness
Width-Specificity in Page Layers
9 Extracting Your Way Out of Photoshop
Asset Extraction Is Like Pulling Teeth
Downloading Assets via Libraries
Building the “You” Version of Photoshop
Framer, Composite, and Stand In
The Problem with Inheriting PSDs
Increased Importance in an RWD Workflow
Use Groups and Globalize Where Possible
Be Aware of Resolution and Density
Control Your Text Boxes and Separate Them
Be Familiar with Browser Compatibility
12 Adopting a Completely New Workflow
Looking Back at Moving Forward
Full-Page Photoshop Comps Are Disharmonious with RWD
Designing in the Browser Helps, But Not As Much As We’d Like
2 Cups Browser, 1 Cup Photoshop
Vetting Direction Efficiently Is Critical
Style Can Be Established Through Small Exercises
Page-Building Is Easier with Component-Based Systems
Page Layers Makes Going from HTML to Photoshop Simple
New Extraction Tools Get Us Back to the Browser Quicker
We Can Customize Photoshop for RWD with Useful Third-Party Extensions
A Little Etiquette Goes a Long Way
Strategies for Getting Buy-in Internally
Strategies for External Getting Buy-In
What Happens When Things Go Wrong
Adjusting Your Perspective on Tools