Photoshop

 

iPad Wallpaper Images

I've been spending a lot of time with Photoshop lately, and I'd like to share some of my work with you. Jump over to Riven Design and check out the iPad wallaper images we've put up. When I have time I'll add some other formats.

Visible or Invisible Links

Website's in general, and blogs in particular, are all about links. Sending people where you want, to content that they want. Are your links easy to find? How about if your site was viewed by someone colorblind or partially sighted?

Accessibility can be viewed as the "ability to access" the functionality, and possible benefit, of some system or entity. - Wikipedia

If your viewers can't find your links, can't navigate your site, can they benefit from your content? The problem I often see with links isn't with the main navigation, but with links in the content of a page. Too often I see content links that don't contrast enough with the main content to be easily identifiable. They blend in to content, and therefore are useless. A link unseen is a link unused. In this sentence, which words are links? It's a trick question actually, because every word is linked. I've used a bit of inline CSS to change the appearance of most of them. I've also suppressed the hover and focus psuedo-classes on some of the links. This means that they don't change when you mouse or tab over them. Not a helpful change if you're trying to find links, but one I've seen in use. The important part of links is that they are consistently identifiable. They need to be seen to be used. Links can have just about any effect applied to them you'd like. Choose from things like added color to bold, italic, underlined and overlined text. These can be done singly, or in any combination. For accessibility purposes, you should use at least two of them. One thing that accessibility guidelines agree on is that color should never be the sole method of passing on information. WCAG 1, WCAG 2 and Section 508 all have similar things to say on this subject. If color is your only identifier, it only takes a poor monitor to make them invisible. Use multiple signals to identify links and everyone will be better off. I'll go into the CSS of links in another post, but for now think on this. The design of your links is important. Color and style, underlined or not, background color or not, these are all can affect the flow of traffic through your site. How important is visitors finding your content to you? Thank you to Glenda Watson Hyatt for starting the discussion that lead to this post. Now I suggest reading her post on 3 Tips for Making Your Hyperlinks More Usable.

Riven Design

As you may have notice, I haven't blogged much lately. One of my recent endeavors has been doing web design at Riven Design. I've been doing web design with an emphasis on high quality imagery and accessibility, and some really fun print design as well.

Riven Design

HDR Explained

Two of my favorite Photoshop experts, Ben Willmore (Digital Mastery, The Best of Ben and Where is Ben?) and Bert Monroy (PixelPerfect) get together. They meet to explain HDR (High Dynamic Range) in a two part series. A great explanation of HDR, with a walk through of the creation of an HDR image. Simple enough explanations that anyone who uses Photoshop can follow along, and with enough detail that even someone who's used Photoshop as long as I have can learn something new.

Web Image File Types

What type of image should I use online, JPG, GIF, or PNG? Simple question, but the obvious reply is another question. How are you going to use the image? One of my favorite quotations is Horatio Greenough's "form follows function". The function of an image should control the image's file type. A few things to consider:

  • Is it a large image?
  • Is it a photograph, logo, line drawing, or simple graphic?
  • Are there file size requirements?
  • What color profile is required?
  • Do you need to match image colors with any other object on the site?
  • Are there subtle gradations of color?
  • Are there large blocks of a single solid color
  • Is transparency required?

Once these questions are answered, the file type required is much easier to determine. Some tasks can be accomplished by all three common web image file types, others by only one or two. The need for subtle color transitions for instance would rule out GIFs, while the need for transparency would rule out JPG. If you need both of those things together, a PNG file is the only real option. Look at the function required, and use that to control the file type choice. JPG files are the best web solution for photographs, images with subtle variations of color, and images with large blocks of a single solid color. They also compress well, allowing for larger images to still have reasonable load times. They do not however, allow for transparency. This format also uses lossy compression, which means compression of the file causes loss of detail. The more compression, the more loss. GIF files are very good for logos, allow transparency, and use a non-lossy form of compression. They also allow for animation of images. The downside of this is that they only allow for 256 colors, so color matching can be awkward. Due to the color limitations, GIFs also do not reflect subtle gradations of color well. PNG files are a nice compromise between the two. They allow transparency, and can use up to 24-bit color. This allows them to use both the subtle color range of of the JPG, and the transparency of the GIF. In practice, I've actually had more luck with using PNGs for transparency than GIFs. Just as PNGs are better at subtle color gradations than GIFs, they also seem to be better at subtle gradations of transparency. The key here is to look at the purpose of the image. File type follows function. 

PhotoShop Pattern Maker

I was already a fan of the PhotoShop Pattern Maker, but after that tutorial, I'll be looking at it from a new niewpoint. The use of it with the photo was interesting, but I loved the text pattern they created. I can see using some variation of this in print work.

Photoshop Tips

I came across 53 Ultimate Tips For Better Photoshopping the other day. A very good list of Photoshop shortcuts, both commonly known and not so well known. It is one of the more comprehensive lists like this that I've seen.

To Photoshop, or not

Scott Kelby has a great post about Photoshop vs. My Camera.

“Can’t you just take them out in Photoshop?” Yup, I could but I really hate doing that, so I just moved my camera to a spot where I could compose the frame without the wires being visible. That was much faster and easier—getting it right in the camera.”

People constantly underestimate the amount of work it takes to fix a photo in Photoshop. Getting the photo right the first time is often much easier, and almost always gives you a better final product.

Photoshop Shortcuts

Here are 30 Photoshop Secret Shortcuts.

"Well, what I mean by "secret" is that these shortcuts are not documented in the menus."

h/t Adobe Photoshop Daily Tutorials

Syndicate content