Much like normal pages on a website, PDF documents can appear in search results when users search for their desired keyword. Most of the time though, the Title and Description are listed as something crazy and really doesn’t entice searches to click on them. The reason this happens is because the PDF file hasn’t been optimized. This brief tutorial will show you how to maximize your PDF documents.

In order to optimize your PDF documents, you must have a PDF editing tool. I am using Adobe Acrobat Pro for this demonstration but any PDF creator should work fine.

To get started…

Open the PDF file you want to optimize then select File – Properties or you can press Ctrl + D on a PC. This will open up the Document Properties window. This is where the magic happens so they say.

There are mainly three fields that will do the trick but there are tons of additional information you can include.

• Title: This is the meta title tag for your document.
• Subject: This is the meta description for your document.
• Keywords: This is the meta keywords for your document. Some would argue whether these are relevant anymore. It doesn’t hurt to put 2 or 3 in there. Separate your keywords with commas.

Once you make these changes, simply select “OK” and save your document. It is as easy as that.

Once again, there are many other advanced features that you can modify such as security and how the page will display.

We want to hear from you

What other ways do you use to optimize your PDF’s?

One great aspect about using WordPress is the abundance of plugins that are available at your disposal. It seems there has been a plugin created for just about everything imaginable. Among the thousands and thousands, few arise and stand out from the crowd. A handful separate themselves from the rest and become well known and are essential for just about every blog. Then there are those that you may have never heard of that will soon be a part of those essentials.

Below you will find examples of some plugins that most people have never heard of.

A.K.A. – WordPress Super Cache. This plugin in is widely known by those who want to boost their site’s performance. More than likely though, the average blogger has never heard of this plugin. This should be one of the first plugins installed before a site goes live. With search engines now using load time as metrics for rankings, you need to be concerned about speed more than ever.

This is an SEO plugin designed to get the most out of your site from a search engine optimization standpoint. It has been around for a while, but recently has started making headway and giving the All in One Seo plugin a run for its money. Some would say it is like All in One SEO on steroids.

This plugin is pretty much self explanatory. It is a simple to use script that allows you to add breadcrumbs to all of your pages. This helps users know where you are on your site plus let’s search engines understand your site’s structure more easily.

For bloggers looking to monetize their sites with Google Adsense or the Yahoo Publisher Network, this plugin is for you. You can easily apply ads on a global basis or on a post-by-post basis. Locating the ads within your posts or pages is also a breeze.

As a complimentary sidekick to WP-Super Cache, this plugin takes a few steps further in optimizing your site for speed. It will add expires headers for your images and scripts plus it will move JavaScript to the footer of your site. There is a way to exclude scripts that go to the bottom if you are a little savvy with code. It will also optimize your code including CSS, HTML, and JavaScript. YUI compression is also an option.

Let’s Hear From You

What other WordPress plugins would you add to this list that others may not know about?

Clicky Website Analytics

There are several quality analytics programs on the market to help you gather valuable information about your site and how users interact with it plus measuring the effectiveness of your marketing campaigns. This information is crucial if you want to get the most out of your website(s).

I use Clicky for all of my sites and here are the reasons why I chose it over Google Analytics. They also have a 30 Day Free Trial so you can test it out for yourself.

Real Time Analytics – This allows me to see how visitors are interacting with my site now instead of waiting until tomorrow. For some sites, real time information isn’t a crucial but for others it gives me a distinct advantage and I can react quickly to potential sales opportunities.

Goals, Campaigns, and Alerts – Goals, campaigns, and alerts are easy to create. Funnels can be created and I can track the conversion rates of the goals and campaigns. Then I can apply an alert to them and I will be sent an instant email notification when my site has achieved the goal.

Assign Names and Filter Users – In efforts to not skew results for my sites, I can assign my IP address a name and exclude it from the traffic I receive. If you have friends, family, co-workers, etc… you want to exclude, it works great for that as well. If you don’t want to exclude the names, you can just name the visitor and you will know when they come to your site. If you use the WordPress plugin mentioned below, people who comment on your blog are also named automatically.

CMS Plugins – Analytics integration into CMS platforms can sometimes be painful if you are not familiar with coding. Here is an Analytics Plugin which allows you to install analytics on your WordPress site effortlessly. There are also plugins for Joomla, Drupal, TypePad, Blogger, and many more platforms.

