Posted on

Build Your Website to Rank Well

le and other search engines can only know what you tell them. If you sell baby blankets like in our example above you need to tell Google and the other search engines that you sell baby blankets. Seems simple right? Unfortunately many companies don’t understand this so they build their websites focusing on keywords like “Maria’s custom sewing”. If you search for “Maria’s custom sewing” you find your website immediately. If you search for “baby blankets” you never find the site because… you guessed it, there is no mention of “baby” or “blankets” in the website anywhere. This small but unfortunate mistake has left thousands of business owners scratching their heads on why their website doesn’t show anywhere in the search engines.

Search engines read your website much like a human would. The text on the site is what determines what the website is about. Additionally, images, video and other media can be good indicators of what the website is about. There are six major areas you need to focus on when building out your website so that it can and will rank well in search engines.

1.    Each page on your site needs to focus on one major keyword or topic. Do not mix multiple services or products on one page.
2.    Title meta tags are the blue title in search engines and should have a specific link and keywords.
3.    Description meta tags are the text below the blue titles in search engines and should be clear with keywords.
4.    The url of the page should be structured in a clear way with keywords.
5.    The content should be a specific length with the right amount of keywords.
6.    Images and other media should have the proper alt and title tags to describe them.

Assigning Keyword to Pages

If you were going to start a window cleaning company like I did in Kingman and you offered window cleaning, screen cleaning, window track cleaning etc. The proper strategy would be to have a website with about 5 pages. There would be a home page which should list all of your services. Then you should have a link from the home page to each individual service listed above. You could then finish off with a contact page and any others you might need. To keep SEO in mind when building your website you need to remember that people are going to enter your website through the search engines. That means they may not go straight to your home page. Each page therefore should be build in a way that is attractive and informative with easy navigation to important pages like your contact page so clients can get a hold of you.

One huge mistake that I encounter a lot are website that have multiple keywords for one page. So many sites have a services page that list 10+ services on it. The search engines know to rank that page for general services but if someone types in “window cleaning Kingman AZ” they won’t ever show up due to lack of detailed targeting.

Before you write one line of code jot down on a piece of paper each page you think you should have on your website and one main keyword that page should target. If you end up having more than one service on one page then just create a second page and separate them.

Title Meta Tags

A meta tag is a description for crawlers when they view your website. The title meta tag is the main title of the page that crawlers pick up and index. When you do a search in google and see the blue titles and the grey text below them those are both meta tags. The blue title is the title meta tag and the grey text is the description meta tag.

screen-shot-2017-01-03-at-8-17-49-am

If you are using a content management system like wordpress the title tag is automatically created using the title of the page or post. Most content management systems will work the same way. You can also use plugins such as Yoast or All In One SEO to manually create title and meta tags for each page. I would recommend if you don’t have a lot of SEO experience to download one of those plugins to help with your on-page optimization.

Now that you know what the title tag is its important for you to know the proper way to use it. First the title should be between 50 and 60 characters spaces included. No more and no less. Having less will not give search engines enough info and more will not show the entire title in the results. The title tag should contain your keyword once and no more. Other than that you are free to do anything you want with them. If your business is Jerry’s window cleaning and you are targeting Kingman you could make your title tag “Kingman Window Cleaning | Jerry’s Window Cleaning”. This will tell search engines your page is about Kingman Window Cleaning and they should rank you accordingly.

Description Meta Tags

Description meta tags are very similar to title tags. They are usually automatically created from the first paragraph of the text in your post but again can be manually created and changed using a plugin. The description should contain your keyword as well but no more than twice. The length should be between 150 and 160 characters. Again no more and no less. An example meta description could be: “Kingman Window Cleaning services by Jerry’s Window Cleaning. We provide the best Kingman Window Cleaning in Northern Arizona. Call for a free quote!”.

This is the text that will show below the blue title in search engines so make sure it is describing what you do and what you want your potential clients to do.

The Page URL

There are a lot of online arguments about whether this helps for not but one thing for certain is that search engines highlight in bold any keywords that are in your url. Even if adding keywords to your url doesn’t help rankings having your url bolded is not a bad thing when standing out is so important.

Coming back to wordpress, if you create a page called “Kingman Window Cleaning” and your domain is http://jerryswindowcleaning.com, the url of your page would be http://jerryswindowcleaning.com/kingman-window-cleaning/. When someone searched for “Kingman Window Cleaning” a properly optimized page would show up with the title tag first, then the url with the “kinsman-window-cleaning” portion bolded and then the description.

I have seen a lot of pages rank well in search engines without the keyword in the url but having that little extra bold can only help with branding.

The Page Content

