Traditionally (i.e. in the desktop version of Photoshop), there has been a box to the left of the layer name in the Layers panel which is used to toggle the visibility of that layer. To indicate whether the layer is visible, Photoshop has used the eye icon. This eye icon has two visual states (not counting the empty box, which means the layer is not visible):
- Fully black or white (depending on whether the user has chosen a light or dark interface color theme).
The first visual state (black or white) means the layer is visible. The second visual state (gray) means the layer is implicity not visible, as it is contained within a group that has had its visibility turned off.
In Photoshop on the web (Beta) there is a very different visual implementation of the visibility icon:
- While the eye icon is still used to represent the layer visibility, it has been moved to the right of the layer name.
- The eye icon always appears, i.e. there is no empty box to indicate a layer is not visible.
- The gray eye icon is now used to mean the layer is fully visible.
- A new solid white or black eye icon with a diagonal line through it is now used to indicate the layer is not visible. In addition, the layer name becomes gray to reinforce the fact the layer is now not visible.
This new implementation of the visibility icon raises the following issues:
- The eye icon now occupies the space traditionally reserved for the lock icon (to indicate the layer is fully locked). This means that if a visible layer is locked you can no longer see the eye icon and the only way to toggle the layer's visibility is by using the keyboard shortcut ⌘ + , / Ctrl + ,
- Furthermore, if you hide a locked layer by turning the visibility off, the eye icon with the diagonal line through it now replaces the lock icon. This means that the only visual indication that the layer is locked is the fact that the Add layer mask and Delete icons at the top of the Layer panel become grayed out if that layer is selected.
- If you turn off the visibility of a group, the visibility icons for the layers inside the group become gray eye icons with a diagonal line through them, making them very similar in visual weight to the gray eye icons used to indicate the layer is fully visible.
- There is very low contrast and color difference between the color used for the gray eye icon & the grayed out layer name, and the Layers panel background color when using the Light color theme. Using Adobe's own Leonardo color tool results in a Fail according to the WCAG criteria for all text, UI components & graphics, and is considered Unsafe even for normal vision. These results become worse when the background color changes as you hover your pointer over the layer in the Layers panel. The Dark color theme fares a little better – it is only considered Unsafe when the hover background color appears. (I think these accessibility issues might, at least partially, be resolved if the UI colors were migrated to the latest Spectrum 6.0 color palette.)