Websites exist for sharing information.

Whether it’s news of your latest big product release, general info about your company or industry, or a story about your day in the park with your dog, chances are you’re putting it out there for people to read. Since the days of Lycos, AltaVista, Yahoo, and, of course, Google, search engines have been a big part of that goal.

Building your site to entice search engines to index and favorably place your pages has gone from the brute-force spider-baiting methods of the late 90′s, to the… well, brute-force spider-baiting methods of the 2000′s.

SEO has become an acronym, but many SEO companies still seem focused on keyword bombing, link farming, and site “build-out.” This approach does kind of work, so these guys can get away with it up to a point and sell their clients on their “success,” but it usually means leaving two things behind: 1) your customers, and 2) sane, usable content.

There is a better way. It is possible to build search engine friendly sites without making your site look like a dictionary or random pile of keywords. With a little bit of time and effort, a good understanding of your site’s real goals (“getting a top search ranking” is not a real goal), and some thoughtful copywriting, you can serve your customers a readable, usable site and still rank well in your target searches.

As I see it, there are two basic principles of SEO:

1. Understand how the spiders see your site’s pages,
2. and create compelling, accessible, usable content, and organize it so spiders can see it.

I’ll talk about these a bit more in-depth, but not necessarily in great detail–this post is merely intended to offer an overview, and perhaps a better general approach to SEO, not blow-by-blow implementation guidelines. With that disclaimer in place, let’s continue…

Understand how the spiders see your site’s pages

It’s a bit of a technical question, and it does vary from search engine to search engine, but it is crucial to understand what a spider sees when it visits your pages.

First, look at your site’s code. Go to a page, right-click, and select “View Source,” “View Page Source,” or your browser’s equivalent function. The window that pops up is the soup that a spider has to strain to get to the meat of your site.

Most spiders are smart enough to ignore irrelevant content (pretty much everything above <body… except some of the ones that start with <meta…). The spider is looking for links, both deeper into your site (so it can index more of your pages), and also to other sites (so it can discover your site’s relevance). It is also looking for copy—textual content. It gets some of this from the content visible to your users, some from things like alt and title attributes, and some from linked or embedded filenames.

The spiders grab all* that juicy content, wrap it up in a little sack, and send it home to digest.

The search engine will then take your stripped down content and process it through their algorithms. The key things they’re looking for are:

• relevance, which is a measure of not just what keywords you use, but how they relate to each other,
• and how your site relates to itself and to other sites covering the same subjects.

So yes, you can get away with a bit of keyword bombing and link farming, but search engines have gotten pretty good at spotting it, meaning that you have to also have good, relevant content to help your keywords not look like obvious spam or spider-bait.

Which leads us into our second principle…

Create compelling, accessible, usable content, and organize it so spiders can see it.

The number one problem with keyword bombing is that it’s very hard to integrate into consumer friendly, readable, and usable content. You’ll likely end up with paragraphs of content where every third word is a keyword, and, no matter how good your copywriters are, your visitor is going to feel like she’s reading gibberish.

As I mentioned above, creating good content is primarily dependent on understanding your site’s goals and your audience’s needs. The content should support those things. First develop a good site strategy—aligned with your client’s branding, tapped into industry trends, and mindful of SEO—then set your star copywriter loose to pull it together into a cohesive and compelling package.

“SEO is simply a positive side effect of good content strategy.” **

Sure, you want to cover the basics by ensuring your keywords are in title, meta, and header tags, and sprinkled throughout the rest of your content, but it’s much more important that you have an easily navigable site structure and clear, readable, interrelated content. Not only does it create a better user experience for the average visitor with a constantly decreasing attention span, but it’s also more enticing to the spider and more understandable to the search engine’s indexing algorithms.

More important still, you want your visitors to recommend your site to others, especially in contexts that are relevant to your site’s goals. Visitors are only going to do that if they can quickly make sense of your content, and if it answers a question, solves a problem, or simply provides information that piques their interest.

The emperor is dead, long live the king.

Obviously, there’s much more to creating compelling user and search-engine friendly sites than what I’ve covered here, and this only scratches the surface of arguments against “traditional” SEO practices. In my experience and opinion, however, these two are the most basic principles upon which one should base all SEO.

In summation: Compelling content is king, while content caked with keywords is merely an emperor with no clothes.