Now that you have the meta tags and url covered it’s time to move on to content. For quite a while the standard has been to have a minimum of five hundred words per page. This was true for quite some time but as more pages have been created the average has been bumped up to seven hundred or more. To play it safe go for at least one thousand words on each page. You may be thinking this is impossible but it actually isn’t that hard once you get going. Instead of writing a portion on how to write good evergreen content with a minimum of 1,000 words I’ll let you do your own research online for it. There are plenty of blogs that talk about how to dig deep. For a good read look up Mike Rowe from dirty jobs selling a pencil. If he can talk for that long selling a pencil I’m sure you can figure out a way to write 5, 200 word paragraphs per page.

Out of the one thousand words you will want your content to have your keyword about 5 – 7 times. More than that will be considered keyword stuffing, and less will not be enough to tell google and other search engines what you are about. Using a plugin like Yoast will auto find your keyword usage and tell you if there are enough or not.

Having the keywords in the page is essential to the success of a page ranking since search engines index the entire content of the page and so if you only have a great url and meta tags you probably won’t see great rankings.

Images and Other Media

Each page should have at least two images. If not it will be a very boring page for one thing but also search engines love images. When inserting an image into a post the code will look something like this: <img src=“src of the image” title=“Kingman Window Cleaning Picture” alt=“Kingman Window Cleaning Picture” />. The image src will be a link to where the image is stored. You can link to an image in your site or somebody else’s site (always be careful when using images that aren’t yours due to copyright laws). All of these image elements are important. The image url should have your keyword in it so try to name it something like kingman-window-cleaning.jpg. The alt and title tags are there to explain to search engines what the image is about and the text it will display if the image can not be found.

Some Things not Covered

There are a few other factors like readability, external links, internal links etc that I haven’t covered in this portion. You can do some searching online to find every on-page optimization factor that is currently taken into account by search engines. These main 6 are the ones that have stayed relevant for quite a long time.

Search engines only read what they can. They don’t care if your site is pink or black, pretty or ugly. They only care that it loads when they crawl it and that the content is easy to crawl and categorize. If you have a lot of confusing text that isn’t precise you probably won’t rank. I have talked with a lot of businesses that didn’t want to include any keywords at all in their page. That was totally fine! Your website isn’t going to get removed for improper targeting. You probably won’t get a lot of traffic for keywords you want but sometimes that isn’t the target.

However if that is your main target, take some time to properly optimize your pages to rank for keywords you want.

Posted on

SASS: Taking CSS to the next level

ou’ve been around the block for a little while, you’ve probably heard of SASS or one of the other CSS preprocessors before. A CSS preprocessor, when you boil it down, is a way of writing CSS in a language similar to CSS (usually just with syntactical differences), in a way that takes the amount of time spent writing the CSS itself.

“That sounds great!” You might say. And yes. You would be correct. The only hitch is that because these are written in a language other than CSS, you will need to process what you write before it can be used by browsers – hence the term preprocessor.

For this article, we will be focusing on SASS as the preprocessor that supports both .sass and .scss files and formatting, but will be using SCSS for readability. There will also be the compiled output to compare it to.

One of the largest differences between SASS and SCSS is their look:

SASS:

div ul li

color: #fff

font-weight: bold

a

color: blue

span

Text-decoration: underline

/* SASS says that you can leave semicolons and brackets out */

SCSS:

div ul li {

color: #fff;

font-weight: bold;

a {

color: blue;

}

span {

Text-decoration: underline;

}

}

/* SCSS doesn’t really mind them so much, and actually prefers them */

Compiled CSS:

div ul li {

color: #fff;

font-weight: bold;

}

div ul li a {

color: blue;

}

div ul li span {

Text-decoration: underline;

}

/* Plain-Jane, CSS */

For starters, let’s take a look at this plain CSS snippet below:

#myContainer {

background: #ccc;

width:50%;

padding: .5rem;

margin:0 auto;

font-family: sans-serif;

}

#myContainer ul {

margin:0;

padding:0;

list-style:none;

line-height:2rem;

}

#myContainer ul li a {

background: #ddd;

border-radius: 3px;

box-shadow: 0 -3px rgba(0,0,0,0.15) inset, 0 0 0 1px rgba(0,0,0,0.15) inset;

margin: .5rem 0;

padding: .5rem;

width: 100%;

display: block;

color: #555;

text-decoration: none;

box-sizing: border-box;

}

#myContainer ul li a:hover {

background: #eee;

}

#myContainer ul li a span {

color: #cc6699;

font-weight: bold;

}

#myContainer ul li:last-child a span {

color: blue;

}

