Web images with snazz

The below tips are adapted from "5 Simple Things You Can Do to Make Your Web Images Pop". Note that sharpening should be last on your list of actions you take on any image.

1. Try a subtle slightly darker edged vignette around the image.
2. Convert the image to black and white (or grayscale). The right way: check colors and adjust before conversion. Skin tones may need an increase in luminosity of oranges and yellows.
3. Check and adjust tones as needed.
• -- Histogram adjustment (especially check the mid-tones)
• -- Skin tones (color balance)
4. Selectively sharpen areas of the image. Use a mask layer to make this easier and easier to "recover from".
5. Last before saving (or uploading): Sharpen. ... Or Unsharp mask, if you can experiment with settings until the photo is "just right". Nearly all images from digital cameras need some sharpening.

In some of the portfolio sample photos at SharkPixel, I noticed something I like to check and often do -- skin smoothing. Check their portfolio for some dramatic changes after skin retouching and smoothing in general. Holding your mouse over a photo shows a photo prior to some retouching.

Related links:

• 5 Simple Things You Can Do to Make Your Web Images Pop
• SharkPixel

Desktop publishing basics

Putting out an appealing newsletter, brochure or other print publication for your church is often not simple or easy.  Most people need some level of training on how to do it well.

Your information needs to be in an easy-to-read, eye-catching format. Good publication design delivers news and messages effectively. Take the time to understand and follow simple fundamentals of design. The end result will be a publication that is easy to quickly understand and easy on the eyes.

Layout basics

It may be fun to use the variety of colors, graphics and fonts offered with many design tools, but remember tha readability is the most important aspect of your piece. Due to the web, more people now "scan" even written text rather trhan read it.  So we need to adopt new techniques to help people find what they want and read it easily.

Easy-to-read pubs use

• A serif font for text and a sans serif font for headlines and subheads. Serif fonts have extra strokes at the end of the lines that form the letters; sans serif fonts have no extra strokes.
• A type size of 11 points or larger.
• Left-aligned margins, not justified.
• Text in columns and boxes -- not spread wide across a page.
• Grouping of related stories on a page.
• Graphics or photos that visually describe the story and draw interest. It's OK to use up to three fonts in your publication — one for text, one for headlines and one for your banner or nameplate. But suing more than three can cause clutter and look "circusy".

Headlines

Headlines (and even subheads) need to quickly tell tyhe reader what the text is about.  Avoid "cute" headlines or ones that allude to the text but don't rteally describe what's important. Articles at the top of a page normally should be larger than those lower on the page. Size and placement relates to importance.

White space

White space — the space not occupied by text or graphics — makes the page easier to read. Don't avoid it -- treat is as your friend. Cramming a page full makes it look like a tough read.  Some people avoiud tough reads. Use white space on all four margins, between columns and within text itself.

Simplify text

A rule of thumb when writing for the web is to try to delete 50% or more of the existing text. After boiling down the text to the essentials, look for "lists" of things and change them to bullets. Then break up the longer articles with subheads.
[reference: Technology for Ministry, UMCom]

Church website beauty

Church Beauty is the Church web site equivalent of CSS Beauty.

Most of the designs are very heavy on graphics and have a "slick" look. Many of the included webs seem to have a home page that's less functional that I'd like to see for visitors and members alike. A few have some uniquer approaches to presenting information that are worth considering. But remember that Church Beauty is about the look, not the content.

Personally, slick looks make me nervous and I cringe at the jarring, over-saturated colors of some church webs -- they have an "circus" atmosphere. I prefer a "good" look with outstanding content over a flashy look with mediocre content.

Picasa 3

Picasa 3 is fresh out of beta. Google says that key goals were a faster and more stable photo organizer/editor/sharing software.

If you use Picasa, update now. If you have not tried it, check out the new and improved features of Picasa 3. It's free software from Google.

• Picasa downbload
• Picasa 3 feature review
• Google Photos Blog
• Known issues and recent fixes for Picasa

Traits of a great web site

Titus Hoskins in SitePro News lists seven traits of a great web site:

• Keywords are used
• Design is simple
• Pages are optimized
• Navigation is easy
• Content is fresh
• Good enough to bookmark
• Looks cool

Cool Kuler Coolest

Adobe Labs has come up with a winner -- Kuler. Fun to use and a boon to web and graphics designers of all types, this color grouping creator and sharing application is a very popular site.

Take the Kuler tour (aka tutorial) to see what it's all about. It even plays cool music while you learn. To create or share color groupings, you'll need an Adobe ID.

The Museum of Modern Betas (MoMB) lists Kuler as #7 in their "Top 100".

Tips for great photos

Tips for taking great photos are usually of two types -- composition and camera settings. The Kodak page, Top 10 Tips for Great Pictures emphasizes composition and lighting, but also has some camera settings tips.

Another resource is the Church Communications: Photography Tips page. It's loaded with tips and links.

Corporate logo library

BrandsOfTheWorld.com is a free library of brands and logos. The service is searchable, categorized and provides scalable vector versions (usually EPS) of thousands of logos.

Using images for bullets

