Always optimize images for your website

image optimized automatically by Facebook

Images should not go straight from camera to website.
Large image files take up space and bandwidth and also increase load time for users. Fast-loading websites require small image file sizes, and furthermore, speed is a search ranking factor.

A quick way to optimize images for your website:
Post the image (or batch of images) on Facebook. Go to the post and click on it in order to see the larger version of the image. Copy or download the image. Rename the file something that makes sense (for example, “locally-grown-produce.jpg” instead of the random numbers that Facebook uses to name files)—naming image files on your site meaningfully is important for search rankings. Delete the post after downloading the images.

Free optimizers:
There are lots of free image optimizers online. We were able to reduce the image above to about half (118k) the size of the Facebook-optimized image. Try a few of these online tools and bookmark an optimizer that you like. Your goal is sharp-looking images and a small file size.

Website image rules:
There are a few basic rules for website images that you should learn and try to follow, and file size is number one:

  • Optimize images for speed
  • Use jpgs for photos and pngs for flat (vector) images
  • Image file names should describe image



Favicons: tiny branding

favicons in use

A favicon (or “favorite icon”) is the 16 pixel square image that precedes the website title in browser window tabs (see illustration). Nowadays, favicons are used for tile and touch icons, iPhones and Android/Chrome apps, so they need to be larger (WordPress likes a 512 x 512 pixel image) so that they can be distributed correctly on different devices and apps. Thumbnail logo images, of which browser tab favicons are the smallest, are not legible, so we recommend a simplified logo, or an initial or monogram in the brand color(s).

favicon Carson Park DesignYou can see how spare our logo looks here at 75 pixels, but it looks appropriate in a browser tab or as an app image. Favicons have become hilariously complicated over the years, but the WordPress soultion has at made favicons easy to implement for millions of website admins.

One plus one makes three

two color matchbooks

Old fashioned two and three color printing often overprinted spot colors (colors generated by a single press run) to create a third color. Both of these Hungarian matchbooks are two-color press runs of the same red and turquoise green. The print on the left makes use of a third, “black” color by running the red on top of the green (overprinting).

Four color process printing practically makes two or three color printing obsolete, and we know the reasons for this, but there’s a charm to two and three color printing. Skill and imagination were required to make use of overprints that created new colors without additional press runs.


Raster (or Bitmap) vs Vector images


Raster (or bitmap) images are fixed-resolution images, made of a grid of pixels. If enlarged they will be blurry and pixelated, with a “stair-stepped” edge.
Common raster file formats are jpg, gif, tiff, bmp and png.

Vector images can be enlarged to any size with no loss of resolution.
Vector images are created by a series of points that are joined using a mathematical formula that determines the vector between points.
A purely vector file format would be svg (scalable vector graphic). Adobe Illustrator files are typically vector, but Illustrator supports placed raster images, just as Adobe Photoshop files now support vector layers. Pdf and eps files also support both vector and raster images, so asking for an Illustrator, pdf or eps file does not guarantee that you’ll end up with vectors. If you need vectors, ask for a vector file. It may be delivered as an eps, pdf, svg or ai file.


Your logo should be in a vector format so that it can be reproduced at any size. Ask your designer for a vector pdf with type converted to paths to guarantee excellent reproduction at any size.


Is yellow pages advertising still worth it?

yellow pages advertising — is it worth it?

Yellow pages advertising is extremely expensive, especially considering its ever diminishing value due to decreased usage. And in most markets there are multiple books, each taking value from the others. Here on California’s rural north coast, The Black Book is probably the most used and the best buy—YP has no white pages, and the type is tiny, even though it’s a larger format, and the “Local Pages” is from Salt Lake City, and its listings are out of date.
Think about these problems before you enter into a contract for yellow pages advertising:

Expense: think of the online ad programs that your yellow pages ads would pay for.

Diminishing usage: every year, your potential customers are going to the web first.

Multiple books: most counties now have competing phone books—each with some of the market.

Lack of flexibility: contract is for an entire year, far in advance of publication.

The job of the ad sales reps is to get advertisers to spend the same or more money in next year’s book — this is reflected in a pricing structure that punishes clients for trying to decrease the size of their ads (what a way to thank your loyal clients). Ad reps also try to sell clients into every applicable category, but some categories are scarcely used. A category could sound reasonable, but rarely be referenced: Some yellow pages have a category for “internet—web design services,” but nobody looks for a web developer under “internet”— and how many business owners would even look for a web developer in the yellow pages? And some types of businesses don’t benefit from yellow pages advertising — for example: what benefit could a corner market get from the yellow pages?

