So how do you achieve harmony with the design team? The answer is by optimizing navigation using CSS Image Replacement.

Place the navigation in div layer. Use a traditional text link with href in the code. It will be rendered on the end users browser as an image by the CSS style applied that makes it look and feel like an image. The result is that the search engine spider sees text, and the user sees pretty images. Navigation optimization improves the visibility of linked tiers, and provides the search engines with a clear transparency of a site’s topical hierarchy.

A good example of this can be seen in the image below. It’s an image of the navigation from The Ultimate Fighter website:

CSS image replacement uses a combination of style sheets and ordinary HTML to display a visible image, usually consisting of rendered text, while preserving the underlying text-based, structural HTML markup for search spiders.

In a previous post, I showed how to create a textual navigation that renders as an image. For you Rock N Roll fans, I used Shinedown’s website as an example. I posted an image to show exactly what the source code looks like.

Bottomline, you can keep the design guys happy, while leveraging keywords as anchor text in your image-based navigation to achieve a crawlable SEO friendly navigation.

Related posts:

1. Boost Keyword Relevancy Using CSS Absolute Positioning

See “no text” example below:

Adding more text will help the search engines determine what your page is about, and offers a great opportunity to use textlinks to build internal linking within your website.

Optimially, it’s best to place the text under the H1, but above the product images. Consider redesigning your page template with content placed just below the H1 page header. Content should optimally be placed closer to the top of the document.

Although, the classic objection to this is that the text placed in that position on the page will interfere with usability, page views (engagement), and ultimately conversions.

To the rescue comes a CSS technique called, Absolute Positioning.

Consider using CSS absolute positioning to effectively move content blocks across Category & Sub-category templates. Content will appear closer to the top of the code structure, yet would appear at the bottom of the page when rendered within a browser.

The addition of more text is a way to optimize your website, increase your keyword relevancy scores, boost internal linking, and create a more engaging user experience.

Below is a powerpoint slide I created on Absolute positioning , and how it can be the solution to page layout problems.

Related posts:

1. Optimizing Navigation using CSS Image Replacement

Using SWFObject is a great method how to optimize flash files. SWFObject is an easy-to-use and standards-friendly method to embed Flash content, which utilizes one small JavaScript file.

SWFObject is flash detection code written in JavaScript (JS) that detects if a browser has a flash plug-in installed.

• If the plug-in is detected, the flash piece is displayed.
• If the plug-in is not detected, alternative content contained within a div tag is displayed.
• If there is no alternate content in a div, nothing is displayed!

Below is a good example from Sony Music:

And here, the alternative content contained within the div tag displayed:

The key here is that search engines will read text, links, and even alt attributes within the div tag.

Therefore, implementing swfobject to optimize Flash for SEO is highly beneficial, to users who don’t have flash installed on their browser, and to the search engine spiders.

Keep in mind that SWFObject should only be used to leverage the flash content; do not use it to stuff keywords, images, or links that are not represented in the file.

Related posts:

1. How To Optimize Using Internal Linking
2. Splash Pages: Bad for Usability, Bad for SEO

Most attribute its growth to jQuery’s success in achieving its overall goals. Born from a desire to simplify programming and especially web development, jQuery has won champions and adherents by delivering on its promise to streamline HTML document traversing, event handling, animations and AJAX interactions while remaining lightweight and compliant with industry standards, such as CSS3. In addition to the above characteristics, jQuery also enables the creation of Plug-ins: facilities that allow developers to create concepts for low-level interface and simulation, high-level theme-able widgets, and advanced effects. This deepens and heightens the dynamism and power of web sites.

But as with so many things, there’s a down side. For all of the flashy tricks and easy effects jQuery helps you incorporate into your designs, it can also render your creation virtually invisible. Because it automates and streamlines much of the coding and content handling that goes into making a web page viewable, jQuery holds much of the data that search engines use in retrieving pages out of the view of spiders. Spiders are little agents that the search engines use to locate and point to the content markers they need to return meaningful responses to users. When spiders can’t find those content markers in your web page, then your creation won’t be included in the data returned in that search. This makes your web site very hard to find.

