Maria’s Guides

Support and additional material for readers of books, articles, and digital media by Maria Langer.


Random Book Cover #1Random Book Cover #2Random Book Cover #3Random Book Cover #4Random Book Cover #5Random Book Cover #6Random Book Cover #7Random Book Cover #8Random Book Cover #9

links for 2007-08-30

Posted on August 30th, 2007 at 4:29 pm · No Comments
Filed in: RSS Links Worth Following   

→ No Comments • Read 123 Times
Add to Del.icio.usAdd to Del.icio.us • Technorati ThisTechnorati This • Digg ThisDigg This • Stumble ItStumble it! • Twit ThisTwit This


iLife ‘08 Updates as of August 29, 2007

Posted on August 29th, 2007 at 7:39 pm · No Comments
Filed in: RSS Mac OS Books   

Information from Software Update.

iLife'08The following iLife ‘08 Updates have been made available as of August 29, 2007:

  • iWeb Update 2.0.1 addresses issues with upgrading and publishing iWeb 1.x websites.
  • iPhoto Update 7.0.2 addresses issues associated with publishing to .Mac Web Gallery, rebuilding thumbnails, and editing books. It also addresses a number of other minor issues.
  • iMovie Update 7.0.1 addresses issues associated with publishing to .Mac Web Gallery. It also improves overall stability and addresses a number of other minor issues.

I’ll continue to list new updates as they become available.

→ No Comments • Read 541 Times
Add to Del.icio.usAdd to Del.icio.us • Technorati ThisTechnorati This • Digg ThisDigg This • Stumble ItStumble it! • Twit ThisTwit This


links for 2007-08-28

Posted on August 28th, 2007 at 4:35 pm · No Comments
Filed in: RSS Links Worth Following   

→ No Comments • Read 139 Times
Add to Del.icio.usAdd to Del.icio.us • Technorati ThisTechnorati This • Digg ThisDigg This • Stumble ItStumble it! • Twit ThisTwit This


Web Site Redesign: Fitting in My Photos

Posted on August 28th, 2007 at 5:48 am · No Comments
Filed in: RSS WordPress Books   

With 90+ photos appearing randomly in my old site’s header, I wasn’t about to leave them behind.

CutlineOne of the reasons I chose the Cutline 3 Column Right theme for my site’s redesign is because I wanted a three column layout that was wider than my old site. Studies — including stats from all of the sites/blogs I operate — showed that the vast majority of Web site visitors have their screen resolutions set to 1024×768 or wider. I even use that setting on my little 12″ PowerBook. So the old site’s redesign was throwing away 200+ pixels of screen real estate that could be better used providing content or navigation features.

How Do I Use Those Images?

The problem I faced was the header image. Since I built my blog in WordPress nearly two years ago, I had been displaying images that I’d taken during my travels. The images had to be cropped and fit into pre-established format. I used the Random Header plugin to randomize the display. Over 18 months, I’d added nearly 100 images to the header image collection. I’d even begun writing about them in the About the Photos topic. They had become an integral part of my site and I didn’t want to lose them.

So while I continued working on my Leopard book during the day, this little problem was in the back of my mind. For days. One option was to rework the CSS and change the header image so it only took up a portion of the width and use the space beside it for a Web site description. Unfortunately, I don’t know enough CSS to do this successfully without spending hours on trial and error. With a deadline approaching, I couldn’t afford to waste time experimenting. I had to have an answer and be ready to implement it.

About the Photos Images

Then I remembered the smaller images I use in About the Photos to show the images I’m discussing. What if I put three of them side by side and displayed them with some sort of randomizer? Would they fit? What would they look like?

Example ImageThe images in question were 324 pixels wide. The space I had to work with was 970 pixels. 3 x 324 = 972. My luck, sometimes.

I reduced the size of three images to 322 wide and began some quick experiments to replace the existing header image (the street scene you see in the screenshot above) with the three images. I could get them to fit and they didn’t look bad. But I couldn’t get the spacing between them just righ. And I didn’t like the way they fit right up against each other.

A Short Film History Lesson

Then I came up with the film sprocket idea.

For those of you who began using a camera in the digital age and aren’t familiar with 35mm film, let me explain. Before everyone started using digital cameras, serious photographers used 35mm film. The film comes on rolls and has tiny holes along each side. A camera has gears that line up with the holes. You feed the film into the camera and it grabs the holes with its gears. A mechanical lever pulls the next blank piece of film from the film canister to the place in front of the shutter for the next photo. When the roll was finished, the photographer (or his camera) would roll the film back into the canister and the photographer would drop it off for processing. When he picked it up, he’d get prints and negatives. The negatives are the actual film, with inverse (or negative) images on them.

If a photographer had his own darkroom, he’d likely make a contact sheet. This was created by putting the negatives right against a sheet of photographic paper in the dark, then exposing the paper to light for a short time and developing it. The resulting images were tiny (at least they were from 35mm film) and clearly displayed rows of black boxes on either side of the image with black lines between them — like you see here in the header of my redesigned site.

