14 Steps to SEO Web Design Success

seo services

There are seven major steps to successful SEO web design. And for the sake of time, we’re jumping right into ’em. Buckle up. Here we go!

1). Ensure Your Site Is Developed Using Responsive Design

This is by far priority number one. Responsive web design will make sure all visitors  (no matter what device they are using ipad or smart phone) can easily navigate your website and read your content. Since un-responsive design will scare off mobile website visitors (and search engines use visitor behavior to factor into rankings) this automatically increases your chances to both rank well and convert web traffic.

2). Choose Your Primary & Secondary Keywords

Believe it or not great seo web design starts with keyword research and keyword planning. Ask yourself, which keywords do I want to rank for.

3). Group Your Keywords by 2 or 3

Once you have your primary keywords noted, group them into groups of two or three.

4). Map Your Keywords to Specific Pages

Take these small groups of keywords and assign them to a specific page of your new site. You will need one specific page per group of related keywords.

5). Designate Money Keywords to the Homepage

Since your homepage is most susceptible to receiving natural inbound links, your best 2-3 keywords should be assigned to the homepage.

6). Draft Title Tags, Meta Descriptions, & URL Structure

Go ahead and draft the keyword title tags, meta descriptions, and keyword URL structure for each page of your site.

7). Draft Supporting Content Per Target URL

Write up the content that will support each page of your site. Aim to use the keywords assigned to that page of your site within your content two or three times.

8). Determine Your SEO Silo Strategy

Figure out how you want to link interior pages of your site together. You should embed at least one link within the content of each interior page and link to another interior page. Use a reverse silo if you are in a competitive online  industry to build link juice from your blog posts to your interior pages all the way to your homepage.

9). Leverage Anchor Text Within Your Silo

Within the links you build from interior pages don’t forget to optimize for anchor text according to the page you are linking to. Outreach Mama has written a great piece on anchor text optimization.

10). Pick & Optimize Supporting Images

Each page of your website should have a supporting image for pleasing aesthetics. Before uploading photos, first optimize the file name of the photo to include keywords relating to the page it will land on. (Another reason why you have to keyword map early in your SEO strategy) Additionally optimize the image with a proper alt tag including keywords.

11). Set Longtail-Keyword Rich Blogging Categories

Web designers always miss this one but not SEO web designers. Go ahead and optimize blog categories according to longtail keywords. That way each blog post written and filed to a category “refreshes” the content associated with the long tail blog category. Google likes seeing this and you’re blog category pages will end up ranking naturally in SERPs if done correctly.

12). Generate An XML Sitemap

The format for your sitemap should be XML. Distribute this sitemap to Google and Bing Webmaster.

13). Implement Rich Snippet Markup

Addresses, customer reviews, products, events, and more can be marked with a standard format that Google prefers to read in order to provide “rich snippet” search results. This helps dramatically with your click thru rate in organic search results.

14). Apply Google Authorship

Make your website stand out in search results with a photo snippet by setting up Google authorship.

Bonus Steps To a Completely SEO Friendly Site & A Better Quality of Life

1). Use WordPress & Only WordPress

-You can win or lose the entire battle by choosing WordPress 1st and choosing the best fitting theme second. Don’t get knocked out of the NCAA tournament in the 1st round by choosing Joomla or allowing some web designer to sell you on fancy HTML. Play good defense,  choose WordPress, hit your freethrows, don’t turn over the ball, and use this advice to hit some clutch three pointers and you may find yourself dancing in the final four or shall we say the top 4 organic results of Google. Of course you’ll need some great link building & possibly niche focused advertising to win the championship. If you need help that’s what we’re here for.

Have any questions about great SEO web design? Lets hear ’em below! Which tip of the 14 posted above was most helpful or insightful to you?

11 Steps: How To Change Domain Names & Keep Rankings

There are 11 important SEO steps to consider when redesigning your website and more importantly switching domain names. Because the concept of time is awesome, we’ll jump right into them.

1). Export URL’s using Google Webmaster tools

If you’re taking your internet marketing & SEO seriously then you have Google Webmaster tools installed to monitor your site’s performance. If not, no worries. Simply install Google webmaster tools onto your old site before you design your new site. Export Google’s list of indexed URL’s on your old site into an excel document. Now you know which blog posts & interior pages have the most authority on your old site. These are the url’s that you should be sure to redirect to a subsequent matching new url on the new site.

2). Beware of Content Duplication During Beta of New Site

Ensure that your development environment or beta sections of the new site are excluded from search engine’s view until the new site is officially live and until all redirects from the old site are set up.