is a cute little story about a stuffed, toy rabbit who longs to be “real.” Initially of little interest to his owner, or to the other toys with whom he is thrown together, eventually the rabbit becomes the much-loved favorite of the boy. After the boy contracts an illness which requires the purging of those belongings he keeps closest to him, the rabbit is thrown out of the house, to be incinerated. Filled with love for the boy, and sadness at their separation, the rabbit’s single tear summons the “toy fairy,” who completes his transformation and deposits him in the forest among the other real rabbits.

The 2005 CD may’ve been shorter, but that was ok ’cause it had this story on it. Also, I managed to sneak Spidey into the CD jacket, which was fun.

In this post, I’m going to look at a singular expression of this problem, but it should be remembered that this is just one possible example. The possibility of font resizing should be considered when designing any and every piece of a website.

The Concept

For our example, we’ll consider a simple content box, self-contained and isolated from the rest of the webpage—a bordered box with some text and a nice varied-gradient background, like so:

The Problem

In a situation like this, when constructed in HTML, the size of the container must increase as the font-size increases (unless you’re OK with locking it down and having the text spill over or disappear behind the box borders). Sounds fine, right? The problem is that, as the container changes shape or size, so must the background.

The background can be set to start in the top, center, bottom, left, or right; may repeat vertically, horizontally, or both, or may remain fixed to the start position. With a background not designed to tile, the tiling becomes obvious. With a non-repeating background, the background color of the page or element will be exposed. In either event, without sufficient forethought the result will likely be quite ugly.

Some Examples

The first box is our “normal” example, included again for comparison. As you can see in the second box, we run out of gradient, and in the third box, the tiling is very obvious. Neither situation is desirable.

Possible “solutions”

There are, of course, various ways of dealing with these issues, either during HTML production, or within the design itself.

One Big Image

Kind of an old school solution, the content area can always be created as a single image including the borders, background, text, etc. This is, of course, terrible for searchability, and terrible for vision impaired users unless some other concessions are made in the HTML.

Text as Image

Equally old school, with the same issues as the “One Big Image” solution, this also comes with its own unique issues. Effectively, we’re talking about saving the gradient to it’s own file, and saving the text as a separate image file. Really the only benefit to this solution is that the gradient background could then be re-used for multiple (of the same sized) content boxes, with the text image laid over them.

Do It in Flash

With the widespread acceptance of Flash—and javascript packages like swfObject that make it easier to build in alternate (non-flash) content—building complex content boxes in Flash is no longer an unreasonable proposition. Using flash also opens up many other possibilities (like subtle visual effects, or more complex interactions) with hardly any more overhead than a large background image. The potential problems with Flash are, once again, searchability and usability for the vision-impaired. Still, these issues should be addressed by judicious and appropriate use of alternate content.

Improve the Gradient

The final solution would be to simply improve the gradient such that it reasonably accommodates the foreseeable problems with the particular content box.

Enlarge the Gradient
First option is simply to enlarge the gradient—take whatever it is you have done, and extend it beyond the borders of the content box so that as more of the gradient is exposed, it doesn’t look like crap. Big thing here is that the extended gradient should still work well with whatever content is over it—so don’t graduate to dark colors if the copy in your box is also dark. This solution probably gives the designer more control over the gradient as a whole, but also means that if the box expands beyond an expected point, you’ll just have the same issues all over again. So, you have to put some thought into how and where the expansion will occur, and how much of it to reasonably expect.

Fade it to a solid background color
If you you can modify it so that it graduates to a solid color on one or more sides, your gradient might be able to be locked into an appropriate corner of the box, with that solid color applied to the background. Then the gradient image will just fade right into the background color and the box can expand however much it needs to.

Make it Tile-friendly
If you can modify the gradient such that it tiles well and doesn’t interfere with the content, go for it. Tiled backgrounds save on bandwidth, download times, and storage space on the server. Tiled background do NOT, however, save memory usage on the client machine (at least the last I heard…). Tiled backgrounds also allow for “unlimited” expansion.

Recommendation: Improve the Gradient

Of the main “possible” solutions, really the most recommended is improving the gradient (or preferably designing it with these things in mind in the first place). Flash is a good option for very complex content areas, but is overkill for the simpler elements. Improving the gradient gives you more control, while keeping the HTML flexible, usable, accessible, and SEO-friendly.

An Example

Conclusion

Obviously, I’m no designer, and the examples I’ve shown here are super-simplified for our purposes. In the real world, there are usually even more complex considerations, but those dealt with here are fairly fundamental. If you’re going to be designing these nice little content boxes with pretty, complex backgrounds and big, bold fonts, you have to remember what happens to that fantastic design when it gets in the hands of the HTML guys and finally in the browsers of the end users—neither group is kind.

