October 2013

Let’s talk about HTML basics for SEO again.

Alright, so maybe my previous post on html wasn’t the ‘least amount’ you should know. You can never know too much about anything. The more you know about the underlying structure of your website the easier it is to optimize every single detail. Let’s go further down the HTML rabbit hole and learn more about some important tags and attributes.

Write an attention grabbing title!

The <title> tag in your html document always resides within the <head> tag. If you haven’t guessed by now, the title tag determines what is displayed on your browser title bar. This will also be the text that search engines link to your site-the text people will first see when a page on your site shows up in their search results.

Website title in search results

It should be pretty obvious that you want your titles to be attention grabbing and descriptive of the content. They should be concise and to the point, and sometimes maybe a little surprising.

For SEO, titles should be less than 80 characters long. Anything longer is likely to get cut off or not used at all in a search  result. Your targeted keywords should be as close to the beginning of the title as possible. When your page comes up in a search result, users are more likely to notice and click on links with their keywords more prominently placed near the beginning of the result.

Each title should be unique. It’s alright to have a few words in the title on all your pages, like your company name, etc… You should not however have any duplicated titles across your site. Similar or duplicate titles will be confusing for your visitors, search engines, and yourself. Duplicate content is something to be avoided like the plague.

I wrote a meta tag describing my meta tags, meta!

Meta tags are used to tell browsers and search engine crawlers specific information about a page. Meta tags are placed within the <head> of your html page. There are only two meta tags you need to concern yourself with in regards to SEO.

Meta description

The meta description tag tells the search  engine what your page or site is about. It should be a well written human readable description less than 155 characters. On a Google search result page this description is the text displayed beneath the title of the result displayed.

Website meta description

It must be written for a normal human to understand and not just a list of keywords. Google’s algorithm will analyze this description and may not use it at all if it’s determined to not represent the page it’s describing.

Here’s an example of a meta tag:

<meta name="description" content="Great Choice Dog food is a well-balanced nutritional food for your favorite pet. Serve your best friend only the tastiest treats and make him or her a happy dog!">

Writing a great description will also help you get more people to click through to your site. Users usually scan through the first search result page and an enticing description will be much more effective than one generated by the search engine itself.

The robots are taking over

Robot telling a human to get to work

The robots meta tag is something you won’t likely have to concern yourself with, but it is important to know about nonetheless. If you would like a page not to show up on a search engine results page this is the tag you would use.

The robots tag can be used to give a search engine crawler some rules regarding how it can use the content on the page. Most major search engine crawlers will respect these rules but they don’t necessarily have to. What this means is that a spam crawler, or other malicious web crawlers may ignore all robot rules and do what it pleases.

By default, without a robots tag on your page, a search engine will index your page and use it in it’s search results. You can specify ‘noindex’ in a robots tag to tell the search engine you do not want the page to show up in their search results.

The robots meta tag looks like this:

<meta name="robots" content="noindex">

You can read a little more about the other available options to use in the robots meta tag over at Google developers.

Headings, sub-headings, sub-sub-headings, oh my!

We already talked a bit about headings in the article about content hierarchy but I think we should revisit them briefly.

Often your content management system will use an <h1> heading to represent the title of your blog post or page. This same content is often what is also automatically placed in your <title> tag as well.

In WordPress you can use a plugin, such as the Yoast SEO Plugin to tweak the title of your page and make it completely different than the title of your article. You will want to keep your <title> still closely related to your page or post title, but often it’s a good idea to tweak it just a bit to move keywords closer to the beginning of the line or rephrase it target more keywords.

Screenshot of Yoast SEO Plugin

Since most people scan documents before reading, you should split your content up into easily digestible parts and important points. Using layers of headings and sub-headings to split up sections and direct their attention where you want it.

As with any document, online or offline, your headings are just title’s for sections of content. You should treat them like you would the title. They should be well written, descriptive, and have keywords near the beginning. When someone is scanning through an article they will generally read the headings and the first sentence or two before deciding whether to more thoroughly read through it.

If your post or article title is and <h1>, your content will split up into various <h2> sub-headings and <h3> sub-sub-headings. Of course, you can continue to go <h4> and above this depends what you’re writing about.

The following is a heading hierarchy example (albeit not a great one).