See all of that repetition? “#myContainer” is repeated for each selector out of the need for specificity! Here’s the total tally for repetitions using plain CSS for just this small portion of the average stylesheet:

#myContainer: 5 times

#myContainer ul: 4 times

#myContainer ul li a: 3 times

I think we can make it a little shorter and more organized. Let’s try this:

#myContainer {

background: #ccc;

width:50%;

padding: .5rem;

margin:0 auto;

font-family: sans-serif;

ul {

margin:0;

padding:0;

list-style:none;

line-height:2rem;

li a {

background: #ddd;

border-radius: 3px;

box-shadow: 0 -3px rgba(0,0,0,0.15) inset, 0 0 0 1px rgba(0,0,0,0.15) inset;

margin: .5rem 0;

padding: .5rem;

width: 100%;

display: block;

transition: all 0.2s;

color: #555;

text-decoration: none;

box-sizing: border-box;

&:hover {

background: #eee;

}

span {

color: #cc6699;

font-weight: bold;

}

}

li:last-child a span {

color: blue;

}

}

}

 

And again with the tally:

#myContainer: 1 time

#myContainer ul: 1 time

#myContainer ul li a: 1 time

This example is not perfect, and SASS (or the SCSS that we are using above) can be made more future-proof in fairly easy ways. What if at some point in time, we decide that we want to change colors, but we are reusing that color hex all over the place? Sure, you could do a bulk search and replace, but wouldn’t it be easier if you could just re-assign a variable that you’ve been using to a different color and allow it to auto-recompile the moment you save?

#menu ul li a { color: #f00; }

.wrapper { color: #f00; }

.niceLink  { color: #f00; }

Now, as the amazingly intelligent front-end developer that you are, you know what #f00 translates into, but for the sake of making this easy to follow, it is pure red. Arguably not *generally* the best color for links, but it gets the point across. With our example above, we want to make all of those red links into orange links. We will have to go through every line (and in our full stylesheet, we surely have that color mentioned a few more times, possibly with slight variations). One of the goals of using a preprocessor revolves heavily on the use of variables throughout the stylesheet so that you can easily change a single line and have it propagate through the entire file. You can see where this can be a waste of your time. Using variables takes that away:

$linkColor1: #FFA500; /* Orange */

 

#menu ul li a { color: $linkColor1; }

.wrapper { color: $linkColor1; }

.niceLink  { color: $linkColor1; }

Which will compile into:

#menu ul li a { color: #FFA500; }

.wrapper { color: #FFA500; }

.niceLink { color: #FFA500; }
This is a very limited look at what SASS can do, so for a better look, check out the official documentation, and be sure to try it out for yourself!

Posted on

How to Delete a Blog on WordPress

how to delete a blog post on wordpress

ten get asked how to delete blogs in wordpress. Before I get into the how you should first ask youself why you want to know how to delete a blog on wordpress. Usually before deleting a blog you should figure out if you can update the content or replace it with something that is more useful.

I am all for keeping the web clean and updated but when people ask me how to delete a blog on wordpress I usually get worried that maybe the entire blog should be deleted not just the post.

Either way I’ll show you in this post how to delete a blog on wordpress with a step by step guide:

1: First log in to your wordpress admin area and hover over posts on the left hand side. Then click on All Posts.

How to Delete a Blog on WordPress

2. Second hover over your posts and you will see links show up under each one. Look for the one you want to click and then click the link that says trash.

How to Delete a Blog on WordPress

This will only move your blog to the trash. If you want to completely remove the blog from the site go to step 3. Remember though that once it is in the trash it isn’t readable by anyone in the public. If the page is indexed somewhere else somebody that clicks on it will not be able to access it.

3. To permanently delete the post click on the trash link above all the posts to navigate in to where all the posts are that have been sent to trash:

How to Delete a Blog on WordPress

4. Once you are in the trash, over over the one you want to delete and click on the permanently delete button. Remember this will remove the post forever from the site so only click on this if you are absolutely positive you want it gone.

Screen Shot 2016-08-16 at 6.58.55 AM

That’s it! Deleting a blog post is very simple but you should consider all the consequences before you do it just in case there are better options.

Other things to consider

In this tutorial I have showed you how to delete a blog on wordpress. If you decide your blog is not worth keeping you should consider removing the entire blog not just certain blog posts. I will show you how to do that in a separate post.

If you just want to know how to delete a blog on wordpress and not the whole blog then you are in good shape now. You should set up a 301 redirect from the old blog post to your home page or the new blog post you are writing. This will allow you to forward anyone who finds your old blog post to good relevant content. I’ll show you how to do that in a separate post as well.

Happy blogging!