Twitter Integration – I can set up a Twitter search which notifies me when are talking about my specific search I specify on Twitter. This is good for keeping track of what others are saying about your business or topic on Twitter.

FeedBurner Integration – If you have a syndicated feed with Feedburner, just enter the URI of your feed and you will have instant feedback on the number of subscribers you have, the number of page views, and the number of click-throughs for you feed.

Affordable Pricing – There are several price options available depending on your requirements. They range from free up to $19.99 a month. If you purchase a year at a time like I do, then you basically get a %50 discount. There is also a free nor risk trial of their Pro package so you can see for yourself how it works and if it meets your needs.

These are just a few of the many aspects and features of the site. For more information about Clicky or to sign up for a free trial, head over to their site, Clicky Web Analytics, to learn more.

What other analytics programs do you use? Let us know my commenting below.

Get a Free PHP Web Design Template

Here is a simple template that you can download for free. It is a normal web template except that it utilizes PHP script to call certain files. This is also known as a PHP Include.

What the Heck is a PHP Include

It is a simple line of script that tells a web page to go get or include another file. This allows you to call other files such as header files, navigation, and footer files plus many more. This template utilizes a footer and a header file that is called by the script.

Advantages of PHP Includes

If you have a website with 50 pages and you need to add a simple line of text to your footer, you would typically have to change the footer in 50 pages or use a find and replace tool to replace text. With a PHP Include, you can modify your footer.php file and every page that uses that file will be updated automatically.

If you have any comments or suggestions, leave us a comment below.

Help Google Know What Pages are on Your Site

Sitemaps are good ways to let search engines know what pages are in your site. Some say they help expedite the process of getting your pages indexed while others disagree. My theory is that if you have a good navigation system in place for your website, the bots will be able to navigate their way through your site with ease.

In order to submit a sitemap you first must have created one. If you do not have one there are several tools available to automatically generate them or you can create a sitemap manually.

Submit Your Sitemap

Once you have your sitemap created, you can submit it to Google Webmaster Tools. If you do not have an account, you can create a Google Webmaster Tools account.

• Login into your Google Webmaster account.
• Select the site from your dashboard that you wish to add a sitemap for.
• Expand the Site Configuration menu
• Select Sitemaps
• Select Submit a Sitemap
• Enter the location of your sitemap.
  
  Note: your URL is already entered for you so just enter the location. Most people place their sitemap at the root level of their site. If that is the case for you, then just enter the name of your sitemap.
• Then select Submit Sitemap.

That was easy. If you make modifications to your sitemap come back to the Webmaster Tools and put a check beside your sitemap and select Resubmit.

Once you have your sitemap submitted, you should monitor the traffic to your site with website analytics.

Table Layouts Compared to Div Tag Layouts

One crucial decision in the layout of a web design must be answered before the first character of code is written. The decision to use a Table based layout or to use Div tags in the creation of your site must be addressed beforehand in order to choose which method will work best for your site. Knowing the advantages and disadvantages of each will help in making that decision.

Table layouts first began appearing when a Web browser called Mosaic was created in 1993 (Wroblewski 7). This is when websites started springing up like weeds in a garden which helped the Internet rise in popularity and become a resource that was used by people other than scientists. Before that time, scientists used the Internet to help share only text data amongst each other. Data is best displayed with the use of tables so this is how they eventually made their way to web layouts. Once the Universities and the general public started using the Internet, websites were created using table layouts since it was the common method used by the scientists before them.

Div tags were accepted by the World Wide Consortium (W3C) in January of 1997 with the release of HTML 3.2 (Raggett). The need for creators of websites to have more control and flexibility of how their pages looked when displayed in web browsers was the driving force behind Cascading Style Sheets. Div tags were used in unison with the Cascading Style Sheets (CSS) to provide a new method for creating web layouts.

Now that you have a better understanding of how Table layouts and Div tag layouts first came about, it is time to start comparing the disadvantages and advantages of each.

One disadvantage of using tables for web layouts is the amount of code it takes to create them. In this day in time, people want to quickly navigate websites and have them load at the speed of light. Extra code can weigh down the site and cause it to run slower. If your website is about creating conversions, this may be a deterrent and send users to another site that will allow them to get what they want faster.