<h1>Ways to get around town!</h1>
  <h2>Get around town in style on wheels</h2>
    <h3>Two wheeled transportation is economical</h3>
      <h4>Fast lightweight bikes for rent</h4>
    <h3>Four wheeled transportation for comfort and style</h3>
      <h4>Try a car</h4>
        <h5>Compact cars for fuel efficiency</h5>
        <h5>Mid-Size cars for extra room</h5>
  <h2>Get around town on Foot</h2>
    <h3>Wear comfortable sneakers for long walks</h3>
    <h3>Boots are best in the rain</h3>

Conclusion

There are many html tags, and to ensure search engine crawlers and humans alike understand your content, you must understand how to correctly use them. I can’t go over all of them in this one post, so I’ll continue to talk more about the different tags available, their semantic meaning, and how to use them correctly.

Next week: Images.

Until then, keep it semantic. 😉

 

How to create massive amounts of quality content quickly

So you know the cornerstone of good SEO is to have an authoritative presence online and provide plenty of valuable and interesting content. Now you’re wondering, ‘How do I make all this content? How much is it going to cost me? I want it done soon and quickly because I want to triple my web traffic this week!’

I’m sorry to tell you that isn’t how it works. There are no shortcuts. Well, there are no good shortcuts. There is an entire industry of ‘black hat’ SEO experts out there that use some shady tactics that just may get you a good ranking. Lets talk about why we don’t want to do that.

Black Hat: SEO’s Dark Side

There are a few problems with ‘Black Hat’ SEO strategies. ‘Black Hat’ is loosely defined, but in general it is knowingly trying to game the search engine algorithms with garbage content and spam. The problem is that it fills the web with garbage.

Drawing of the Internet

What kind of garbage? Well, comment spamming for one. You’ll often notice completely off topic comments or poorly worded general comments that contain a link to another site. Most of the time these are spam comments trying to insert links to their site. The theory behind this is that search engines will pick up this link as an honest link from one site to another and increase the linked sites ranking (One link likely won’t matter, but imagine thousands of spam links spread across thousands of blogs).

Black Hat also provides us with the multitude of awful ‘spun’ content. What is ‘spun’ content?

Spinning Top

Spinning content involves writing an article, or better yet, copying an article from somewhere else and passing it through article spinning software. What this software does is help the user create very rough rewritten articles replacing words and phrases with synonyms and like phrases. Most of the time these new articles are near impossible to read without editing, and in general no one edits the end result. They are used to produce ton’s of unreadable content that appears to be unique.

These strategies also cost money for many companies trying to provide valuable free services to people. Just check out this post from one small startup about dealing with spam: http://the-pastry-box-project.net/chris-coyier/2013-october-10/

Employing anyone that uses these strategies is taking a gamble with your reputation and Google is constantly updating their search algorithms, so you may someday find your site has dropped off the map.

So how do I create all this awesome content?

The key is to use a slow burn tactic. Create consistency. Even if you just post something once a week you’ll begin building an archive of valuable content that will be indexed by Google. 

Master key

It will take time, but the more often your write content, the better you will get at coming up with ideas and writing great unique content. If you don’t have the time to do this, make the time. If you really, really, can’t find the time because you’re too busy running the day-to-day operations of your business then hire someone to write for you. Even if just part-time, you need to be providing content on your site regularly in order to build up a large archive.

If you do hire a content writer, make sure they understand your product or service. Even better if they are a passionate user or customer.

Focus on quality. Make sure your content is worth having archived online. The more timeless information your site contains the better it will be perceived. It’s better to write one quality article a week, or bi-weekly, than one 20 word throw-away article daily.

Conclusion

I hope this has given you an idea of what to avoid and how to get started. We’ll talk more about coming up with content ideas in the future. The key is to just be consistent and start writing regularly on your company blog, newsletter, or whatever method you use to reach out to your customers.

Satisfying Records screenshot

Satisfying Records

Designed and developed complete website for indie record label Satisfying Records. The site is completely responsive and adapts to both desktop and mobile browsers. It also includes compatibility with older browsers.

I developed a completely custom CMS in PHP utilizing the Laravel PHP framework, enhanced with JavaScript, to allow the critical parts of the site to be updated effortlessly. I also created a simple API to provide the most recent tour dates to other websites in JSONP format.

Visit SatisfyingRecords.com

Technologies: HTML5, CSS, JavaScript, PHP, Laravel, jQuery, Responsive design

Script-FU – My dive into Gimp scripting