If you have questions or other possible solutions to this type of background image problem, or if you have other examples of how well thought-out design is a prerequisite for building good HTML, please share by leaving a comment.

This classic story includes references which modern kids will likely never be exposed to elsewhere—like actual shutters, kerchief and caps as sleepwear, and sugarplums. Of course, this story also is one of the primary introductions for children to Santa’s peculiar attributes, and also has an easy to memorize roster of Santa’s pre-Rudolph reindeer.

There are many stories and songs about Santa and his reindeer, but this is one of the absolute fundamental texts of Santology.

Yesterday was my and my wife’s anniversary. Since she’s on a crappy rotation now, and working the 6p – 4a shift, I took a half day so I could hang out with her for a few hours. We had a great afternoon, not doing anything really special apart from being together.

We went out and had a nice lunch where we had our first date, went to the mall to see if we could reserve our new iPhones, went to the other mall to try our first Orange Julius (just “ok”) and to browse at the furniture store. Wonderfully ordinary “couple” stuff.

The funny thing is, I can’t imagine a better way to celebrate our anniversary. We’re not fancy-big-production type people, so a low key, mundane adventure is just about perfect for us. Just being together is enough.

And I think that’s a perfect testament to our marriage as well. Everyone’s relationships are different, but for us, we’re the most content and most happy when we’re together. Even after four years. Or, I should say, especially after four years.

The most awesome thing is, that as much as I loved my wife the day I married her, I love her a little bit more every day.

Suffering

My understanding is that the suffering with which buddhism is concerned is generally of the mental variety rather than the physical. Certainly physical pain isn’t merely some illusion of the mind (though the point is probably open for argument), but results from some specific internal or external cause. Whether you’ve stubbed your toe, broken your collarbone, or have some painfully debilitating condition, physical suffering can be difficult or nearly impossible to escape from or ignore.

Mental suffering, on the other hand, may not be nearly as easy to pin down, coming as it may from within or without, from truth or fantasy, or from a myriad of other sources, real or imagined. Maybe a friend is sick, or your favorite show got cancelled, or you screwed up at work, or you’re struggling over a major decision… many things can be a source of mental suffering, even without you really being aware of them.

Buddhism’s argument, however, is that we are ultimately the cause of our own suffering. We view reality in the present moment through the filters of the past and the imagined future. My mother has always been there, and therefore she must always be there. I am here, therefore I am here. We think of our reality as endless, or rather, we don’t think of our reality as temporary. Of course, consciously we may acknowledge the inevitability of change, death, or loss, but we don’t believe in it subconsciously.

This, in a way, is attachment.

Attachment

If we contemplate, or directly experience something’s mutability or impermanence, it causes suffering—not because impermanence is unnatural, bad, or avoidable, but because it doesn’t fit our view of that thing. The thing itself is not responsible for our suffering, nor is—in a strict sense—the instrument of change or impermanence (be it old age, a car accident traffic collision*, or a change of heart). Rather, it is our attachment to the thing—our belief in its permanence—that causes our suffering.

So, if our goal is to address and hopefully eliminate our suffering, the first thing we have to do is to understand the nature of the attachments that are causing it. It’s perhaps just as easy—and at the same time, not even close to as easy—as that sounds, to identify and address our attachments. This is where meditation, or at least a sustained practice of self-reflection comes into play.

Recognition

Meditation will allow you to sit with your suffering and study it—how you’re feeling, what you’re thinking about it, and what’s causing it. As you dig deeper into the nature of your attachment, you’ll also be teaching yourself how to recognize it, and how to deal with it. And that’s the first step to ending suffering—learning to recognize, acknowledge, and deal with your attachments more appropriately.

The first track I’d like to feature from this CD is the short—but very cute—, by Sam McBratney and Anita Jeram.

This story documents a peculiar exchange between a narcissistic elder bunny and an insecure but effusive younger bunny who share a vague and unhealthily competitive relationship, and who apparently belong to a cult which has stripped them of their names and only allows them to be referenced by the color of their fur.

As the story progresses, the junior bunny attempts to elucidate the magnitude of his devotion to the elder bunny, but with each new platitude, the elder bunny is compelled to explain that his devotion to the younger bunny is actually the greater. He accomplishes this through various means, including physical feats of strength and simple size-related intimidation techniques. In the end, the elder bunny—not content to allow the youngster even the smallest victory—must get in the last word, even as his companion loses consciousness. One imagines the elder bunny smiling to himself with smug satisfaction, before dropping off to a fitful, horror-filled sleep.