Consequently, programmers need to know techniques and tricks to keep important markers in view of the spiders and search engines while still availing themselves of the advantages of automating coding with jQuery. There are a wide variety of ways to alter your coding to accommodate the needs of SEO, and several will be presented below; but these are far from definitive or exhaustive. Web development, and programming in general, consists of so many variables that there will always be multiple answers to any programming question.

Remember that the overall point is to bring content important to SEO to the forefront, by unlocking it from inside the JavaScript, or jQuery. One way to accomplish this is by embedding multiple hard links and anchor tags with the href. But for this technique to work you have to place the links in the HTML source, not called by jQuery. In the example, there is a link to the author (John Raasch, a freelance web designer who blogs on web development topics) who describes some of the tradeoffs in play with AJAX and jQuery, as he works to maintain usability and SEO in his web site development portfolio. Briefly, he recommends using jQuery and multiplying the anchor tags. Then, to accelerate page loads, he uses hidden divs; a technique that works, but jeopardizes his page metrics reporting.

Tim Nash, a writer and consultant in various areas of web development, wrote a post on the use of jQuery and tricks for keeping content indexable for the search engines. In his post, he presents several jQuery plug-ins that can aid in making jQuery SEO friendly . Nash starts by describing methods of web development and comparing them. In general, he espouses what he calls progressive enhancement, in which the programmer builds the pages to the lowest common denominator and then adds enhancements. This will keep all of the relevant data accessible to search engines and therefore make the page easier to find on the web. The alternative, that he suggests is likely to result in burying your design, he calls graceful degradation.

Multiple posts point to additional means of preventing content in jQuery calls from remaining invisible to SEO spiders. Here’s another one from David Pirek, a designer/programmer in the New York metro area. His blog presents an overall approach to using jQuery, which he refers to as his favorite web development environment, and maintaining SEO techniques. He advises embedding the page you need to request in href. The spider will see the link as another page and index it, which makes it visible to search engines. He goes on to describe an enhancement to the technique: have your jQuery click and attach another parameter to the query string. This lets the page know when the call is coming with JavaScript enabled and when it’s not, which in turn allows the designer to add page properties (title, Meta tags, styles and even further HTML if you prefer).

Here are a few other useful resources from around the web. First from Noupe - a site founded by Noura Yehia, and now belonging to Smashing Media - are 50 examples of designs aided by jQuery. Noupe’s mission involved bringing its readers information on new communication methods and technologies from around the web. To that end, they wanted to make their readers aware of the high quality work currently rendered by jQuery. Second: from the same source is a sampling of 45 jQuery plug-ins . Finally, here’s a roundup of tutorials on jQuery.

There are many techniques, resources and opinions regarding jQuery, but the general point remains the same: make your jQuery content crawlable and search engine friendly.

Photo credit: chrisglass

Related posts:

1. Optimizing Navigation using CSS Image Replacement

These days, social media is more important than ever for getting inbound links. With several companies focusing on real-time search results (Google, Twitter, OneRiot), you can’t ignore the social aspect of SEO any longer. Here are 12 ways you can get more inbound links using social media:

Network with Blogs in Your Niche

Blogs are still the bread and butter of the social sphere. Search for blogs about your topic on Technorati and Alltop and provide valuable content those groups can link to. But don’t expect people to find you - make it happen!

• Submit your best articles to blog carnivals - Blog carnivals are lists of related links that a blogger (the blog carnival host) posts to his or her blog. Go to http://blogcarnival.com to browse subject listings.
• Start your own link round-up - Saturday is a good day to post the best links of the week along with short summaries. Not only do you look resourceful, but you are helping your busy audience.
• Provide incentive for backlinks - In your round-up, you can include a section about people who have mentioned you or your blog. If you don’t do a round-up, start a press page and put every legitimate blog on there, big or small.
• Comment on other blogs - Most comment systems use a ìrel=nofollowî tag which tells search engines not to count the link in determining page rank; however, a link is a link, and the more you have, the more traffic you can build for your site. Tip: Instead of linking to your main domain name, link to an article on your site that is about the same subject you are commenting on.

Use Social Networking and Bookmarking Sites

Many bloggers share links to their favorite articles on a blog, miniblog or social network. Social proof via social networks is now getting heavily factored into search engine algorithms. When you are a part of these communities, you also have a better chance of finding new readers and weak ties.