Last week I took my first foray into Gimp scripting.

I use Gimp pretty much exclusively for raster image editing. It has all the functionality I need in an image editor and migrating from Photoshop (years ago) wasn’t too difficult. It has it’s quirks but it is really powerful software once you learn it.

I’ve been meaning to dive into scripting for some time now, to automate a few tedious tasks I do regularly. I often need to mirror images both horizontally and vertically to create tiles so I decided to start with a couple simple scripts to mirror images.

There are couple scripts in the Filters->Map menu already in Gimp that can accomplish what I want, but they also contain many unnecessary options and are a little too complicated for my simple needs. I like to save as much time as possible and I’d rather click one button than have to mess with a bunch of settings every time I need to mirror something in a different way.

Starting with these fairly simple scripts also provided a way for me to get my feet wet in Gimp Script-FU.

Script-Fu is the default scripting language used in Gimp and it’s based on scheme. Luckily I am already familiar with the syntax of scheme from a functional programming course I took on Coursera.

I’m not 100% satisfied with the code but the scripts work exactly how I intended. I can however forgive my code for sucking, as learning Gimp scripting while utilizing a recently learnt programming style was a bit of a challenge. I must say I didn’t use much of a functional style of programming aside from using a language designed to facilitate that style.

I wrote three scripts, one of which might not be as useful to anyone but myself, but I put it up as well.

Horizontal Mirror mirrors the current image across the x axis (doubling the width).

Horizontal Vertical mirrors across the x axis first, then the y axis, creating a tileable image.

Generate Header Images mirrors the current image across the x axis, and chops the image up into new layers of 190 pixels each. I use this for some of the watercolor headers on this site.

They all install into the Image->Translate menu.

They’re all available on github here: https://github.com/cdgugler/gimpscripts

Or individually:

Horizontal Mirror
Horizontal Vertical
Generate Headers

Create quality content and become an authority.

If your website just contains your business location and phone number along with some promotional text don’t expect to rank high on search engines in your industry. It’s alright to just have a ‘business card'(Fig 1) type site online so your existing customers can find you, but you need quality content that people want to read to have any relevancy or authority on the internet.

Business Card Parody Image

Quality content for quality rankings

Producing unique quality content is the first and most important step to help your site rank high in the search engine space. Your customers are searching for answers to questions every day and your site should be the one to answer them. In fact, your site should also answer search queries in any related topics to pull in even more customers.

One of the top metrics search engines rank your site on is the quality of your content. Spam sites meant to game rankings are often filled with barely readable copies of articles from more popular sites that have been automatically reworded/rephrased to appear to be different unique content. These tactics are well known and a good reason to make sure your content is unique, interesting, and readable.

Unique quality content is also more likely to appeal to your customers and produce sharing among them.

Customer Engagement

The rise of social media sites like Twitter and Facebook has revolutionized customer engagement. Customer complaints and questions are often public and easy to find. Engaging with your customers and potential customers is now easier than ever.

A quick search on twitter for your product or industry will likely reveal hundreds or thousands of tweets. Each tweet is a possible positive interaction for your business.

Let’s say you run a business that sells coffee beans and supplies to consumers. You search twitter for coffee grinder and find a tweet from a user complaining that their coffee grinder broke this morning.

Broken Coffee Grinder

This is an opportunity to help a potential customer. Be careful about sounding spammy, in fact, I would recommend your tweet not promote your business at all, just help out someone in need.

In the above example, you could respond with something along the lines of: “I hate when that happens! I’d recommend a burr grinder, I like the Burr Grinder super ultimate express plus plus.”

Be careful of appearing to be spamming random twitter users. If you manufacture ‘Burr Grinder super ultimate express plus plus’ and it is only available from your company, you may want to disclose this. The key idea is to help people without trying forcefully promote your business–while also promoting your business.

Helping people promotes more social interaction with your brand, resulting in more mentions of your business on social media sites.

Be THE authority

You provide a product or service to your customers. You are the authority on that product. Make sure everyone knows it.

Your customers need to know it. Google needs to know it. Bing needs to know it. DuckDuckGo needs to know it. Everyone.

Make sure everyone knows you are the master at making gourmet chocolate covered pizza bites by becoming the authority and main source of information on the web about gourmet chocolate covered pizza bites (I just made that product up, but if these really exist, well, I don’t know what to think about that).

