Successful Blog

Here is a good place for a call to action.

Above the Fold: SmartWealthyRich.com

by

Couldn’t Resist SmartWealthyRich

ABOVE THE FOLD

I met Jonathan Phillips when he left a message with me at MyBlogLog. I took a side trip to his blog, before I replied. When I got there I saw something I couldn’t resist — the title of his blog.

Smart, Wealthy, Rich [dot] com

But that engaging title was in tiny typography . . .

So I invited Jonathan Phillips to get tweaked Above the Fold. Here’s how the Above the Fold Tweak Process works

  1. I make a “before” screenshot.
  2. We talk through some changes for readability.
  3. The blogger makes the changes.
  4. We talk while the tweaks are in process.
  5. I take an “after” screenshot and share the results in a post.

Tweaking Smart, Wealthy, Rich

The blog: SmartWealthyRich.com
– How to create wealth, keep it, and make it grow!
URL: : http://www.smartwealthyrich.com
Blogger:: Jonathan-C. Philllips

Before

This is SmartWealthyRich.com before we started. Click to enlarge.

Smart Wealthy Rich

Three Tweaks that We Agreed Upon

In this series, we’ll concentrate only three important tweaks for each blog that is featured. On Jonathan’s blog, those three tweaks were these.

  1. His feed button was overpowering.
  2. The title is too small.
  3. The main body text block is too wide. A reader needs transportation to return to the next line.

Jonathan and I discussed how in a blink test, the feed button wins. We decided that it would be a much stronger presentation if the title got that first attention. Folks would remember where they were and where they wanted to return.

When choosing text the type size needs to match the line length. If they don’t match, the eye has trouble doing the “return sweep” to the next line correctly. Jonathan’s line was too long for the size of the type in the body text. We shortened the main body copy block and increased the type size.

We made other changes. Can you see them?

For the results, turn the page now. [Read more…]

Sandy’s Great Graphic Tip: Re-sizing Graphics in an Editor

by

What Happened to that Picture?

Sometimes you see photos on websites that look funny – too wide or narrow, tall or short. In other words, out of proportion. Some other terms used are scale, perspective and aspect ratio. One common way to re-size a graphic is using a WYSIWYG editor. WYSIWYG is pronounced wiz-e-wig and is short for what you see is what you get.

Hover over the corner of a graphic, click and drag. Depending on the program, it’s possible to lose perspective, so keep this little tip in mind.

Hold down the shift key while clicking and dragging. It will keep the picture looking square.

Another Option to Re-Size a Graphic

Another option is to right-click the graphic and choose format. In the window, you usually have a choice to re-size the graphic by pixel size or percentage of original. You will probably see a check box for preserve aspect ratio or uniform scale. Selecting the box means when you enter the horizontal or vertical size, the other dimension is automatically selected to keep the graphic in perspective.

Here’s a visual example of what I mean:

Re-size Graphic Sample

It’s also a good idea to re-size and edit graphics before uploading them. When you upload a large graphic and only want to display a small graphic, it can increase the file size and make the page load slowly. Let’s talk more about that another time.

Remember, a good-looking graphic makes your webpage look interesting and professional.

See you next time!

–Sandy, Purple Wren

Related articles:
Great Graphic Tips: Selecting File Types
Great Graphic Tips: Why Use Graphics?
Great Graphic Find: Pixel Ruler

Sandy’s Great Graphic Find: block posters

by

What Do You Want to Decorate?

Great Find: block posters

Permalink: http://www.blockposters.com

Target Audience: Photo Lovers

Content: This nifty tool is very easy to use.

  1. Upload your favorite photo
  2. Slice it any way you like
  3. Download the images
  4. Print
block posters

This is a fast, inexpensive way to decorate a room if you have a lot of wall space and you want to create a mood. What’s better than using your own photos? Check out some of the interesting samples.

Here’s three ideas I have for using posters:

  • Meetings
  • Parties
  • Reunions

Let me know how you decorate with block posters!

–Sandy, Purple Wren Communications

Related articles
Sandy’s Great Graphic Find: PicMaster
Sandy’s Great Graphic Find: Pixel Ruler
Sandy’s Great Graphic Find: SnagIt

Business of Design Online is LIVE!!

by

Bravo! Cat, nt, and Jay!

I have the pleasure of announcing an important new entry in the blogosphere. Ladies and Gentlemen,

Go meet BoDo! The Business of Design Online. It’s the genius brainchild of the team of Catherine (cat) Wentworth, Neil (nt) Tortorella, and Jeanette (jay) Wickham. It’s been months in the making and boasts series and services, resources, and a list of guest authors that outflank anything I’ve seen.

Click the screenshot and see for yourself! It’s downright amazing!

BoDo logo and link

So much all in one place. Do you think you have to be a designer to get value from this site. Heck, you’ll even find me there.

Congratulations BoDo Team!

–ME “Liz” Strauss

Sandy’s Great Graphic Find: IconArt

by

Compact Program for Creating Icons and Cursors

Great Find: IconArt

Permalink: http://www.conware-pro.com/products/ia/

Target Audience: All Computer Users

Content: This Windows-based utility allows you to create your own icon or cursor from scratch or by uploading a graphic. You can create static or animated versions. It’s an easy-to-use, paint style tool that supports text, rotation, color palette options, and gradient fills.

IconArt

Here’s three things I like about IconArt:

  • It’s free (only $9.95 for commercial use)
  • It’s easy to use
  • You can design from scratch or import art to convert

Let me know how you use it!

–Sandy, Purple Wren Communications

Related articles
Sandy’s Great Graphic Find: PicMaster
Sandy’s Great Graphic Find: Pixel Ruler
Sandy’s Great Graphic Find: SnagIt

Sandy’s Great Graphic Tips: Selecting File Types

by

Which graphic file type is best? It depends . . .

A lot of people wonder what the difference is between file types. Here’s a quick description of three common types. To learn more, follow the links for examples and detailed explanations.

.jpg or .jpeg = Joint Photographers Experts Group

  • Superior for photographs, computer game screenshots, blends or gradients (including metallics)
  • Allows compression options (removes information to make the file smaller)
  • Can be used as an image map (single image with clickable areas)
  • Does not support transparency
  • Supports millions of colors

.gif = Graphics Interchange Format

  • Superior for simple shapes, line art, diagrams, or flat colors (think cartoons, icons, logos, buttons)
  • Supports animation
  • Supported by most browsers
  • Allows transparent backgrounds (for round or irregular shapes)
  • Can be used as an image map
  • Supports 256 colors maximum

.png = Portable Network Graphics

  • Designed to improve/replace .gif file but does not support animation
  • Supports transparency
  • Preserves sharp edges
  • Not all browsers support it but it’s gaining in popularity
  • Supports RGB or greyscale (does not support CMYK for print)

How do you know if you have the right file format?

If it’s too grainy, too fuzzy, or the file size is too large, you might want to review the descriptions above or check out Pat Kalbaugh’s GIF vs JPG page at The Sirius Web. Experiment a little – save it as a different file type and see what happens.

See you next time!

–Sandy, Purple Wren

Related articles:
Great Graphic Tips: Why Use Graphics?
Great Graphic Find: Pixel Ruler
Great Graphic Find: FavIcon from Pics
Great Graphic Find: SnagIt