Would you like to have bulleted lists with fancier bullets? Have you tried using an image as a bullet and hated the result? Buddy, have I got a deal for you.

The MaxDesign site has a LisTutorial specifically for this. The step-by-step details are easy to understand and the code is short. Try it; you'll like it.

Look more professional

Want to make your design to look more professional? Here's a few tips:

• Use a good color scheme.
  Avoid wild colors. Avoid distracting background images or ones that do not help a "professional" appearance. Match the color scheme to the intended audience, not to your own tastes.
• Use safe fonts.
  Avoid weird or wild ones. Also remember that fonts carry emotions with them. Do you really want your church to come off as "Comic"? Is that professional?
• Develop a clear, logical layout.
  A simple, clean design looks professional. Avoid a cluttered or cramped look. Navigation should be easy to understand. Minimize multiple navigation menus on the same page. Use bulleted lists logically. Use headings and white space to visually show which elements are related and which are not in the text area. Test your pages in multiple browsers -- they won't all look the same.
• Keep any graphics simple and fast.
  Images slow down display of a web page. The larger the total image file size, the slower the page displays. Sprinkling in images can also distract the visitor's eyes and create an unprofessional appearance. Animated images are very distracting and often give an unprofessional look. Always question their use.

Learn more ...

• 5 steps to a great home page (NetMechanic)
• Top 10 reasons visitors leave your site (NetMechanic)
• Web Design Tips
• Design tips (link collection at UseableWeb.com)

Reduce JPEG image file size

A large image file size can slow down your web page getting displayed. You want to get a small size while also retaining good image quality. For JPEG type images, here are some steps to take:

1. Add a bit of blur, which helps reduce noise
2. Decrease saturation a bit
3. Decrease contrast a bit
4. Optimize the image

Source: Expert Optimization: Five Tips for Optimizing JPEGs in Photoshop CS2

Church branding

Churches use branding as do many non-profit and commercial businesses. What's branding? Well, it doesn't have anything to do with hot iron, though the general concept does relate to cowboys' branding of livestock to identify the owner.

BRAND EQUITY (Branding): "The intangible, but real, value of words, graphics or symbols that are associated with the products or services offered by a business."
-- U.S. Small Business Association.

Here are some general quotes about branding and identity:

• "Your logo. Your business cards. Your advertising. They're all a reflection of you and your company. Properly designed, they communicate to your employees and your customers that your company is credible, trustworthy and professional. Your business image depends on a logo design that is polished and distinctive. Your logo is the cornerstone of your brand.
  Not only does a high quality logo show your customers that your business is professional, but it also differentiates you from your competitors and creates a powerful memory in the minds of your customers. When they need your product or service, they'll think of you.
  Imagine as you hand out your next business card."
  [Excerpted from "Professional logo design"]
• "Creating your business identity is an important step in building your company. Above all, your logo is key to your company look and message. ...The logo is a powerful branding tool. It is on every piece of your company material, and it visually defines the company."
  [from Larta University's Online Resources"]
• "An effective corporate logo identity design or ideation concept represents the all-important first step to creating an effective brand that will proudly represent your company. ... We work to develop a unique brand that integrates all of your online marketing practices with your traditional print marketing techniques. Items such as business cards, brochures, fliers and mailers should already distinguish you from your competition. "
  [Spicore Business Solutions]
• "Once complete, your new corporate identity is ready to go to market on business cards, signs, print, media, the web, cd and so much more!"
  [excerpted from Profiles Digital Media, Logo/Identity Design]
• "What makes a good logo?
• A simple logo design is often better than a "fancy" one
• Being unique is better than trying to imitate a competitor
• A single color logo design is more versatile "
[Excerpted from "Dynamite Web" logo service]

General branding tip - avoid buildings
People react much more positively to a logo or to actual people in an image than they do to a picture or drawing of a building, including a church building. The building image/line art is seen as "cold" and impersonal. Logos are usually seen as neutral or "warm" (depending on exactly what they are), and images of people are seen as "warm" and inviting. While many Christians like to see images of church buildings, we need to let concrete business-world research lead the way here, especially if we are approaching unchurched people.

The last thing we want to do is convey, in any way, a sterile or cold feeling, which an image of a building does. A member of a former church was fond of reminding the church leaders that "The Church is not a building -- it's the assembled people, who can worship in a great many places." His point was that people are more important than any building. (Check out the header of New Heights Community Church). So why on earth emphasize a building in our identity?

Promote a church feature
A building feature may be distinctive enough for use as a church logo. One example is Avondale Pattillo UMC, where the logo closely resembles the unique top of the sanctuary facade that's easily seen from the road. A logo can also be tied to the church name or the area, like the one for Oak Grove UMC. If your church steeple is unique and readily seen by passers-by, it might be a good logo. Just shun drawings or photos of a building as a logo.

Optimizing your web site

... not to be confused with search engine optimization (SEO). Optimizing your site has to do with making it fast and efficient. Shrinking image file size, keeping pages "light", using design methods that speed display time, getting rid of unnecessary elements, and more.

A basic tenet: If you don't need it, don't use it. Blast those opening "splash" pages, twirling animations, and huge file size photos .

WebMonkey has a good tutorial on web site optimization .