Online advertising offers control and flexibility. With online advertising, the advertiser can change the message any time, and can control the reach of the ads. For example, one company we work with uses Google Adwords — they turn up the amount they pay per click when they are slow, and lower the amount they pay when they are busy.

There’s some value in yellow pages for some business categories, but if you are not a criminal attorney or an emergency plumber, the yellow pages is probably not a sound investment.



Formatting social media profile images

Formatting social media profile images

Profile images on Facebook are automatically cropped into a 160 pixel square and reduced to a 32 pixel thumbnail that shows up next to your comments. When you create your profile image, use a larger square. Facebook will automatically reduce it to 160 pixels. Leave a bit of a margin, since Facebook snips a few pixels off all the way around.

Most logos are not ideally presented in a square (and worse, a 32 pixel thumbnail) but there are workarounds. For many logos, simply using an initial(s) from the logo in the recognizable branded colors is an excellent alternative (remember, the name of your company is written in large letters on your Facebook page next to your profile picture, so your profile image does not have to be fully legible).

Here’s an example of a horizontal logo we want to set up a Facebook page for, so we’ll need to create a square profile image that looks good at thumbnail size.

The problem with a horizontal logo is that in order to make it fit in a square it has to be reduced. As a thumbnail (the smaller image to the right), it’s impossible to read and starts to lose the branding.

In this case, we used the monogram in the logo, which retains legibility in the 32 pixel thumbnail.

You need a profile image for most social media, and though this post is about Facebook specifically, the same concept applies elsewhere.



Spot color trompe l’oeil…


With the loss of so many letterpress job printing shops in the ’70s and the explosion of inexpensive four-color offset printing in the late ’90s, graphic designers have reacted by creating four-color jobs that mimic the appearance of two or three-color jobs. It’s considerably more expensive now to print two spot colors than to print in full color, because presses are now set up to run full-color (four-color or process color) with minimal press adjustments between jobs.

We came across this example of the phenomenon in a vector tutorial by Rype (Ryan Putnam) on his Vectips site. To complete the illusion, he has given the piece an off-register look, as if the colors had not been perfectly aligned by the pressman. Color registration was a common problem in the past with web presses and large sheet-fed printing in which several jobs were run simultaneously (newspapers, the yellow pages, matchbooks, etc). Who could have imagined that someday we’d be nostalgic for low-quality printing?


Email signatures: best practices

email signature problems

Guidelines for email signatures:

  • Text only works best
  • Avoid images (logos, social media links, photographs, etc)
  • Avoid HTML formatting — some recipients will see a text-only version
  • Avoid wise sayings and witty aphorisms

The email signature in the illustration shows how confusing images (logos, social media links, etc) can be. The sender, in the illustration below, believes that he is sending a message with no attachments, but the receiver sees five attachments. If there were an attachment, how would he know which of the (now six) attachments is the one he needs? In addition, attachments in emails may be viewed with suspicion by spam filters and security software.

One thing that this sender did correctly was to make the contact portions of the signature live text. If that information is part of a logo image, it can’t be copied and pasted. He also used web-safe typefaces (Georgia and Tahoma). There is simply no guarantee that the recipient will see your message in the type you specified, but the chances are increased with web-safe fonts.

Aphorisms and wise sayings have no place in business correspondence. It may seem innocuous or well-intentioned, but you risk offending people, and there is nothing to be gained.

Keep the signature on your professional emails attachment-free and text only.




Tips on social media content

keyboard image

  • Don’t hire a third party to post for you.
    Nobody knows your business like you do.
  • Vary your posts.
    Facebook is a great place to showcase your business. Combine a mix of content about your business (product info, trade shows, behind-the-scenes images, sales events) with other content, such as links and shares of third-party posts. Be a resource to users.
  • What seems dull to you may be of interest to followers.
    A vineyard owner may see after-harvest pruning as a mundane chore, but for others it may be interesting. Every business has compelling aspects.
  • Create regular features.
    A “sale item of the week,” or a regular event (product demonstrations, or “meet the maker”) will bring people back to see what’s new.
  • Make it pithy.
    Keep it brief.
  • Encourage comments.
    Treat your followers like friends — respond to comments regularly.
  • Follow other business pages.
    Follow pages associated with your business, and local businesses.
  • Tag other businesses — they’ll appreciate it.
    To tag other pages in your posts, type “@” and follow with the name of the page you wish to tag. Facebook will autofill the name and when you select it, it will be a link.

Truly custom holiday cards

We design custom holiday cards, so why send expensive but mass-produced, boilerplate greeting cards to your clients? We’ll create a unique holiday greeting, branded for your business. Now’s the time!