Another disadvantage of table based layouts is they can require a significant amount of time to make modifications site wide. Given that you have to specify the width and height for the tables individually, you would have to go into each and every page to change those values. Depending on the size of the site; this could take a matter of minutes, hours, or even days to complete.

Disadvantages of Div tags are harder to find, but there are a couple worth mentioning. They require some working knowledge of CSS in order to style them properly. Since this is the case, some older Web browsers do not display pages designed with Div tags properly because these earlier browsers do not work well with CSS. Still today, web designers have to provide fixes for older browsers in order for their pages to display as intended. These fixes are primarily geared towards Internet Explorer.

As mentioned above, working knowledge of CSS is vital to using Div tags. This requires you to learn another language so to speak. Though CSS is considered to be a less complex language than some other coding languages, it still requires time to learn it. This time it takes for you to learn CSS will vary depending upon your experience with coding. For most, it is a quick learning curve.

Tables do have their place among web designs and have advantages over Div tags in certain situations. One situation where tables exceed is the displaying of data such as a calendar or a price list. To create something similar strictly using Div tags would be very time consuming and would require a significant amount of code. A table makes quick work of these two examples.

Another advantage of using Tables instead of Div tags for layout is that some designers find the concept easier to grasp than the use of Div tags. It requires little or no knowledge of CSS and most HTML editors have tools which make creating tables simple and fast. Given how there are some free and inexpensive editors on the market, this can be appealing to designers just starting out or for those who are creating a site for themselves.

Div tags are considered the standard method for creating web design layouts by most web designers due to the advantages the Div tags bring to the table. One advantage which we listed as a possible disadvantage above is the fact they work hand in hand with CSS. CSS allows designers to change the entire look of a site with the use of one or more external style sheets. This means designers can make a single change to the CSS and it will modify the entire website.

The use of Div tags in combination with an external CSS creates smaller sized web pages which results in faster load times when compared to table based layouts. This can mean the difference between a user staying or leaving your website you have created.

Given the advantages and disadvantages of Table based layouts and Div tag layouts, you have to decide on which method is best for you. Tables do have their place in web design, but most web designs today are created with Div tags and this is a good choice when in doubt.

Sources:

Raggett, Dave. “HTML 3.2 Reference Specification.” W3C. W3C, 14 Jan. 1997. Web. 9 Mar. 2010.

Wroblewski, Luke. Site-Seeing: A Visual Approach to Web Usability. New York: Hungry Minds, 2002. Print.

HTML Cheat Sheet Plus Many More

Today I came across a website that offers a variety of cheat sheets or reference cards if you will. Among them were an HTML Cheat Sheet and a CSS Cheat Sheet. The website is called Added Bytes and is ran by a guy from the UK named Dave Child and his cheat sheets are free to download.

Besides the HTML Cheat Sheet and the CSS Cheat Sheet he had lots more which included:

• Python Cheat Sheet
• mod_rewrite Cheat Sheet
• PHP Cheat Sheet
• SQL Server Cheat Sheet
• Ruby on Rails Cheat Sheet
• ASP / VBScript Cheat Sheet
• JavaScript Cheat Sheet
• MySQL Cheat Sheet
• RGB Hex Color Value Chart

There is also a code snippet section where he shares some various codes which are quite useful.

Prevent DMOZ Description From Showing in Search Engine Results

Sometimes when looking at search engine results, the descriptions will be something other than the meta description or snippets from the site. In most cases, this is the result of the search engine showing the DMOZ description instead.

If you have a site listed in DMOZ and you don’t want the description to show up in the search engine results, then add this simple meta tag in the head section of your site.

<meta name=”robots” content=”noodp”>

How to Use Div Tags for CSS Layout?

In our last lesson, we went over how to create navigation menus using lists. Our design to this point seems kind of bland and boring so we are going to cover some basic CSS styles so we can style our page and make it look more like the end product.

What is CSS

I’m not going to go fully in depth on what CSS is since this is a whole series unto itself. I will cover the basics. CSS also known as Cascading Style Sheets are a way to apply design elements to your website. You can include these within the HTML of your web pages or you can attach external CSS style sheets which is what I recommend.