• Build up your channels of distribution - Get a Facebook fan page, a Twitter profile, and make friends with people in your Google Reader. Who cares if you only have 10 fans on Facebook? That’s 10 more people who are interested in hearing what you have to say, who could share the information with others or link back.
• Add buttons for the three big social networks - Facebook, Twitter, and Google Buzz. All three of them have buttons that allow people to share, tweet, and buzz your post almost instantly to their entire networks. Put these buttons near the top of your post for social proof and easy access.
• Focus on the three big social bookmarking sites - Digg, StumbleUpon, and Delicious. Look at content from your topic area that has gone popular on these sites, and try to emulate the style and the formatting. Fake it until you make it never worked better here!
• Expand your network as much as you can - Weak ties will rule in the future of search. Google now displays results from it’s Social Circle on the first page (at the bottom). You can’t afford to be a loner on the web anymore!
• Create a group of like-minded bloggers to bookmark each other’s content - You can find bloggers in your niche who are interested and manage this with a Google Group where everyone can send out weekly requests.

Use Different Forms of Content for Social Pollination

• PDF your blog posts - Share the PDF on sites like SlideShare, Scribd, DocStoc, and Issuu and include a link back to the original blog post. You never know who might see them and choose to link back to your site.
• Turn your blog points into a video or a podcast - You can record a video in one shot with a webcam, and you can record and edit podcasts for free with Audacity. You already wrote the script, now create more content with it! Push it out onto sites like YouTube and services like iTunes with a link back to the original blog post.
• Publish your content on the iPad, the iPhone, and the Amazon Kindle - It’s completely free. The instructions are here, here, and here, respectively.

While SEO is important, don’t drive yourself nuts. Write for people, not search engines, and you will do much better in SEO. Focus on offering high quality, relevant content that is heavily targeted for the people who are reading it and give your visitors substantial information about your products and services in each and every article on your website. You’ll do just fine.

Monica O’Brien is the author of Social Pollination: Escape the Hype of Social Media and Join the Companies Winning At It. She also serves as the Director of Digital at Fizz, a word of mouth marketing agency. You can also read Monica’s blog, Social Pollination and follow her on Twitter@MonicaOBrien.

No related posts.

I did a quick analysis o heir site. The site was certainly “optimized”. In the sense that it is crawlable, and search engine friendly. Additionally, the site had a good amount of unique content on category & product pages. URL structures were clean & appeared static, the website navigation was okay, H1 tags were in place, Title tags were written properly. And, all the other on-page factors looked okay. The site was indexed in all the search engines. So, why isn’t it ranking? Hmm. Perplexing, right?

The answer is contained in an earlier post I wrote on the Importance of Internal Linking.

Using your keywords as textlinks within your website is very important. Choose a specific destination page for the textlink. That’s called your Target URL. And, embedd that textlink within page content. This is one way to strengthen a content silo. So, when Google (or any of the search engines) crawl your site, they understand that’s what this section is about (the textlink).

In short, building content silos, and increasing the internal link percent of target url’s is a powerful seo technique.

In the case above, the SEO Consultant was good at making a site search engine friendly, but just didn’t have the expertise to really provide a boost in the keyword rankings.

Linking is powerful. Both using internal links, and properly structuring an inbound link campaign.

Related posts:

1. Importance of Internal Linking
2. How to Optimize Flash Files

Creative companies are the worst offenders when it comes to demanding splash screens. If you’re doing SEO consulting for a site related to the entertainment industry, for example, you’re probably dealing with someone who places a lot of value on the “Wow!” factor. They think that just because you’re a fan of Adam Lambert, you’ll be more than happy to sit around for 30 seconds watching celestial bodies swooshing through the universe as the artist’s name is slowly revealed. They couldn’t be more wrong.

The main effect of a splash screen is to cause valuable visitors to leave your site. A bounce rate of 20% or more on splash screen pages is typical, which may cause you to say, “Well, heck, that’s a lot better than the 50% bounce rate on the home page!” But if your splash page is the default entrance to your site, it’s probably getting 3x to 5x more traffic than your home page. So maybe 100,000 people enter your site every month through the splash screen, while only 30,000 enter directly through the home page. If you’ve got a 20% bounce rate on your splash screen, that means you’re losing 20,000 visitors every month before they even see your home page! Wouldn’t you rather drive that traffic to the home page instead of losing it while your users stare at some stupid Flash animation?

