The Glass is Too Big - Home

In the longstanding battle between my upper/rational brain and my lower/emotional brain, I'm trying to go about redesigning this site empirically instead of trying to guess what's going to work. This is due, in large part, to the understanding I gained in the last year about how poorly people in general and I in particular do at predicting their happiness. If I want a site design that's going to make me happy, I'm ill-equipped to make the guess and likely to fail based on intuition.

So, enter the attempts to figure some things out about this site and try to work out the requirements for a design from how I write and how I work. And, given that my happiness on this site is derived from being able to present the content I write without the site getting in the way or pissing me off, it'd be good to design it without painting myself into a corner.

The first place I started was something that bothered me deeply about my prototype designs so far: the headline font. See, I write some long titles. I do this for a few reasons:

1. I can't shut up.
   
   
2. Descriptive titles help you, the readers, figure out what you want to ignore and what you want to read. Maybe if I could (or was willing to) follow the old chestnut about making a site about only 1 topic and sticking to it, this wouldn't matter as much, but here we are.
   
   
3. Descriptive titles are Google gold. This means that people who don't yet read this site regularly find the articles and the information I want to share gets spread further.
   
   
4. They help people when the bookmark a page.
   
   

However, the long titles can cause problems with the heading fonts and widths in certain design layouts. In some of my prototypes, I've got headings that wrap 3 lines and one that went to 4. Yikes.

So, I wanted to quantifiably know the longest titles, the shortest titles and the average length. That way, I can mock up a page with 3 stories: one at each length and be sure that, for the headline font and width issue, the chosen design will work. The same thing can then be done for body length, etc. That way, instead of using dummy text and being irritated when my postings don't look as good in the chosen layout as the Lorum ipsum does, I can know beforehand how it will look.

So, as always, I hit the PHP and put it and MySQL to work getting the answers to these questions for me. The PHP has to sit on a server with access to your Wordpress database. I'm just putting it on the same server in a sandbox area I have for this sort of thing.

Fortunately, MySQL makes this fairly easy on us by providing a "CHAR_LENGTH" function that can be used on the column select and on the sort order. So, we can get a nice grid of the titles themselves and their length, sorted with the biggest at the top.

Here's the base SQL query. The whole script is available for download at the end.



SELECT post_title, CHAR_LENGTH(post_title)

FROM wp_posts

ORDER BY CHAR_LENGTH(post_title) DESC



Now, I think it'd be useful if each post's title was preceded by a color-coded indicator as to whether it was at, above or below the average length. This would let me easily grab one of each for sample pages.

That query looks like this:



SELECT AVG(

CHAR_LENGTH(post_title)

)

FROM wp_posts



So, we'll execute the average counter, get that number and then do the loop through all of the others and compare it to our average to get our indicator. Now, since the purpose of this script is to get sample headlines for doing a redesign, it would probably be useful to know how much variety in letter use is in each title as well. So, we modify our setup to do some processing of the result set before we print out the final results.

To do this, I just created 3 new arrays: one for each group. When looping through the resultset, I added each record to the appropriate array. Those arrays can then be sorted and you've then got one array for each class of length, sorted by the number of unique characters.

Obviously, this resulted in the top and bottom values not being obvious any more, so you could easily add them to the page as separate bits. Just grab the highest, one matching the rounded average and the lowest with LIMIT's set to 1 and you'll have your 3 samples that way.

The cleanest result would be to output for:

1. The "greater than average" group:
   
   
   
   
   
   • The longest title.
     
     
   • The most diverse title.
     
     
   
   
   
2. The "average" group:
   
   
   
   
   
   • The most diverse title.
     
     
   
   
   
3. The "less than average" group
   
   
   
   
   
   • The shortest title.
     
     
   
   
   

That'd give you 4 pretty good representative titles to use in your mockup. I didn't do a diverse "less than" entry because, with the shortest titles coming in at 4-5 characters, they're never going to have the diversity of the 20-25 character entries that are still "short".

At any rate, what all of this boils down to is a simple page with 4 headlines in it as <h1> tags. You set the width, the font and the size with CSS and it lets you test easily with any font on your system.

To try and test out other fonts (as I'm thinking of using sIFR on the new design), I'm using the text from this page as the sample text at a site like MyFonts. As a result of this script, at the moment, I'm looking pretty much exclusively at condensed fonts to accommodate my lengthy titles. Maybe something in a gothic. I do like the idea of a unique font for my headlines and I'm well on my way to choosing one rationally as well as aesthetically.

The code in the script a bit sloppy, but does the job. I commented enough that if you're familiar with PHP, it should make sense. Download Wordpress Title Sampler Code PDF.

© 2003- 2010 J Wynia. Very Few Rights Reserved.