Web Development
Search Engine Optimization (SEO) is important to any website. Being able to show up in the top of search rankings heightens visitor traffic to your site and may have a significant impact on conversions–sales, subscriptions, and so on. While content has an enormous impact on a site’s ranking, one of the factors you may not consider is how the code itself may affect it. HTML5, while not fully supported in all browsers, can be helpful in getting search engine’s “spiders” to rank your content as more relevant.
What’s going on now?
HTML is not a programming language. It’s abbreviation gives it away as “hypertext markup language” which is a fancy way of saying that it tells your browser how to display the information–kind of like a graphic designer might layout a page, adding images and breaking text into paragraphs and headings. What search engine spiders (a.k.a. bots or crawlers) do is feed that information, gathering relevant bits of text so that the search engine can feed that, plus some other factors, into an algorithm which ranks your website accordingly.
In HTML4 –the version currently supported by all major browsers, though Internet Explorer is debatable sometimes (ha ha)— div tags are used to denote sections of the page–perhaps for styling reasons, or so the designer/developer can tell where he or she is. This is an example (though not the full markup for the page) and I have added comments to mark the end of divs:
<div id=”header”>
<h1>Page Title</h1>
<div id=”nav”>
<a href=”http://blog.jpdesigntheory.com”>Link to somewhere</a>
</div><!–end nav–>
</div><!–end header–>
<div class=”article”>
<p>This is some important main content–perhaps a blog post, or just the main portion of the website</p>
</div><!–end article–>
<div id=”sidebar”>
<p>This is not a portion of the main text.</p>
</div><!–end sidebar–>
<div id=”footer”>(c) 2012
</div><!–end footer–>
Did that take you a minute to get through? Imagine if I hadn’t commented–would you have been able to understand as quickly what was going on with the code? Admittedly, a spider is designed specifically to glean information off of a webpage, but it might not most relevant content. Also, in our example, our divs had relatively easy to understand names and was commented, which is not always the case and makes the interpreting job that much harder.
How does HTML5 change that?
With HTML5, the generic div is joined by a myriad other descriptive tags. These tags are used for areas found on most websites–like headers and footers . Here’s that same markup again in HTML5:
<header>
<h1>Page Title</h1>
<nav>
<a href=”http://blog.jpdesigntheory.com”>Link to somewhere</a>
</nav>
</header>
<article>
<p>This is some important main content–perhaps a blog post, or just the main portion of the website</p>
</article>
<aside>
<p>This is not a portion of the main text.*</p>
</aside>
<footer>(c) 2012</footer>
*Note the change from id=”sidebar” to <aside>. <aside> merely denotes an area that is not part of the main content, which could be a sidebar.
See how much easier that is to follow? The same is true for search engine spiders. They are able to identify exactly what is important and what might be lesser content on the page.
Because neither version of our example has any styling information, both would display (in an HTML5 supporting browser) as:
It has no impact on mere mortals not viewing the site’s source code, but can make life easier for developers and spiders alike.
It should be said that HTML5 is not yet supported in all browsers, so I wouldn’t recommend dropping HTML4 immediately. However, as browsers update to support these new tags, it is beneficial for business owners, site creators, and SEO ninjas alike to be aware that content might be king, but code is still the poet laureate.
About Design Theory, All Posts, Branding, Content & Copywriting, Marketing, Social Media, Web Design, WordPress
Even those who have great aptitude in writing sometimes find themselves with literally NO WORDS! Unlike our verbal language, writing is actually one of the most difficult activities that we humans use to formalize communication sin la boca (without your mouth if you don’t speak Spanish). It sounds simple but as Wikipedia has defined it: writer’s block is “a condition, primarily associated with writing as a profession, in which an author loses the ability to produce new work. The condition varies widely in intensity. It can be trivial, a temporary difficulty in dealing with the task at hand.” Uh, yeah- I couldn’t have said it better. But what does one do when the deadline is looming and the children are to bed and it’s man vs. machine and you realize…I’VE GOT NOTHIN’! Thank God writing pro’s like Mike Rose (famed UCLA Graduate School faculty member and author) even acknowledges that it truly is “an inability to begin or continue writing for reasons other than lack of basic skill or commitment“. Whew…I’m off the hook a little! But now what do I do about it?
Why do you we do this to ourselves…it‘s supposed to speak back to you right? Like in some gone from a book to the big screen movie—the leading character is some highly paid British actor/actress paid to throw their laptop out the window of their 5th story NYC walk-up in utter despair. Yeah…in the real world most of us don’t have the kind of money that allows for those despairing moments. So I have opted not to spend hours wasting good wine or time employing this useless tactic. Instead I think it’s best to stare at something else. Walk around your house- look at some pictures, clean, cook, do a little laundry or run an errand. Heck, play with your kid or a game of chess with your spouse. Do something else besides stewing in the quagmire of I have no clue. You would be amazed how making the best salmon with a lemon dill sauce can jump-start a blog idea. Personal Example: One day I was frustrated about a concept I dreamt about (and DID NOT GET UP & WRITE IT DOWN.. I know bad, bad, bad) and was about to scream when my daughter asked me to color with her. As I was taking note of how precise my “staying within the lines” was and how the unbridled charm of a child’s Crayola skills were, yes the cliché lightbulb went off. And before you knew it, while she was still coloring outside the lines, I was pecking away on my laptop. Writers cramp over came writers block and I was grateful for it.
You know what they say in real estate…Location, Location Location. And I agree. After a very busy weekend and stressful morning 
I found myself not able to color in anybody’s lines or muster up enough energy required to even stare at a blank page. So what else could I do to get the boost usually relegated to a high-priced cup of Starbucks coffee? I went outside. Yup in the lovely 70° weather, I listened to the sounds of a almost perfect May day in Connecticut. And before I knew it, several titles/concepts came to me which enabled me to write this blog AND birth 2-3 ideas for some other projects. Fantastic right! Sometimes a simple change of location can do wonders for inspiration. Being jailed at your desk is not worth it when you can get some fresh air and use the objects/sounds/feelings around you to motivate your imagination. Like an artist who can use a host of colors or materials to create their masterpiece, so can writers. And I’m not talking laptop vs. plume…I mean what you use to connect ideas/concepts/words together to tap into your linguistic intelligence and unlock the door to your next novella. 
1.) Interview a customer about particular concerns/challenges as well as solutions and then blog about it. I’m sure they will love the attention & it gets their name advertised in social media for free. Or you can opt to share an anecdote about an issue that occurred in your own business, from the problem to the solution.
2.) Dialogue with industry-friends via social media and let the responses shape a blog post or video blog with them weighing in on topics relevant to industry news items.
3.) Consider product or service comparisons, a Consumer Reports of sort but on issues like social media, graphic design, use of WordPress themes vs. traditional HTML websites.
4.) Report on a conference or webinar you attended giving perspective to real issues facing people in your own industry or some great highlights and tricks of the trade that you learned.
5.) Address customer questions you’ve received on the same topic/aspect of service. This lets them know that you’re listening and are willing to receive feedback once it’s out on the www.
6.) Expand upon a comment you wrote on someone else’s blog & parlay that into your own blog post. Tread lightly here, these are your peers after all. But bringing in a different angle never hurts.
7.) Correlate what inspires your daily life into the business world and create a blog connection. Hence, look out for my upcoming blog “Coloring In and Out of the Lines in Social Media” – thanks to my daughter’s crayons.
All Posts
Indeed! A Meta Tag? Sounds like some very technical lingo us mere mortals only know if we are in the “web biz” or subscribe to Wired magazine. So here’s the answer…Meta Tags or Title Tags are HTML code or word tags which instruct the search engines,aka Yahoo, Google, etc., to “spider” your site. Ok here it is in my jargon without the MIT degree: keywords or descriptors that are in the background of your website which make the title of your business or what you do, easily searchable on the web…Ta Da!
Optimization: Ok what’s with the big words right? Web optimization is the process of making a website & its content as easily searchable as possible and the words used to describe your website effective. Title Tags and/or Meta Tags (stop frowning-go back to paragraph one for a minute…see, all better) are very important for a consumer or other businesses to find your website within a certain number of search results. It’s like bronze to gold medal ranking in the WWO – you know…the worldwide web Olympics. And honestly we all want the gold right?
So what’s the point to all this? Meta Tags help the search engine match the keywords to a relevant page on your website each. That’s why each webpage of your website needs to have customized Meta Tags that are optimized for specific keywords. Better tags, better results, more access to your website, more business, and the crescendo goes to…more money. Yes, we love the last one. So the point is to make your website work for you, literally. I mean isn’t that the point of having one anyway?
*P.S. Meta Tags can be used in blogs or various other forms of Social Media too.
Web Development
The other night, I made my browser draw a circle. To be honest, there was more to it than just that, but that’s what my fiancee saw, and she–being an “end user” of web technology– was nowhere near as impressed as I was.
I’m talking, of course, about HTML5 Canvas, the ability to essentially “draw” on an area of the browser. This has the potential for a bunch of cool things, including games or web applications. In fact, HTML5 and CSS3, which are still technically “in development” have the potential to allow for a lot of innovation to the web.
Which brings me to my point–users, whether they are clients or family members, will probably not understand the significance of HTML5 Canvas or geolocation, but there are certain times when they should be made aware of the benefits of newer technology. This could be explaining to a client the benefits of HTML5’s markup (particularly on a static site they update) or sharing an HTML5 based game with someone in your family. While they may not fully appreciate all the features of newer technology, they may be able to see how it benefits them and appreciate the smaller bits–especially if you make it relevant to their situation and keep the explanation short and simple.
The fact is that technology will always be changing and evolving. The web isn’t any different. Being able to understand and share these changes is one of the great parts of being a web developer.
I drew a circle. Want to see?
All Posts, Web Design
“Hey remember me? We haven’t talked in months. Domain Tools says I haven’t been updated in 7 months. People are visiting me and apparently my content isn’t as relevant as it was when I was first built.” Well I could go on about what most websites scream when visiting them. From the ones with missing or incomplete addresses, web forms that error when you hit the submit button, to the prices that are out of date or don’t match what was quoted on the phone or in the store, misspellings and grammatical errors. If I’m hitting a soft spot, don’t feel too bad, it’s quite common.
One of the main things I stress to our clients at Design Theory, is that your website should never lay stagnant. We should be updating it regularly with fresh content. If you have a promotion going on, it should be on your website in a predominant way to attract your visitor’s attention. If you lowered or raised the prices for your products, that information needs to updated immediately or else you could cause some trouble. You have a professional website, don’t make it look cheap with misspellings and small errors. You could be losing valuable business. Web forms are the silent killers too because unless you go in and check regularly, you may not know that it isn’t working properly.
So in the spirit of love, we compiled a list of resources for you to use with your website for FREE!
Vector Icons: Icons can dramatically improve some graphic elements on your website. Especially when you don’t have the budget for a graphic designer to create a bunch of small graphics for you.
Facebook and Twitter Plug-ins: If your website isn’t “social” it needs to be ASAP.
Analytics: If you don’t know how many people are visiting your website, which pages are most popular for their content, your bounce rate, and referral links, I’m here to tell you to put some love into your site tonight and check out Google Analytics.
Call to Action: Normally you’d find a good call to action on a strategically typed and keyword-filled landing page, but you can also have these on your website’s home page. However you use them, use them. Encourage your visitors to give you their contact information in exchange for something of use to them.
Have any other Website Valentine’s Date night items you can “talk” about with your website? Share them in the comments field below.