3). Keyword Ranking Check

Take note of which keywords you are ranking for in Google. Put these in an excel document with the URL ranking that keyword.

4). Note Old Title Tags, Content, & Url Structure

Take note of the title tags, keyword URL structure, and keyword density of those pages that host ranking keywords. For example, if your “about us page” is ranking for the keyword “San Diego Surgery”, then take note of the title tag used on this page and the content layout. You’ll want to emulate this on the subsequent matching page of your new site.

5). Choose Desired Target Keywords

Pick your target keywords prior to website design. Include old keyword you currently rank for that you want to keep rankings for.

6). Keyword URL Mapping

Group 2-3 keywords to rank per page. Then determine which keywords will be assigned to which new pages of your new site. Consider how old keywords need to fit into the new pages.

7). Mock Up New Site Content & Images to Match Keywords

Draft up the content that will help individual pages rank on your new website for matching keywords. Consider the layout of the old website’s content that ranked keywords to help structure what should work on the new site.

8). Complete Interior Page & Homepage 301 Redirects

-Using Google’ Webmaster’s tools’ list of old url’s…. go ahead and set up 301 redirects from old interior pages and blog posts to the subsequent matching new interior pages and new blog posts. This step is crucial for maintaining SEO legacy and link juice from the old site. Then setup the 301 redirect from the old domain to the new domain. If you aren’t switching domains in your redesign then you don’t need to worry about this.

9). Generate New XML Sitemap & Upload to Google Webmaster Tools

Submit your new sitemap to Google via Webmaster tools immediately. This manually gives Google a layout of all new pages of your new website.

10). Request Manual Crawl and Index of Your New Site

Using Webmaster Tools you can manually ask Google to crawl your site. We always do this in addition to the sitemap submission for precaution.

11). Update Old Social Links & Neighbor Links

Try to update your social media profiles, bookmarking profiles, and neighbor links as quickly as possible. Neighbor links are those links which you may control such as links from another web property, mini-site, or your mom’s blog. Even though these old links will redirect from your old site to the new site (via the 301 redirects you setup in step 8)… the links will be more powerful if they link directly to your new site with optimized keyword anchor text.

Of course there are many other on-page and off-page SEO factors that contribute to your keyword rankings. (Keyword Rich Domains Win Always) These 11 we believe are most crucial and most controllable without making heads spin. If all goes according to plan here’s what you can expect.

Check out these Redesign Results!

4 of The Top Free Online Web Design Resources of 2013

Author: Lucas Rohm, Owner of Mission Bay Media, A San Diego web design firm.

Whether your field of expertise or interest is in Internet Marketing, Web Design and Development or SEO, it’s always nice to have a few tricks up your sleeve for your clients or friends. If you’re involved in editing or administering a website of any kind, there’s a chance you’ll have to perform some general Web Design related tasks, and what follows are some great (FREE) online resources and tools to streamline and optimize those tasks.

1) Dynamic Drive’s Favicon Generator –

One great, easy way to give a professional feel to any website is by including a Favicon. In case you’re not familiar, a website’s Favicon is the small image or icon that shows up next to the website’s name in the web browser’s tab or URL bar. Favicons usually come in .ICO file format. The best way to create a Favicon is to design an “iconic” representation of your site or logo in your favorite image editor, being sure to make the dimensions of that icon 16 pixels by 16 pixels. You can save that icon as a .PNG, .JPG or .GIF to start with. Once you visit Dynamic Drive’s Favicon Generator, you can upload your icon in any of the above image formats, and the Favicon Generator will allow you to download that icon in the proper .ICO format. Simply upload your new .ICO file to the root directory of your website and your new Favicon should install automatically! 

2) CSS Checkbox –

If you spend a lot of time writing CSS code, especially in relation to creating and styling form elements such as checkboxes, radio button and input fields, you’ll love this next free web designer resource. Designers looking for nice looking form elements and code, in particular free Checkbox CSS code, can check out CSS Checkbox for a variety of CSS and Image based checkbox styles that are available for free download.

CSS Checkbox sports a relatively large Checkbox code package that is open source, and hosts a CSS Checkbox generator that creates custom Checkbox CSS for specific situations. Whether you’re designing Opt-In forms for Newsletters or Checkout Forms for Ecommerce applications, having nice looking checkboxes from CSS Checkbox goes a long way. These CSS Checkboxes are “class”-based, which means that even if you run a site built on WordPress or Magento, you can retroactively install these beautiful checkbox styles. They even take requests for new checkbox styles, so if you have an idea of your own you can go share it with CSS Checkbox, and if you’re lucky they’ll post the CSS Checkbox style you’ve always dreamed of to their site.

