Last Updated on May 17, 2023

Build a Website Using Only HTML and CSS

As you can see, I was hoping this post would appeal to as many interest groups as possible, while covering my bases with top ten keywords, right? The only thing missing is something about Christmas. I should have added, “at Christmas”. My intention was honestly far less premeditated.

There are 19 days left in 2022 as I write this, and I just finished teaching a five-day intro HTML/CSS course. And there’s your catalyst. I have taught one-hour classes, three-hour classes, one-day classes, three-day classes, even four-week long classes. I haven’t taught HTML/CSS over 5 days though. And, as a New Year’s resolution, I need to post more about HTML and CSS. That’s on my resolution list.

Why HTML is Important to Our SEO
Wait! What? Google Changes our Content?
We’re all Just Basically Kind of Lazy
Tools are Those Things that Remind Us to be Humble
You Don’t need a KitchenAid to Craft a Meatball
Tags – click for more posts on these topics

This Post is More than Just SEO Linkbait

… However, HTML is GREAT for SEO. Just scroll down a bit.

I teach, I write, I cook, I do a lot of things. I went to a chefs school. I put in the years as both a chef apprentice and later as an apprentice web designer. In the 80s and 90s, I chopped many cases of mushrooms in the kitchen and later built many an animated GIF banner in the agency. I’ve seen things. Now I teach. A lot. Online teaching is a thing, and I’m right there, sharing what little I know. And, what I don’t. Let’s be honest, there is a lot I don’t know.

I do know one thing though. I prefer the years of standing in a classroom teaching WordPress or Drupal or HTML or how to make a chocolate cone from baking paper and dark chocolate to sitting in front of a screen trying to calmly explain to someone how to unpack a zip file or click on that thing, to the right, the other right, next to the words “Click here”. I like to move around in a classroom. I need space to unfurl.

Why HTML is Important to Our SEO

1. Title-Tag

<title>This is what you hope to see in large, blue, letters in the Google SERPs - unless Google has found something better.</title>

2. Meta-Description

<meta name="description" content="This is the description you hope to see in the Google SERPs. Unless Google has found something better in your content." />

3. Head-Tags (H1 & co)

Your headlines should not only give search engines and your readers a structured outline of your content, they should also be eye-catching and problem solving.

“6 Travel Tips for Conference Goers: Tips 1 – Be Prepared” is much better than “Tip 1: Be Prepared”.

HTML helps us structure with the H tags. H1, H2, H3, H4, H5, H6.

4. Alt-Tags with your Images

<img src=”https://warrenlainenaida.de/wp-content/uploads/2022/09/warren-laine-naida-digital-consulting.webp” alt=”A photo of Warren Laine-Naida consulting with a client”

5. NoFollow Tags

NoFollow tags help us let Google & co know which links they should follow and which not. It also gives us a better view of how many backlinks we ACTUALLY have. Got 5000 backlinks but only 76 other domains are linking to you? Then you obviously have ally our internal links set to DoFollow. Fix that.

6. Links and Anker Tags

There is nothing better for OnPage SEO than good internal linking. Some of that, especially for long blog posts like this, can come from anchor tags. Use them! Keyword placement, right?

Wait! What? Google Changes our Content?

Google switches out our page titles and descriptions for something they find better.
When someone searches for something, and this information is not found in a format Google believes will encourage the searcher to click on a SERP, Google will reformat the page title and description to fit the search intent better.

What may be seen as a blatant disregard for our content, on the one hand, may be seen as a blessing in disguise.

Google takes the information from the page – often creating a description from more than one sentence, often reordering or replacing the words in our page title with
others from our page.

A study by Ahrefs in 2020 showed that over 60% of top ten websites had the description changed by Google. It happens to all our websites. I’ve seen it happen on my website too.

Now let’s get back to HTML …

We’re all Just Basically Kind of Lazy