Drawing of a chocolate pizza

Becoming an authority online can be difficult depending on your product. Being the authoritative source about chocolate pizza bites won’t be as difficult as becoming the authority on-say, insurance.

If your product or service has huge competition you’ll still want to target the general audience, like insurance, but you will want to expand and narrow down what you write about even further for better results. You could focus on the location and then narrow down the topics.

So, don’t just write about general Insurance topics, start to focus on specifics. For example, you could write about standard Insurance topics and then expand and write about Kansas City focused insurance topics, and finally Kansas City Casualty insurance.

If you consistently provide quality information related to your product, service, or industry and make sure people know about it, you will become an authority and naturally start gaining links and mentions from social media and other websites.

Search engines look at your content and who is linking, liking, and talking about you to determine how relevant your site is related to a search query. This is why content is the most important factor web marketing or SEO.

That’s all folks

Create quality content, engage your current and future customers, and become an authority. It’s really that simple, or hard, depending how you look at it. Start today providing content on your site. Start small if you have to–just build a habit of consistently writing on your site–or hire a good writer if you have the budget, but make sure whoever is writing for you is as passionate about your product or service as you are.

Homework: Make a commitment to publish at least one piece of content on your site weekly.

Top tip: Every question a customer asks you is a potential blog post. This is a great source if you’re blocked and having trouble thinking of what to write about. Another customer somewhere is asking that question online but they haven’t heard about you yet. Write about it.

The least amount of HTML you need to know for effective SEO

Your first step in learning search engine optimization is to understand the basics of HTML. You don’t necessarily need to become a developer and start building your own sites from the ground up, but understanding how web markup works is essential to optimizing your site for search engines.

HTML is describing your data

You probably already know that the web uses HTML, and maybe you’ve heard the term CSS and JavaScript thrown around a lot to.  I’ll be talking about HTML in this article, the markup language for creating web pages.

When you create a new post or a page with a standard content management system (CMS) like WordPress, most likely you’re using an editor that takes care of the markup for you.

Try this out.  Create an article in WordPress, make some of your text bold and some italic and throw any other types of formatting you want.  If you preview or publish the post and then highlight your text, right-click and click on Inspect element, a small inspector window should pop up (Firefox and Chrome).

Chrome Web Inspector Screenshot

You’ll notice that your text now contains extra text you didn’t write, surrounded by inequality symbols ( < > ). For text you made bold you will likely see <strong>bold</strong>. For italicized text you may see <em>italic</em>.

HTML Tags

The text surrounded by greater than and less than signs are called HTML tags.  Your entire webpage is made up of content surrounded by tags.  The tags are merely there to describe your data and tell the web browser how to display it.

Below is an example of a very simple webpage. It’s important to note you would never use something this simple on a real site. It’s missing some important tags and meta information, but a browser will load this and display it correctly.

<html>
<head>
<title>Turtles are awesome</title>
</head>
<body>
<article>
   <h1>Turtles are the best for so many reasons!</h1>
   <p>Turtles are so cool and they know it. Here are a couple reasons they're awesome (in an unordered list):</p>
   <ul>
      <li>They're slow!</li>
      <li>They have shells!</li>
   </ul>
   <h2>Why being slow and having a shell is cool</h2>
   <p>A little know fact about being slow and having a shell.</p>
</article>
</body>
</html>

The title of the article ‘Turtles are the best!’ is surrounded by an <h1> heading tag. Generally an article or page will contain one <h1> tag which contains the title or main idea of the article. Your sub-heading tags should describe what the next section is about. The bulk of your text will be surrounded by paragraph <p> tags.

CSS also plays a part in telling your browser how to display your data. You can think of CSS (which stands for Cascading Style Sheets) as telling the browser how to style your data. We don’t need to be too concerned with CSS for just SEO because the search engines shouldn’t care too much how something is styled, although we can never be too sure. No search engine reveals exactly how they rank sites, otherwise everyone would just game the system.  All we have are guidelines to follow.

How search engines use HTML

So what does any of this have to do with SEO?  Well a whole lot. You must understand how to use proper tags to describe your data well.  Humans may not see all your HTML markup, but search engines do.

Google, Bing, and all search engines use computer programs called crawlers, that basically just visit site after site mining the content. The only way they know to interpret your site is to read the HTML markup and try to understand the content.

Lightbuld doodle drawing