Too much?

[UPDATE: 1 hour after this post launched, I realized I'd neglected to include the audio. Whoops.]

One of my freelance clients publishes a newsletter every month, and I convert the PDF into JPG images to use on the site as a sort of low-fi online version. I discovered pretty quickly that Gimp’s conversion routines did a terrible job. Eventually, I found a solution using ImageMagick, which I had used previously in my bipolar gallery scripts.

Converting images is super easy with ImageMagick’s convert command, and as it turns out, convert can also handle PDF files.

Here’s the commandline I use:

convert -density 300 -size 4100 sourcefile.pdf -quality 100 outputfiles.jpg

Basically, this converts each page of the pdf into a 300ppi JPG with a maximum dimension of 4100 pixels and a JPG quality setting of 100% (or no compression). Each page is saved as an individual JPG named outputfilesXX.jpg (where XX represents the page number, starting at 00).

This gives me much higher-quality starting images than Gimp provided, which I can then resize as needed.

convert has a huge array of features beyond this simple example, and is worth a look if you need to do image manipulation from a script, or batch operations on images from the commandline.

Anyway, I wanted to take a moment, now that we’re a month old, to look back on the past month and see what we made of it.

Most Visited Posts

These pages had the most “views” over the course of the month.

1. Why I Can’t Be Buddhist
2. How I Remember the Milk (or don’t)
3. Photoshop Guides and Pixel-Precise Alignment
4. Storytime: Where the Wild Things Are
5. A Quick Thought About Mindfulness

Obviously, we’re just looking at the individual posts—the homepage got more views than any of them. I’ve started launching new posts without a “read more” link (i.e. without splitting it up) on the home page, then adding it in a day or so afterwards. This might mean that people only stick around long enough to read the latest post on the homepage, and never actually visit the individual post’s page, which may skew the numbers. My specialty isn’t analytics, so I don’t intend to get too crazy with it.

Most Feedback/Response

These posts were either commented upon directly, or garnered some variety of response through Twitter, Facebook, or email.

1. Welcome to the new Coffeemonk.com
2. Storytime: Where the Wild Things Are
3. Keyboard Shortcuts
4. Why I Can’t Be Buddhist
5. Photoshop Guides and Pixel-Precise Alignment

Most Relevant Search Keywords

There were other search terms, (coffee, monk, rasnake, etc) but these five seemed most relevant to the actual content I’ve posted.

1. why be buddhist
2. mulitple commands using alias on linux
3. my gtd implementation
4. remember the milk conventions
5. rememberthemilk gtd

Most Frequent Referrals

The sites that sent me the most traffic—aside from Twitter, Facebook, and www.matthewrasnake.com, of course.

1. mark.biek.org
2. volvita.wordpress.com
3. www.thecomicaddiction.com

Thanks, guys!

Most Popular External Links

The most clicked links leading to other sites of interest, either from a post or my blogroll.

1. http://www.rememberthemilk.com/
2. http://www.arteye.com/
3. Getting Things Done
4. Advanced GTD with Remember the Milk
5. Supercharge RTM: 6 Ways to Add a Task

Visitors

Apparently, you’re a fairly savvy bunch. My stats tell me that nearly 13% are running Linux, with less than 46% on Windows. Also, nearly 74% of you incredibly awesome people are using Firefox, 15% are on Safari, and less than 9% are using Internet Explorer. These numbers are phenomenal, and I could kiss you all. (I won’t, but y’know.)

Lastly…

Thanks for being with me this past month, it’s been a great deal of fun. I hope you’ll stick around this month and on into the future as well, and, as I keep saying… don’t be shy with the comments!

The reader is drawn along on the patient’s perambulatory adventure, and is given the opportunity to observe and occasionally participate in a re-enactment of his mad mimicry. Graciously, Mr. Brown’s repertoire of sounds is somewhat limited, and does not venture into the mechanical or electronic, so the book remains relatively short. The book closes with a review section, which one imagines might be an abstract representation of the troubled man’s unconscious mind.

Seriously though, Mr. Brown Can Moo is a great little book that smaller children simply love. It is especially fun when, once they’ve been through the book about 20 times (a day, for six straight months) and know pretty much what to expect, the reader begins to mix up the animals and their sounds. Toddlers love making animal noises, and they squeal with delight (or homicidal rage) when one presents the obviously ludicrous idea that a dog might say “quack.”

This is the last track off the original 2004 Christmas CD. Next week, 2005!