I've also always been in favor of the use of CSS Image Replacement for headings, while not wanting to fake the search engines, I've kept a simple rule: if you OCR the page, it should be exactly the same as when you read the HTML.

I've said so on Dave's blog back in January '08, and then, Matt Cutts agreed with me. Well, Dave pinged me today, and blogged it too, because in a video today on Youtube, Matt said something else:

Click here to view the embedded video.

Now Matt, how would you go about doing something like my menu, here on Yoast.com, without doing CSS Image Replacement? You know that thing, Speed that your colleagues are going for? Well so am I. My navigation looks like this (when shrunk heavily:)

And the HTML for it looks like this:

<ul id="nav">
  <li id="a1"><a href="http://yoast.com/wordpress/">WordPress</a></li>
  <li id="a2"><a href="http://yoast.com/articles/">Articles</a></li>
  <li id="a3"><a href="http://yoast.com/tools/">Tools</a></li>
  <li id="a4"><a href="http://yoast.com/hire-me/">Hire Me</a></li>
  <li id="u1"><a href="http://yoast.com/advertise-here/">Advertise</a></li>
  <li id="u2"><a href="http://yoast.com/sitemap/">Sitemap</a></li>
  <li id="u3"><a href="http://yoast.com/contact/">Contact</a></li>
  <li id="u4"><a href="http://yoast.com/speaking/">Speaking</a></li>
</ul>

I think that's a pretty cool use of CSS, HTML and the possibilities it offers to mark up websites in clean, semantic code, with a great look, while going for speed. I mean, how would you do that with alt tags?

I hope you agree Matt, because otherwise you're contradicting yourself... Because, well, the Google result pages look like this:

And that even violates my own guidelines... It says "Google" in the text (notice the quotes?) and Google on the image (notice the lack of quotes?).^* And by the way, the Google Webmaster blog said something else as well.

Maybe you were trying to be friendly to people and not make it too hard on them, or you didn't feel like telling the complete story because that confuses people. But please, please, please, be aware that there are some SEO's out there who actually trust what you tell them, like I do, and who don't like to be disappointed twice in a month.

You took away PageRank sculpting as a valid technique, which was a technique you said had its merits, although it was only used by a few, now you're going to take away CSS image replacement? A technique used by just about ANY decent web designer out there? I think a bit of clarification is needed here.

Otherwise I just might have to go with what Mikkel said on this one as well... He said this, on a post of yours back in '06 about using text:

Matt, you know I allways use tons of text. Real text. All over my cloaked pages – and it works really well, thanks

^* Update: as noted by Thijs in the comments, the quotes are added by Safari's web inspector, they're not in the source.

CSS Image Replacement, what's up Matt? is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

• redesign to a more professional look
• move to a .com domain and US based hosting
• 301 redirect the entire old domain to that new domain

Now those of you who are unlucky enough to have me in your IM list have been spammed a lot by me the last few weeks, while I was doing all the redesign work, and deciding which domain I was going to use. In the end, I decided to go with yoast.com. This name was created when at SMX Stockholm last year, I tried to explain to Rand Fishkin and some other people how to pronounce my first name, Joost, properly. Rand spoke the great words "ow that's easy, just toast with a y", and then: yoast was born.

It took some time (and money) to acquire yoast.com, but I succeeded in that too, and then went on to pick a designer. I chose to work with Alen Grakalic of CSS Globe, who not only creates great designs, but can code them to my, very very high, XHTML and CSS standards too. We worked together for a couple of weeks, with me getting feedback from some of my very good friends like Ben Jesson of Conversion Rate Experts, Jennifer Slegg and Roy Huiskes.

In the new design, I wanted to do a couple of new things:

• Create a better homepage, which had to be more than a blog index page.
• Create a separate blog index page, while keeping the URL's for posts the same.
• Make a better distinction between utility pages, like contact, advertising etc., and the "really" important pages: SEO tools, WordPress plugins and Articles.
• Clean up the template for single post pages and pages.

And preserve a couple of others:

• Make the RSS button still stand out as much as it did in the old design.
• Keep the tag cloud.
• Make sure the comments stayed as important as they were in the previous design.

Alen did a great job, as you can see in the new design. Now the last thing I had to do was get a new logo and tagline. I'd always called this blog an SEO blog, and in some sense, it is. But a lot of what I write about has hardly anything to do with SEO. So I started discussing a new tagline with the above mentioned friends, and Daniel Scocco of Daily Blog Tips.

In the end, I decided to go with "Tweaking Websites", as that's what I do. For the logo, my buddy Brent Csutoras pointed me to a site called 99designs. This site allows you to launch a contest for a design. I set a $400 price, and got a massive load of designs submitted, check them out.

In the end, a German guy called Christian Hockenberger won. He came up with this design. I'd like to thank all of my friends for all of their help in this move! Now on to what is basically a very big experiment: a 301 redirect of an entire site to a new, US hosted domain.

Some stuff won't be finished today, some moving still needs to be done. But do look around and share your feelings about the redesign in the comments!

Meet Yoast! is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

I've recently switched back to Safari as my main browser because good ol' Firefox kept crashing on me, and I must say that it's been a smooth experience so far. Safari is a great browser, of course, and 3.1 is very fast as well. One of the things I like to see for every site though is where they use nofollow, so I had to find a way to do that in Safari.

The easiest way of doing that, in my opinion, is using a user stylesheet. You can specify it in your Safari preferences, under Advanced:

(BTW, you can use user style sheets on Firefox too.)

Then put the following in the stylesheet you selected:

a[rel~=nofollow] {
background-color: pink !important;
color: black !important;
font-weight: normal !important;
text-decoration: underline !important;
}

And after that, all nofollow links you encounter should look something like this.

If you want to make sure you see nofollowed image-links as well, add this:

a[rel~=nofollow] img {
border-bottom: 3px solid pink !important;
}

That will add a small pink bottom border to the image that is linked. Download the entire stylesheet here.

User stylesheets to show nofollows is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

Next to that links would be in a different color, depleting your color cartridges and not giving you any info whatsoever. When you've printed an article, you usually have to go back to the online version to be able to open the links. There's a solution for that, and it's actually quite easy: using CSS to add the URL after the link. That's really easy to do with the content declaration, like this:

#content a:after {
	content: " (" attr(href) ") ";
	font-size: 80%;
}

Next to that I used display:none; to hide the menu, sidebar and comments, so you get just the article, in black text, on a white background.

Of course, feel free to have a look at (and copy) my print css!

Added a print CSS style sheet is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!