(Part 1 of a 3 Part Series)
One of the most overlooked aspects of creating a new Dreamweaver web site or updating and editing an existing one is how on earth is that web site and its many web pages going to be found by the major search engines such as: MSN, Yahoo and Google? The good news is making a web site and its many web pages “search friendly” is not hard to do, in fact it’s pretty darn easy to do right smack inside of Dreamweaver if you keep some simple “text” things in mind.
The World of SEO
“Search Engine Optimization” or “SEO” as the pros refer to it is all about getting your web site and its many pages found by search engines and “ranking” well when searchers conduct search queries by typing words or phrases into those small search boxes or fields. For the most part SEO comes down to plan old text. Yep, you heard that right, text. SEO is about how search engine spiders, crawlers and bots “read” the text (also known as keywords) on your web pages – the stuff human eye balls read as well as some behind the scenes strategically located text called Meta tag web page titles, descriptions and keywords.
SEO is also about another very important aspect of search, getting your web pages ranking well at the top of what is called the “SERPS” also known as “search engine result pages” (which I will cover in part 2 of this series). SERPs are all about getting tasty morsels of text into your web page code that the spiders and search “bots” can chew on to help index & rank your way cool web site pages at the top of Google’s search results.
But first, let’s take a high level peek at two areas of a web page that you want to make more “attractive” so Google and other Search Engines will love your site; what the human’s see (web searchers) and what the spiders “see” (technology used by the search engines to find cool stuff on the web).
Bleary Eyed Searchers First
The most important thing to keep in mind about web pages being seen by the search engines is this, create the web pages for humans first and search bots second. Why? Because it’s people who are ultimately reading and seeing your pages and you need to serve them over the bots. Novices to SEO sometimes go way overboard with what is called “keyword stuffing” and other shady “black hat” SEO techniques (more about this in a future blog post). So simply keep in mind its people you are serving and not the bots.
Search bots or search robots are simply algorithms (the math that finds cool stuff for you on the internet) and works for the most part in exactly the same way they worked many, many years ago when they were first invented; search engine bots crawl the web looking for text, even if searchers are looking for sound files, photographs, Adobe Acrobat PDF files, blogs and even video. Search engines have barely changed since they were invented and it’s no wonder, the web is mostly composed of text so you can rest assured the search engines aren’t going to jettison text search anytime soon regardless of how many way cool Flash movies or YouTube videos you have on your web site.
So what’s super important to having Google, MSN, or the Yahoo search engine fall in love with your web site is to have searchable text on your site in as many places as possible, meaning plan old HTML or the newer XHTML text. I said searchable meaning your web pages are not made up entirely of big O’ Fireworks or Photoshop .JPG images or made totally with Flash for instance. You can have .JPG, .TIFF, .GIF as well as Flash movies and videos on your web pages “but” your pages can’t be made up totally of these types of content because search engines currently (this is changing however in the near future) have a heck of a time getting inside of these formats and files and searching them. Again they are currently only good at searching text. In the next installment of this three part series I will visually show you the good, bad, and downright ugly way “not” to create web pages that are not search friendly.
Yummy Spider Food
To get started making your pages more search friendly, follow these three quick and easy “Google Loves My Web Site, Thanks Dreamweaver!” steps below. Do keep in mind these are not all the steps needed to help your site be found and rank well, these first three steps will get you started and we will explore other aspects of Dreamweaver and SEO techniques in future installments here on the blog.
Google Loves My Web Site, Thanks Dreamweaver!
1 – Fire up Dreamweaver and create a new Dreamweaver web page or open an existing Dreamweaver web page. Notice that little field (see example below) at the top of the page labeled “Title:”? It’s typically filled in with “Untitled Document” when you create a brand spanking new web page or filled with something silly and useless on a home page like “Welcome to Our School’s Web Site!” (BIG, BIG, NO, NO!).
The page title field is where your most relevant “keywords” get entered (see arrow).
Make no mistake, this innocent little field is one if not the most important places on your web pages to put “relevant keywords” into so the search engines will fall madly in love with your school’s web site! Relevant meaning, when a person is searching for the name of your school, your school district, information about the next PTA meeting at your school, this little box contains the keywords which are relevant to the information about what’s actually on that vary web page.
As an example perform this simple search with the Google search engine; type into Google’s search query field, “Wazi Woo High School”. The first SERP (Search Engine Result Page) listing for this totally factious Adobe K12 training web site is the home page for this site. Note the very first line of text you see reads, “Wazi Woo High School: Ventura California – Home of the Wazi Cats!” This text is what Google found inside of that innocent web page Title field when this home page was created inside of Dreamweaver by yours truly (see below).
The text content you put into Dreamweaver’s page title field is what Google list your site as in the SERPS. Make sure you put highly relevant keywords here (see arrow above).
Keep in mind if you put something like “Welcome to Our School’s Web Site!” or heaven forbid, “Home Page” as an example, parents, students or even your district or schools entire staff is going to have a very tough time finding your web site because they are not typing into Google “Welcome to Our School’s Web Site,” they are most likely typing the name of your school (example – “Wazi Woo High”) followed by something like “Ventura, CA” or “Map”.
How many keywords can you put into this web page Title field? A good SEO rule of thumb is no more than ten highly relevant keywords. Don’t stress over adding commas, underscores, dashes and the like. Just get the most relevant keywords on the page which represents what the page is all about into this box. Once you do this save your page in Dreamweaver.
Speaking of keywords, a great (and free!) cool tool to help you discover powerful keywords for your school’s web site is the awesome Google AdWords “external” keyword tool (see below). This robust powerhouse of a tool is part of the Pay Per Click (PPC) web advertising program that Google owes its entire fortune to. It is used by AdWords account holders who create those pesky little ads you see at the top of the search engine’s result pages and over on the right side of your search query results. Here’s the link to Google’s AdWords External Keyword Tool.
Give it a try, you’ll discover amazing things with this tool and what keywords are most popular on the internet and what web advertisers are paying “per click”. You’ll learn for instance how much web advertisers Cost Per Click (CPC) can be for astronomically expensive keyword phrases like “Beverly Hills Plastic Surgeon”. But please don’t click on those Plastic Surgeon ads within the search engines unless you really want a tummy tuck, every click will cost some plastic surgeon in LA a small Google fortune!
You’ll be amazed with Google’s free keyword tool. Give it a spin to discover great keywords!
2 – Let’s go back and take a look at the second line of text in your SERP for the Wazi High School Google listing, the one that reads, “Wazi Woo High School located in Ventura, California is a totally factious web site. It was created for demonstrating Adobe Systems award winning software …”. This text is called a Meta “description” tag and is super important to give the humans some idea what the web page is all about; its main purpose is to go into more detail than the Title of the page above gives to searchers.
What’s very important here is to fill it with the exact same relevant keywords that are found in the web page title field above. For instance, “Wazi Woo High School Ventura California” has been repeated in this Meta description tag which is a very good thing because the search engines LOVE redundant keywords; so much so that you should have near a dozen of them within all of your searchable text web pages for searchers and search bots too.
So where do you put this Meta Description text? Below is a screen shot of Dreamweaver’s Insert tool bar with the Common tab selected. Look for the small icon of the greenish colored page with a cartoon balloon icon on top of the page icon. Click this and you’ll get the Meta description pop up window (see below). In this field write in a Paragraph’s worth of keyword rich text describing the content that is on this particular web page of yours. Again the most important thing to put into this box is the relevant keywords and information that can be found on this web page of yours.
Enter an informative description about your page; add your most important keywords too (see arrows).
3 – Last but not least there is one more Meta tag you’ll want to add, this one is called “Meta keywords”. This time in the same Common tab click that tiny little downward pointing black arrow and choose “Keywords” (it’s the icon that looks like a skeleton key on the Common tab). In this field dump as many keywords that relate to this web page that you can think up (or use the Google AdWords tool to discover some). I say dump because this is the place you can safely go overboard with keywords in (see below).
Enter as many relevant and related keywords. It’s OK to go hog wild here (see arrows).
For the Wazi Woo High School site my keywords here are: “wazi, woo, waziwoo, wazi woo .net, waziwoo.net, www.waziwoo.net, richard jenkins, richard john jenkins, jenkins, senior systems engineer, adobe, adobe systems, k12, education”. Keep in mind that many search engines no longer use this Meta tag, but to play it safe I do because the search engines are always changing and evolving so I cover my SEO bets by using this tag.
Why is my name in these keywords? I initially created the Wazi Woo High web site in Dreamweaver for our teams use so I simply added my name to it in the begining so educators can find it by searching for my name after I demo the site to them at a trade show or Education training center if they forget the name Wazi Woo High. My team mates here at Adobe could add their names too on other pages (called landing pages) if they’d like to be found by the seach engines. As an example of how landing pages work search for “richard john jenkins wazi woo high” to see what I mean – you ‘ll land on a totally different page at the site and not the home page.
Once you add all three of these search friendly SEO meta tags click on Dreamweaver’s cool Code button (upper left of the page you’re working on) to see what your search engine friendly meta tags look like behind the scenes in the HTML or XHTML code on your web page! (see below).
The three search friendly Meta tags shown here will get the spiders to come a callin’ (see arrows).
Below is what the three tags look like on the Wazi Woo High School home page. Note I stripped out a bunch of other code so you can see just these three tags, plus I stacked them one on top of another so you can see them clearly; your code will be spread out more than this example below.
Page Title – Wazi Woo High School: Ventura California – Home of the Wazi Cats!
Meta Description – Wazi Woo High School located in Ventura, California is a totally factious web site. It was created for demonstrating Adobe Systems award winning software tools to K-12 Educators by Adobe Senior Systems Engineer, Richard John Jenkins
Meta Kewords – eywordswazi, woo, waziwoo, wazi woo .net, waziwoo.net, www.waziwoo.net, richard jenkins, richard john jenkins, jenkins, senior systems engineer, adobe, adobe systems, k-12, education
You can also see every single web pages SEO friendly code (or not so friendly code) inside your favorite browser by going to menu > view > page source. Check this technique out, it’s fun to learn how other sites’ webmasters have done their SEO, especially the web sites who’ve made it to the very top of a Google search query!
By adding these three quick and easy search engine friendly meta tags to your educational web pages with Dreamweaver, your site’s pages will become very, very attractive to the search engines and you will soon see that they will be courting your web pages over time and telling searchers the world over how much they adore your site by ranking your web pages well in their SERPS when people perform search queries.
Are there other cool SEO tips and tricks you can utilize with Adobe’s Dreamweaver to help your educational web site and its many pages be found and rank well by the top search engines? You bet! Check back here in a few weeks for part 2 of Love at First Site – Landing Pages Rock! You’ll learn what landing pages are and how to get your school’s web pages on page one in the major search engines!
Richard John Jenkins