You can help the search engine crawlers understand your content better by formatting the content on your site properly. If a crawler can understand what your content is about, then it can more easily determine what search queries your content is relevant for.

And that is the entire point of search engines. To return the most relevant content for the query passed into it.

I know this may seem basic, and maybe even common sense to many people, but you must keep this in mind when creating content for your site. Content is the cornerstone to getting ranked on search engines and getting more traffic. Your content needs to be formatted not just for humans, but for computers as well.

As this is a series about learning SEO and not HTML, I won’t go much deeper into HTML. I’m assuming you’re using some form of Content Management System with a ‘What you see is what you get’ editor. If you’re interested in a deeper understanding of HTML there are limitless resources online. Here’s one to get you started: W3 Web Standards Curriculum.

Ok, so we know our content on the web is formatted with HTML, which describes the content.  We know the HTML should be semantic-that is-it should also describe the meaning of the content. So where do we go from here?

Content Hierarchy

Simple. Just make sure when you’re editing your content that you create the correct on page content hierarchy.

What do I mean by that?

Well, take a look at other pages around the ‘net. If you’re writing an article (like this one maybe), your content should have proper markup to signify it’s importance.

Your content will usually have one heading (<h1> tag) for the title.  You should also be using <h2> tags for sub-headings, <h3> for sub-sub-headings, etc. Text should be emphasized as needed. Lists should be marked up with the proper ordered <ol> or unordered <ul> tags.

This all may seem basic to you if you’re already familiar with HTML or even content writing, but you’d be amazed at the number of small business sites I’ve seen that are filled with huge walls of text. People don’t want to read walls of text and web crawlers don’t either.

That’s it for this week. I’d suggest exploring HTML markup a bit more, try starting with the resource mentioned earlier.

Homework Assignment: Take a look in your browser history at some of your recent searches. Pull them back up and look at the first few sites on each query. Pay attention to how their content is formatted. Pay attention to Headings, sub-headings, and their general content hierarchy.

Notes:

In a default install of WordPress you may need to click the ‘Show/Hide Kitchen Sink’ button to get all of your formatting features(headings).

Wordpress screenshot
WordPress Show/Hide Kitchen Sink
WordPress screenshot
Paragraph/Heading formatting options in WordPress

 

Drupal CKEditor screenshot
Paragraph/Heading formatting options for Drupal with CKEditor

 

Kdenlive multicam editing workflow

Kdenlive is a free open source video editor for GNU/Linux and FreeBSD.  It’s among my favorite editors for Linux and one of the many open source apps I use often.

Kdenlive doesn’t quite have the multicam editing capabilities that Premiere Pro has, but I’ve worked out a system to help edit multiple camera angles without losing my mind.  Often I forget these methods if  I haven’t used them in awhile, so I thought I’d share them here.

There is no dedicated mode to edit multiple synchronized clips like Premiere, but there are a few features which help enormously.  Admittedly, I haven’t used Premiere Pro in years, but I remember it  being pretty difficult to work in multicam mode anyways.

There are two main techniques I use when multicam editing.  Audio alignment and split view.

Audio Alignment

Since version 0.9 Kdenlive has had an automatic audio alignment feature. It’s very simple to use, although I’ve had some problems with it being inaccurate on longer clips.  This might have more to do with the audio sources being placed to far from each other in a crowded venue (thus they differed from each other too much).

To use it, simply right click your source clip(audio or video track), and click Set Audio Reference.

Next, right click the clip you want to align and click Align Audio to Reference.

Screenshot of Kdenlive

If you are doing any kind of multi-camera shoot it’s always good to use a clap board or at least clap in front of all the cameras a couple times at the beginning of your recording.  If the automatic audio alignment doesn’t work it will still be easy to align the clip starting points up by the claps.

Split view

Now comes a very simple method for viewing multiple video tracks at the same time.  No need to use any effects or compositing tricks, just use the Split view feature on the project monitor.

Make sure you are on the Project Monitor (view->Project Monitor if yours is off), right click and select split view.

Split view screenshot - Kdenlive

You may need to use proxy clips to be able to watch the clips smoothly.

From here, I’ll usually play it through and note which sections of each clip I like-either on paper or using Kdenlive markers-and then start cutting.

In the end, it’s really a pretty simple method, but I always seem to forget about Split view.

Kdenlive screenshot of split view
Example of 4 clip editing with split view.