After upgrading our AWP Blog to WordPress to 2.6 (we are eagerly awaiting the 2.7 visual transformation, by the way), we noticed in the shuffle our Permalinks got messed up. For example, searching for my post div align top center, which is #1 right now, Google gives us blog.awpny.com/archives/206 (not a permalink). Following that URL used to get us to our 404 Error page. Whoops! Not so great for SEO ratings, not to mention reader frustration!

WordPress doesn’t automatically redirect your old permalinks to the new permalinks, unfortunately. The permalink for the above post is http://blog.awpny.com/2008/03/position-a-div-element-absolute-and-align-it-top-center/. I did a little research. More than a few people have been frustrated with this problem, as you can imagine. I discovered this plugin Permalink Redirect WordPress Plugin. It works perfectly! Thank you Scott Yang’s Playground.

Simply download & install the plugin. Edit the plugin settings (under Settings>Permalink Redirect). For our blog, in the ‘Path pairs to redirect from and to’ box, I used:

[from] /archives/%post_id% [to] /%year%/%monthnum%/%postname%/

And now, Google search results take me to the post, rather than a 404 Error page!

A recent WordPress blog integration for Lisbe Partners lead me to consider some Search Engine Optimization decisions that WordPress makes in it templates and here I share modifications.

1. Headings!

WordPress Default template lists Post Titles as <h2> in order to reserve <h1> for your Blog Title. At AWP we like to use <h1> for unique page content titles, so the first main text you see on the page is <h1>. We generally have great SEO ratings, so we are going to stick with that strategy.

The template files, archive.php, links.php, page.php, single.php and search.php can be changed directly. To affect the heading tags for posts, you will need to insert some conditional code in index.php (or post.php, since this file can be used on the single post, the post category list views, and some times the home page). In the following example <h4>’s are used as the list view headings.

<<?php echo (is_single() || is_home()) ? "h1" : "h4"; ?> class="title">
    <a id="post-<?php the_ID(); ?>" href="<?php the_permalink(); ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>">
        <?php the_title(); ?>
    </a>
</<?php echo (is_single() || is_home()) ? "h1" : "h4"; ?>>

Insert this into the beginning of index.php. (Modified from geniosity musings)

2. Page Title

Another SEO measure we’ve implemented at AWP is ordering titles with specific content first in the browser title bar. For example, if we are several layers deep, the title goes “Page Title _ Sub-Section _ Section _ Website Name,” etc. For more of an explanation, see Web Designer Wall (go to #7).

For interior pages WordPress Default theme uses “Blog Title > Category > Post Name,” which is not Search Engine friendly. To improve this, I borrowed code from The Blueprint Theme which integrates the Google Blueprint framework into WordPress (which I also used in my blog template).

<title><?php wp_title(''); ?> <?php if ( !(is_404()) && (is_single()) or (is_page()) or (is_archive()) ) { ?> | <?php } ?> <?php bloginfo('name'); ?></title>

So, now we get “Post Name > Blog Title.” Happy SEO improving!

You probably didn’t know this, but this week is Ithaca’s Downtown Office Worker Appreciation Week. One of the many perks of working downtown! I just finished some tasty free pizza!

When I saw the list of activities planned for this week, I admit I got pretty excited when I found out one of them was a Hot Dog Eating Competition!! Now, anyone who plays Ithaca Ultimate Frisbee and Soccer with me, knows I am pretty competitive. Perhaps another lesser known fact is that I like to eat, and I always eat quickly. A perfect opportunity to combine both skills? Let’s put it this way, having never done this before, I couldn’t resist! (Insert a plethora of ‘gross’ & ‘yucks’ from friends who I told this to).

Knowing this competition was only going to be 2 minutes, I wasn’t going to go all out. Training for something like the famous Nathan’s Hot Dog Eating Competition takes months of stomach stretching and technique-building. Think about it, 59 hot dogs in 10 minutes! Yea…

But if you are competitive, you want to win, so I trained (for 2 days). My diet for these 2 days existed solely of the cheapest hot dogs you can find, with a complement of water-soaked hot dog buns, and my friend (thanks Jesse!) worked with me on my technique. It certainly paid off….

Yesterday it was time for the competition! Dowtown office workers gathered around to see this spectacle. 18 competitors. I was happy that I was able to tie my training record at 4 hot dogs! I was beat only by a guy from Collegetown Bagels, who got 5 down and my friend who managed to get down 6 1/2 hot dogs in that time. He was a good trainer!

I felt I had pretty good showing at 3rd place. Plus it was free publicity (not to mention a free lunch!) I am getting quite a few strange looks walking around the Commons and “aren’t you the girl that ate 4 hot dogs in 2 minutes?” Why yes, that is me. Could I be the top female competitive eater in Ithaca? Maybe!

If you want to see more, The Ithaca Journal did a front-page article about the heated competition and if you watch the video (credit News 10 Now) you will see AWP and me represented in a, err, less than flattering way. But, it sure was fun! Go AWP!

Today, in development, I noticed that a drop down menu I was building had inconsistent line-heights between Firefox 2 and the new Firefox 3. Using Verdana, font-size:10px, Firefox 3 rendered the height of the line as 14px tall, whereas Firefox 2 was only 12px. Because of the inconsistent height, I couldn’t line my drop-down menu up correctly in both browsers.

An excellent way to see this inconsistency in action is through Eric Meyer’s Javascript line-height test. Just open up this link in different browsers and the rendered line-height will be displayed for you.

Although we are used to making special considerations for Internet Explorer and Safari, problems between releases of similar browsers are much harder to solve for. It took me awhile to figure out what the problem actually was.

The solution, luckily, is quite simple. Set

body {line-height:1.5}

(or some other unitless value)

You will want to put this at the top of your reset.css stylesheet which you should be using for the greatest browser consistency possible. Here at AWP we like to use Blueprint CSS Framework which uses reset methods developed by Eric Meyer’s.

Now my drop-down menus line up correctly! Yes!

We take a lot of pride in the work that we do for clients. We spend a lot of time on beautiful design execution and standards based code especially for them. When we send our clients on their way of course we want to see them succeed!

We also feel a special connection to each of them. I certainly enjoyed seeing Garden Gate Delivery’s van, designed by Molly, parked the other day at the Ithaca Festival.

Today I got excited to see Ithaca Carshare on the front page of the Ithaca Journal today! Ithaca Carshare, after many years of hard work (largely from Jennifer Dotson), started operating yesterday. Participating in Ithaca Carshare’s convenient money-saving and carbon footprint-lessening transportation solution makes a lot of sense for so many people in Ithaca, especially those that live downtown but only need a car some of the time.

At AWP, we enjoyed developing materials for Ithaca Carshare, a company whose mission we believe in and is doing a great job in the Ithaca community. I am personally invested in the organization as well, as I first got involved with Ithaca Carshare when I was living with Dan Roth, one of the original organizers of the international car-sharing summit that took place at Ithaca College (January 2006). I later helped developed the first version of IthacaCarshare.org.

I am so happy to see this project come full circle and for all of the people who have worked so hard on making Ithaca Carshare succeed to see their dreams realized! Way to go!