3) CSS 3 Gen –

This site is a really wonderful resource for generating specific CSS styles for your HTML elements. CSS3Gen gives you an incredibly simple interface for creating cross-browser CSS3 styles for some of the more impressive CSS properties included within the CSS3 specification. By using sliders and editing simple configuration values, CSS3Gen can generate CSS code for the CSS box-shadow property, the CSS text-shadow property and the CSS gradient property, all of which are revolutionary when it comes to web design in the sense that prior to CSS3, these effects were achievable only through the use of images. CSS3Gen also provides some awesome tools to create CSS buttons for your menus and forms, as well as a generator for the CSS border-radius property — the CSS property that miraculously allows you to add rounded corners to your HTML elements.

4) Font Squirrel –

If you spend any time on a computer at all, chances are you are at least partially obsessed with fonts that are NOT Times, Helvetica or Arial. If that’s the case, you’ll absolutely love Font Squirrel. This Website offers “handpicked, free fonts”, which are great if you’re working on a personal project or designing something professional on a budget.

In addition to offering a really fabulous directory of sleek and impressive typefaces, Font Squirrel also offers a CSS @font-face Generator tool. This tool basically allows you to upload a font or typeface of your choice, and will subsequently use that typeface to generate a CSS @font-face kit that you can download free of charge. The @font-face kit will provide you several different file formats for your font (this allows for Cross-browser custom font implementation through CSS), a CSS file with example @font-face syntax (the CSS code that allows you to embed custom fonts in a website), and a demo HTML file so you can see your custom fonts in action. A quick word of advice–if you want to give your website or web project a little professional flare, take full advantage of this free tool and Font Squirrel’s incredible font database.

Did you learn something fun or interesting in this post? If so then please share the love and share the wisdom!

photo credit: luxuryluke via photopin cc

Why Google Loves Mobile Responsive Website Design

Before we jump into the necessity of building a mobile responsive website in 2012 lets first answer the question, what is a mobile responsive website? A mobile responsive website is essentially a website that will format itself to be most cohesive with any browser and on any device be it an iphone, ipad, Android, tablet, mini-tablet, ultra-tablet, awesome-tablet, or any soon to be internet friendly device. Think of responsive website design as the ability of the website to respond to any viewing device along with any viewing browser for the ultimate viewing experience.

Better Experience, Better Ranking

Responsive website design will provide all of your website visitors the best possible experience viewing your webpages. No longer will your business require independent mobile website design. No longer will business owners and marketing departments have to budget for an additional monthly premium to have an SEO-friendly mobile website. Instead it will be the responsibility of marketing directors and business owners to understand that they must require responsive website design on all forthcoming projects as the foundation of their mobile SEO efforts.

Why Does Google Prefer Responsive Design?

In the end the goal of Google’s search algorithm is to return the most valuable results to the end user. Value to the end user implies webpages that contain useful and accurate information, relevant information, are easy to navigate, are easy to read, webpages that are fast loading, and that are reputable. If the end user has a good browsing experience then Google has done their job. But how does a positive browsing experience relate to a better organic ranking?

In the past year Google updated their search algorithm to factor in positive user experience as ranking criteria. Websites with analytics that suggest a positive browsing experience are rewarded with higher SERP. Positive browsing experience analytics include numerous social shares, above average visitor time on a website, a low bounce rate, and a high return visit per user on average.

Bring It Home – Why Is Responsive Website Design Preferred?

Google wants their end users to be happy. End users are happy when they have a positive browsing experience. A positive browsing experience implies a website functions properly no matter what medium or device is used to visit the website. Responsive website design implies a website will look and function perfectly no matter what combination of pad, phone, tablet, computer, or web browser you use. So….when a website looks awesome even while using a mobile device- that site will most likely provide a positive browsing experience for which Google will reward with a higher ranking.

On the official Webmaster Central Blog, Google made this statement in regards to their favoritism of responsive website design,

“Using responsive web design has multiple advantages, including:

  • It keeps your desktop and mobile content on a single URL, which is easier for your users to interact with, share, and link to and for Google’s algorithms to assign the indexing properties to your content.
  • Google can discover your content more efficiently as we wouldn’t need to crawl a page with the different Googlebot user agents to retrieve and index all the content.”

We would love to hear your thoughts and comments on this post. Have you made the jump to mobile responsive website design? Do you have plans to in the near future?