You want users to get “inside” your site ASAP. Don’t leave them waiting for someone to “open the door”!

Here are some of the main reasons why you don’t want your user experience to start with a splash:

Hurts Search Rankings
Having a splash screen usually complicates your website’s structure. Search engines rank top-level URLs first, so having your home page under /us/wpcontent/home/ (or any other nested directory structure) can really hurt your rankings. Why waste your top-level URL on unimportant splash content?

Splash pages are not optimized for search engine indexing. The content of a splash screen is typically Flash or graphics heavy. This lack of text makes the page nearly invisible to text-based web crawlers… that is, all search engines.

No Keywords, No Links
Online search results are based on keywords. Splash pages typically contain no text except for the “skip intro” or “enter site” link. These keywords are obviously useless in terms of SEO.

Online search results are based on links. But the only link on your splash page goes to your home page. And what are the chances that anyone else will ever link back to your splash page? I’d say slim to none.

In terms of SEO, splash pages are a complete waste of your best online real estate.

Base-level URL Redirection is Bad
Splash pages often redirect to the home page. Search engines like Google and Yahoo! want to deliver people directly to the information they are seeking. When they see that your base-level URL is redirecting to another page (after the splash “performance” is done), your site’s ranking will be affected negatively.

You almost HAVE to redirect from a splash screen. There’s no good reason to redirect from your base-level URL (e.g. www.site.com/), but having a splash screen sit there pretty much forces your hand. Either you redirect the user to make sure he actually makes it to your content, or you risk losing him to splash frustration.

User Frustration
Even user-friendly splash pages include a “skip intro” link. This tells the user this page is less important than your other content, i.e. not worth viewing.

Most splash pages waste time. You’re asking the user to wait for content to download. Then they have to sit through an unwanted presentation. And you wonder why they’re leaving? Many sites even force users to see the splash page each time the site is loaded.

Reduced Credibilty
Your home page is the most important page on your site. Splash pages are a wasted opportunity to make a good first impression.

No matter how someone reaches your site, eventually they will visit the home page. Users want quick access to information. Splash pages are a speed bump, hindering access to your site’s content.

Poor Site Performance
Splash screens are graphically intensive and slow to download. Users with slower connections (mobile, dial-up, foreign countries, etc.) will get stuck with a “loading” message, and may never even make it to the home page. If your site is getting heavy traffic, the bandwidth used by the splash page will reduce your entire site’s performance.

Page load time is a now a major factor in search rankings. If your site loads slowly, your search ranking will suffer. Get your users to the home page as quickly as possible!

There’s a good quote floating around from Jared Spool of User Interface Engineering on how to convince your clients that splash pages are bad:

“When we have clients who are thinking about Flash splash pages, we tell them to go to their local supermarket and bring a mime with them. Have the mime stand in front of the supermarket, and, as each customer tries to enter, do a little show that lasts two minutes….

“Then stand back and count how many people watch the mime, how many people get past the mime as quickly as possible, and how many people punch the mime out.

“That should give them a good idea as to how well their splash page will be received. That’s the crux of it.”

Lightboxes: A Better Splash Option?
If you’ve explained everything above but your client still insists on having something “splashy” upfront, you may consider recommending a lightbox. At the very least, lightboxes have a better reputation among users than splash screens. And when your users click on the “CLOSE” or “X” button, you won’t be losing them into the ether… in fact, they’ll be looking right at the content you want them to see.

Lightboxes may not be as Flash-y (pun intended) as a splash page, but they give your site a chance to project some sort of welcoming message or offer without such a high risk of losing visitors.

They’re also much more friendly for SEO purposes. Lightboxes don’t dilute the strength of your site because your home page sits at the base-level URL, and the content inside a lightbox – images and/or text, rather than Flash – is typically more friendly to indexing by search engines.

Anybody out there have a positive or negative experience of using a lightbox as a splash screen to share? How about any other ideas on replacing splash screens when the client absolutely insists?

Related posts:

1. How to Optimize Flash Files
2. Making jQuery SEO Friendly
3. How Much Work Should You Giveaway in a SEO Proposal