Doing the recommended method will allow you to change all of the pages associated with the stylesheet with a simple click of a button. Example, if your font family for all of your paragraphs is Verdana and you want to switch them all to Arial, you just simply modify that line of code in your Style Sheet and all pages that use that Style Sheet will be updated. This makes quick work of modifying the look of an entire site.

Here are some other good sources for learning more about CSS

• W3 Schools
• Zen Garden

What are Div Tags

In order to use CSS, you must define the elements then define how you want them to look. The best way to do this is using Div Tags. We will apply some logical tags to our code now then start adding some style to our page.

Applying Div Tags

If you break our website down into sections you basically have the following elements:

• Header
• Navigation
• Main Content
• Sidebar
• Footer

We will use these to define the Div tags so we can style those sections later.

To assign a div tag this is the code to do so.

<div id="header"></div>

We have defined our header section.
Here are the rest of the main Div tags we will use for our site.
The Container and the Wrapper are elements we will use to contain other elements.

<div id="wrapper"></div>
<div id="container"></div>
<div id="mainContent"></div>
<div id="sidebar"></div>
<div id="footer"></div>

Here is our code for our page including the newly added Div Tags.

<html>
<body>
<div id="header"></div>
<div id="navigation">
<ul>
 <li><a href="/">Home</a></li>
 <li><a href="/">About</a></li>
 <li><a href="/">Contact</a></li>
</ul>
</div><!--End Navigation-->
<div id="wrapper">
<div id="container">
 <div id="mainContent">
 <h1>Welcome to My Very First Web Design</h1>
 <h2>What to Expect?</h2>
 <p>Don't expect a lot since this is my very first web design. But rest assured my friend that this is the beginning of something big. Rome wasn't built in a day and this website won't be either. Why bring that up? I'm not really sure but it sounds cool.</p>
 <h2>When to Expect It?</h2>
 <p>I'll defer to the first paragraph on this question. I'm not sure what to expect so how can I be sure when to expect it? I can't. So you should</p>
 <ul>
   <li>bookmark this page</li>
   <li>check back often</li>
   <li>keep checking back</li>
 </ul>
 <p>Don't be surprised if there isn't any new content from your last visit. But if there is new content, that means I am on my way to becoming a web designing machine.</p>
 <h2>What is a Web Designing Machine?</h2>
 <p>I did get a little carried away in that last paragraph. I'll tone it down a notch. What I meant to say is I'll become a proficient web designer so I can impress all my friends, but more importantly, all the ladies (or men depending on which gender you are) out there.</p>
 </div><!--End Main Content-->
 <div id="sidebar"></div>
</div><!--End Container-->
</div><!--End Wrapper-->
<div id="footer">Copyright © 2009 - Very First Web Design - All Rights Reserved</div>
</body>
</html>

Let’s Add our CSS Now

First we need to attach an external stylesheet. Let’s create a folder called CSS and and place a blank file called style.css in there. Once we have done this, just go to the head section of our site and put this line of code in there.

<link href=”/css/style.css” rel=”stylesheet” type=”text/css”>

This basically says when you open this page in your browser, load the style.css file located in the CSS folder.

Now let’s open up our blank style.css file.

We just need to define how we want our page to look now. The very first element in our page is the body tag. Let’s define that.

body {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 100%;
  background: #000;
  text-align: left;
  margin: 0px;
  padding: 0px;
  color: #FFF;
}

Now the body is defined.
The font family will be Verdana and if that is not available on the user’s computer it will choose Arial and so on.
The font size will be 100% of the user’s default. Typically this is 16.
The background color will be #000 which is black.
We want the text alignment to be to the left.
Set the margin and the padding to 0.
The font color will be #FFF which is white.

Here is the rest of our CSS styles for our page:

body {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 100%;
  background: #000;
  text-align: left;
  margin: 0px;
  padding: 0px;
  color: #FFF;
}
#header {
  height: 115px;
  background: #030000 url(/images/header.gif) no-repeat center;
  margin: 0px auto;
  text-align: center;
}
  #navigation {
  height: 21px;
  background: url(/images/navigation_background.gif) repeat-x;
  margin: 0px auto;
  text-align: center;
  padding: 7px 0px;
}
#navigation ul {
  margin: 0px;
}
#navigation ul li {
  list-style: none;
  display: inline;
  padding: 0px 20px;
}
#navigation ul li a {
  font-weight: bold;
  color: #FFF;
  text-decoration: none;
}
#wrapper {
  margin: 0px auto;
  background: #000 repeat-x;
}
#container {
  background: #3D0203;
  width: 900px;
  margin: 0px auto;
  overflow: hidden;
}
#mainContent {
  padding: 10px 20px;
  background: #3D0203 url(/images/mainContent_background.gif) repeat-x;
  float: left;
  width: 560px;
}
#sidebar {
  padding: 10px 20px;
  background: #3D0203 url(/images/mainContent_background.gif) repeat-x;
  float: right;
  width: 259px;
  border-left: 1px solid #000;
}
#footer {
  height: 17px;
  background: url(/images/footer_background.gif) repeat-x;
  text-align: center;
  margin: 0px auto;
  font-size: 80%;
  padding: 10px 0px;
  clear: both;
}
h1, h2, h3, h4, h5, h6 {
  font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
}
h1 {
  font-size: 160%;
}
h2 {
  font-size: 120%;
}
p {
  font-size: 90%;
}

Save this file and your page should look like this. Click on the image for a larger view.

Conclusion

We added some Div Tags which helped us assign some CSS values to our page. Our website is really taking shape now and it will be completed soon.

Next Lesson

In our next and last session, we will finalize the website by adding the sidebar content.

Download the Project Files

Comments or Suggestions

Let us know what you think about it so far.

Lesson 1 – HTML Codes
Lesson 2 – HTML Links
Lesson 3 – HTML Navigation List

How You Can Rank Higher in Search Engines

SEO companies can really enhance the performance of your search engine rankings. This can be a lengthy process depending on the competitive strength of your niche. It can also be an expensive process as well.

What can you do yourself to make a difference in your rankings without paying an SEO company? Here is a list of 7 on page optimization tips you can implement that, if done correctly, will have a positive impact on your site.

• Meta Title Tags
• Meta Descriptions
• Header Tags
• Alt Tags for Images
• Anchor Text
• Page Names
• Outbound Links

1 – Title Tag Optimization

This is an often overlooked area that is crucial for ranking for the keywords you are targeting. Title tags are the words or phrases that appear at the top left of your browser for each web page. They are located in the Head section of your website and are placed between these tags: <title>Example Title</title>

The title tag for this page is “7 SEO Tips to Rank Better in Google, Yahoo, and Bing”. A lot of people do not know this meta tag even exists or know the benefits from it so they do not enter one. When a page has a blank title tag, it defaults to “Untitled Document”. If you do a search in Google for Untitled Document, you will see over 25 million results. That’s a lot of wasted pages not taking advantage of this beneficial real estate.

How to use Title Tags for SEO?

There is a limit to the amount of characters that display depending on which browser you are using. Google typically displays around 65 to 70 characters and that includes spacing. This means you want to try and keep your titles in that. You want to put your most important keywords near the beginning of the title.

Page Titles should be unique for each page of your site. They should focus on 1 or 2 keywords or phrases for that particular page. Let’s take a look at an example.

I have a page that sells blue widgets plus accessories and I want to rank for those words. If I am a local market not ready to take on the world yet I could use:

Blue Widgets and Accessories for Sale in Dallas Texas

This lets the user know exactly what is available on that page. Notice the use of Capital Letters at the beginning of each word with exception to “and”, “for”, and “in”. Titles should use this format.

Make your title enticing to get people interested when they see it in the search engine results. If you try to over optimize for search engines, people will most likely go to the next result they see that fits their needs.

2 – Meta Description Tags

This is an often disputed topic among SEO’s because some feel search engines to not use these when determining search engine relevancy while others do. My take on this is that most search engines don’t use them when determining search results. The meta description is located in the head of your site along with the title.

meta name=”description” content=”Your description goes here.” />

They are relevant to getting people to click through to your site though. This is why I feel they should be used because the goal of most of our sites is to get traffic, more importantly, targeted traffic to our site so they can buy our service, read our information, view our product, etc…