I recently taught a four-week WordPress course. I knew my students would like to use a lot of plugins and page builder themes. I did too when I discovered them. Sort of. I went through a phase where I refused to use a CMS. Really! I was a purist.

The class included a full day learning HTML and CSS. There is a day looking at UX and UI. Another day looking at SEO and the importance of landing pages. There is beauty in understanding the WHY and the HOW. There is great satisfaction in typing a few characters into a text file and having them form an actual document which for want of a better word, is actually a web page.

When I was younger, I too drooled over the tools of my trades. At the agency, sweating over my HTML, I lusted after Dreamweaver. During my years in the kitchen, I grew visibly excited at the thought of the Hobart range of kitchen appliances (industrial-sized). I glared and fumed when my managers both culinary and web forced me to use my hands to flute mushrooms and code HTML tables when I KNEW there were tools that would do both faster and easier. Why did they do this to me when there were perfectly good machines available?

I think the human race made a big mistake at the beginning of the industrial revolution, we leaped for the mechanical things, people need the use of their hands to feel creative.

Andre Norton

Tools are Those Things that Remind Us to be Humble

If you are to learn respect for your tools, you need to walk a mile in their shoes. Really. I mean, will we ever understand what a plugin really does if we haven’t tried to program one ourselves? No. Will we ever respect the baker if we have not ourselves tried, and failed, to bake a cake? Never.

I have baked a lot of cakes. I’ve also built more than three hundred and fifty websites in the thirty years I’ve been building them. That’s only about ten a year. Come to think of it, it’s not that many. I still have one website that is static HTML – that’s the one linked with the cakes. I wouldn’t have it any other way. It is a website that lives or dies by my hand. Not a plugin nor a theme nor a CMS has it felt, nor shall it. It is my pride and joy. The latest iteration of a website that I first published in 1994 on the pages.vossnet.de system here in Germany. My first website. I still prefer to make my cakes from scratch and by hand too.

“Wondering if you should learn HTML? If you’re interested in designing websites, the answer’s a resounding yes! HTML is one of the cornerstones of web development, as developers use it to structure a website’s content. Essentially, it’s the code that dictates where all the website elements are and how they appear to the user.” codecademy

HTML Task 101: Do Try This at Home!

Do this: Open a .txt file. Type the following into it: (Yes, type it. You can’t get your hands dirty without touching something.)

<html>
     <head>
          <body>
            <h1>My First Website</h1>
               <p>This is my first paragraph in my first website.</p>
               <p>Holy crackers, I did it again! I can make websites!!</p>
          </body>
  </head>
</html>

Save the .txt file as a .html file. Open that in a browser. Cool, right?

You Don’t need a KitchenAid to Craft a Meatball

While I was studying some of the early versions of Flash, Photoshop, Fireworks, Image Ready, and others during the day, I was catering parties and weddings at night. Everything from pates to cakes to little meatballs stuffed with goat cheese and tossed in chocolate nibs came out of our tiny kitchen in the Schwabing quarter of Munich. We didn’t own a food processor. I had a lot of knives though. We managed. My hands and I.

It’s incredible just how much our hands do in a lifetime. They help us realise those ideas we have from the skills we have learned. One day we won’t even need to click a mouse though. We will just call over to Alexa or Siri to order something from Amazon for us. Our hands will lose their function, as over time will our feet and legs from extended periods of sitting in a comfy chair glued to a VR headset.

I have to admit, after my rant about honest toil, that I haven’t touched a typewriter in decades. All of my books have been created on a laptop. My early term papers were written on a typewriter, and my later ones were done on a tiny, boxy, Macintosh. I would like to write a book with a typewriter one day. Soon. While my hands still work.

A man who works with his hands is a laborer; a man who works with his hands and his brain is a craftsman; but a man who works with his hands and his brain and his heart is an artist.

Louis Nizer

With thanks to Thom Milkovic for the image from Unsplash https://unsplash.com/@thommilkovic