So anyone who has worked with film should recognize these little holes. Of course, my images are considerably larger and wider, so they’re not exact representations of contact strip images. They’re just borrowing the idea.

When I modified the three images to include the borders and fake sprocket holes, I liked what I saw. I created a Photoshop action to modify the 89 remaining images so they were smaller and included the tiny black boxes and borders.

Randomizing

On my old site, the random header image was randomized with a WordPress plugin named Random Header. But since I had three images to show in my header, I needed a different solution. So I turned to the software I used on Flying M Air’s Web site to randomize some of the images there: Random File.

Random File enables you to display random files anywhere on a template. (If you use a plugin like Exec-PHP, you can even display them within posts.) What’s neat about it is that you can tell it how many random files — well, in my case, images — to display and it will display that quantity without repeating them.

After some fiddling around with the CSS used in header.php — remember, I’m no expert — I added the following code in place of the existing header image code:

 $files = array();
for ($i=1;$i<=3;$i++) {
$file = c2c_random_file('/wp-content/<em>foldername</em>/<em>foldername</em>/', 'jpg png gif', 'url', $files);
echo '<img src="http://www.mariasguides.com/wp-admin/%27%20.%20$file%20.%20%27" alt="Random image #' . $i . '" />';
$files[] = $file;
}
?&gt;

The result is what you see here.

The Hard Part Was Done

With the tough design decision done, I was ready to put the new theme into place. I did that on Saturday, taking most of the day to get it 90% functional. I’m pleased with the results.

Comments? Questions? Use the Comments link or form below.

→ No Comments • Read 209 Times
Add to Del.icio.usAdd to Del.icio.us • Technorati ThisTechnorati This • Digg ThisDigg This • Stumble ItStumble it! • Twit ThisTwit This


WordPress 2.3 Beta I Now Available

Posted on August 28th, 2007 at 4:44 am · No Comments
Filed in: RSS WordPress Books   

A rough cut, for serious beta testers.

WordPress 2.3 Beta I is now available for testing. From the announcement post:

Some of the features of 2.3 include plugin and core update notification, built-in tags support, faster javascript, and SEO-friendly URL redirection….However all of the new functionality is still very rough, so only test the beta if you are comfortable troubleshooting PHP issues, filing tickets, and backing up your data religiously.

While cutting edge is nice, bleeding edge is not for me. I’ll wait until the final release. But if you’re the kind of person who likes to work with software still under development, go at it!

→ No Comments • Read 146 Times
Add to Del.icio.usAdd to Del.icio.us • Technorati ThisTechnorati This • Digg ThisDigg This • Stumble ItStumble it! • Twit ThisTwit This


Web Tools: Color Wizard

Posted on August 27th, 2007 at 5:36 am · No Comments
Filed in: RSS WordPress Books   

An online tool helps a non-designer pick a color scheme for a new blog.

I am not color blind. I know I’m not. I see colors and I know when certain colors look good together. But I can’t, for the life of me, come up with a color scheme on my own.

Color, of course, is a major part of any Web site’s look and feel. So when I found a blog post months ago that listed a few online color tools, I bookmarked them for later use. On Saturday, one of them came in very handy as I decided on a color scheme for my blog’s new look.

The Color WizardThe Color Wizard is a Flash application by Donald Johansson. This excellent online tool helps you find colors that work well together.

From the Color Wizard page:

The color wizard lets you submit your own base color, and it automatically returns matching colors for the one you selected.

It returns a set of hue, saturation and tint/shade variations of your color, as well as suggests color schemets to you, based on your color’s complementary color, split complementary colors, analogous colors and other variations. The color wizard also has a randomize function that lets you generate color schemes you might not have thought of on your own.

It’s the randomizer that helped me. I just kept clicking the Randomize button until I found a few schemes I liked. When I had about eight of them, I went back and reviewed each one, eliminating the ones I liked less until I had one I liked a lot. I then picked the blue color from the theme and generated another scheme from that, so I could get the colors I planned to use for my links.

What was also handy for me was the print feature. Although it’s not obvious on the application, if you right-click the Flash app, a Print option appears in the shortcut menu. I used that to print my two color schemes on my color printer. So not only can I visualize what the colors look like — or at least approximately what they look like; I don’t have a great color printer — but I have a document that clearly lists all the hex codes for all the colors.

I’m so pleased with the results that I clicked the Donate link at the bottom of the Color Wizard and used my PayPal account to send the developer some lunch money. (As usual, I urge everyone who uses great free software like this to thank the developer with a donation or at least a visit to his advertiser’s sites.)

Looking for a color scheme? The Color Wizard is a great place to start.

→ No Comments • Read 299 Times
Add to Del.icio.usAdd to Del.icio.us • Technorati ThisTechnorati This • Digg ThisDigg This • Stumble ItStumble it! • Twit ThisTwit This