Providing a descriptive Meta Description let’s searchers know what is on your site. Providing a good call to action also serves to benefit you by enticing searchers to click.

Meta Description Length?

Google typically shows about 160 characters for the description. Spamming this description with keywords won’t help your cause so try to write compelling text that will benefit searches and make them want to click through to your site.

3 – HTML Header Tags

Header tags define the structure of your site as far as heading go. What is a heading? Headings are basically headlines for your content. They are grouped within <h> tags and go from H1 – H6. They are located in the <body> of your page.

Examples of Header Tags

Examples used on this page are:

<h1>Search Engine Optimization Strategies for Your Website</h1>

This is my main header for the site so I placed it in an H1 tag. There should only be one H1 tag per page.

My next important headers are wrapped with H2 tags. You can have multiple tags other than H1. Examples would be:

<h2>2 – Meta Description Tags</h2>

<h2>3 – HTML Header Tags</h2>

The next important header is wrapped with the H3 tag

<h3>How to Use Title tags for SEO?</h3>

You can see that the higher the number, the higher the relevancy for the page. Once again, use one H1 tag per page. Make sure the H1 tag is not an exact duplicate of the Title Tag either.

4 – Image Alt Tag

All images should have ALT tags created for them. Not only is this required in order to validate code, but it also provides a description of the image and will show in case the picture doesn’t load. If the image is linked, the alt text is used as anchor text. They should be short and precise and not spammed to death with keywords.

How to Use Alt Tags?

Alt tags are placed in the imagine link. An example would be:

<img src=”/images/pretty_picture.jpg” width=”100” height=”100” alt=”Red Widget”>

5 – Anchor Text

Anchor text is pretty crucial for getting good results for the keywords you want to rank for. You don’t have control of the anchor text that people use to link to your site (most of the time you don’t) but you do have control over how you link to pages in your own site.

What is Anchor Text?

Anchor text is the linked words that point to a page. For example: Check out some great SEO Tips! The phrase “SEO Tips” is the anchor text and it links to my blog homepage.

The code for this would be:

Check out some great <a href=”http://www.redefinedwebdesign.com/blog/”>SEO Tips<a>!

With most links you would want to provide a Title Tag so I could add this:

<a href=”http://www.redefinedwebdesign.com/blog/” title=Search Engine Optimization Tips&gt;SEO Tips</a>

6 – Page Extensions, File Names, or Page Names

Have you ever been to a website and noticed an extension to a page that reads /2010/ #id3k27-12-17-1

I have seen lots of pages like that. Think about the feedback this provides someone looking at your page. It provides none whatsoever. The person doesn’t have a clue about the contents of this page and more importantly, they will never remember it.

Descriptive Page Names

Instead of the above example, why not have these instead: /cooking-tips.htm or /turkey-cooking-tips/

These are more descriptive and easier to remember. Always use hyphens instead of underscores when defining page extensions. This also applies to images and files such as PDF files.

7 – Link to Other Websites

This may seem strange at first since you want to get traffic to your site and keep them there. In order to get traffic though, you need to rank well in search engine results for people searching for your product or you need the traffic referred to you by other websites. Quality backlinks to your site are crucial for gaining ground in the results pages.

Why Use Outbound Links?

Providing links to other relevant information about your niche, product, or service is a valuable service to your users of your site. Don’t start posting links to your Mom’s cooking blog from your mortgage website because there is no value for the user. Instead point a link to a mortgage calculator which provides value for the user.

How Does This Get Inbound Links to Your Website

This won’t always get you a link and more often than not it won’t. What is does though is shows the owner of that site that you found something of interest on their site. They may come over and take a look at your site and find something of value as well then link to that.

If you link to valuable content then the user will appreciate the tip you gave them and will likely come back to your site in the future for more great information.

Conclusion

Using the above examples correctly and without spamming keywords will help you in the getting better results. The key thing to remember is Search Engine Optimization takes time. Don’t expect to see your site ranking in the top 3 overnight by making these changes today.

These are just a few examples of things you can do. There are hosts of other SEO tactics you can and should use, depending on how competitive your market is, for your website. These can be complex in nature and require a lot of work but are crucial for getting targeted traffic to your site.

What Other Tips Would You Add to This List?

In addition to the above tips, what would you add to the list? Comment below to let us know.