Essential Ingredients in any Website or Blog

Nowadays it’s an undeniable fact that most businesses, nonprofits and freelancers can benefit in many ways by adding a website to their overall brand strategy.

It’s pretty safe to say that by now most people and businesses are aware of the more basic ingredients that should be included in any website or blog. For example, you need to include some type of header and footer area, a way for readers to identify your brand, create helpful content, and to also provide some way for users to easily search through your website.

It is also important to be crystal clear on what you do, what your company is about, and what specific services and products you offer. With only mere seconds to grab your reader’s attention, it is essential to clearly and concisely lay out who you are and what your business does – and to do this right on the main page of your website. Don’t make potential customers hunt around to learn more about you.

You probably also know that your website needs to be designed responsively – to function well and look great on all different types of devices, viewports, screens and browsers. This functionality usually comes built into the web CMS (content management system) that you’re using to create your new site, and it should come already built into whichever theme you choose.

Beyond these core ingredients that every website should have, there are several other essential things to also be aware of and to incorporate into your website or blog.

Among them are:

1) Navigation that is intuitive and easy to understand
2) A clear call to action (CTA) or two
3) Attractive graphics and photos that are used sparingly and tastefully
4) Customer/client testimonials
5) SEO (search engine optimization) techniques
6) Accessible content that is consumable by everyone
7) A few key legal pages

 

 
website menu icon

1) Keep your navigation areas simple, intuitive and to the point:

Try to keep your website’s navigation area(s) as simple, clean and uncluttered as possible. Your main navigation should be clearly visible from every page on your site. You should have your main pages and your most important sub-pages listed in your primary navigation menu. If you have a very large website avoid listing out every single page of your site in your main navigation (you can always do this instead by listing out all of your pages on a site map file).

Limit your main navigation section to 6 to 8 top-level items (at the most). Place your Contact or Contact Us link last, ideally near the upper right corner of your site. The most important sections or pages of your website should be placed at or near the beginning and end of your navigation list. Use breadcrumbs when possible to help readers stay oriented, especially if your site is very large.

Also, try not to include too many other links to various outside websites and sources directly within the content of your home page. This can confuse your reader and it also leads them out of your website right away. Use sidebars and side menus sparingly.

The goal is to entice your reader into your website or blog and to encourage them to explore it further. Try not to visually assault your readers with a hundred links right off the bat on your main page. In my years of developing websites, I’ve seen plenty of homepages that are absolutely littered with links, icons, clipart, sidebars and CTA’s. For example, many of the public library websites I’ve seen fall into this trap.

Just keep it simple.

 

call-to-action button example

2) Include a clear call to action (CTA) or two:

Make it easy for a visitor to your website to contact you. It’s a good idea to include your contact information near the top of your site, possibly in your main navigation area, and definitely include your contact info in the footer so it will be visible from every page on your website. The footer is also an ideal spot for a short marketing blurb, summarizing your product or services – or to remind your audience about a special deal you’re offering.

Make it clear what else you’d like your visitors to do besides look around. Are you asking them to donate time or money to your non-profit? Would you like them to click a button to schedule a free initial consultation with you? Do you want them to sign up for a seminar or event? Purchase a product from you? First make sure this is clear in your mind, then make it clear for your readers.

You could also offer some type of freebie such as a downloadable PDF file (chock full of useful info written by you). Usually this is done when your reader clicks on a link or button, they are directed to a landing page and are presented with an enticing offer of free content. Then, in order to receive that content, they type in their email address. In turn, your freebie is sent to their email inbox. Now you have their email address, if you’d like to correspond with them through some type of email newsletter.
 

 
pumpkin-cat

3) Add attractive graphics and photos; use them sparingly and tastefully:

Whether you have a website or a blog, photos and other graphics can play an important role in setting the tone and in conveying important information. If your text or blog articles are lengthy, adding an image here and there also gives the reader’s eye a much-needed rest. Infographics can be used to sum up and reiterate key information from your text or tabular data.

However, images can be overused – leading to a disjointed and interrupted reading experience. Plus, too many large illustrations or photos will slow down the time it takes for your webpages to load into the browser. Again, keep it simple and tasteful. And use your own photos and graphics whenever possible, if you have access to a high-quality camera.

Ideally your photos, illustrations and icons should relate directly to your textual content, serving to support and reinforce the ideas within your content. To illustrate the opposite of that, I included a little pic of my cat Pumpkin here! He has nothing to do with this article… but isn’t he cute??
 

Anyway… if photography isn’t your thing, there are several stock photography sites available where you can create an account, in some cases pay a fee, and have access to millions of photos, illustrations and icons. Shutterstock comes to mind in this case. There are also many free stock photography and illustration websites out there to choose from, such as:
 
• Pixabay
• Unsplash
• StockSnap.io
• Pexels
• Reshot
• FreeStocks.org
• Freepik
• PXhere
• Wiki Commons

In some cases, these stock photo/illustration sites may require or request that you give credit to the individual who took the photo; in other cases, this is not required (but is nice to do anyway, as a courtesy to the photographer or illustrator). Another possible source for photos is Flickr where you can find plenty of images you can use if you adhere to the rules behind the Creative Commons license.

I personally use Pixabay the most often when I need a free photo and am very happy with the selection and quality of the photos there.
 

 
speech bubble

4) Include customer/client testimonials:

One of the most important things to include on any business website are customer recommendations or testimonials. This form of social proof has been proven effective in tipping the scales in favor of businesses and freelancers who use it. Potential customers love hearing an honest viewpoint from others who have had direct experience with your business. This builds trust and authenticity, and helps your reader get to know you through the viewpoint of others who were once in their shoes.

If you are able to include specific information about the individuals providing you with testimonials, then by all means include that right on your homepage. If you have the information, you can include the person’s name, business, website address, and possibly even a small photo of them. Of course, be sure to get their permission first before posting a customer’s testimonial on your website (and before posting it anywhere else).

There are many ways to feature a client testimonial section on your website or blog, ranging from simple to quite complex. To keep it simple, you can break out your client’s recommendation into a blockquote (using this feature of your CMS editor, or by pasting your text inside the <blockquote> html tag, if coding it from scratch). This separates it out nicely from your other content.

Or if you’d like to get fancy, try one of the multiple different testimonial slider (or slideshow) plugins that are available for free. I’m particularly fond of the Ultimate Responsive Slider (UR Slider) plugin for WordPress (by FARAZFRANK). Plus if you’re a developer, it’s always fun to hand-code sliders using html, css and possibly JavaScript.

Most people are happy to provide at least a short testimonial – it makes them feel valued and important AND it could also be a source of a new backlink pointing to their own website. (more on this in #5 below).

Usually all you have to do is ask!

 

 
search results

5) Apply at least basic SEO (search engine optimization) techniques:

Keep SEO in mind from the very beginning, when you first begin to develop your website and create content for it. SEO should be strategically coded directly into your content. Do this by including relevant keywords throughout the textual content on your home page and throughout your entire site. Keywords should fit into your content organically, though. Avoid using your keywords over and over (called ‘keyword stuffing’) if it interrupts the flow of your content. Search engines pick up on this and can actually penalize your site’s rankings in their search results pages.
 
Be sure to include the heading tags that search engines love, such as h1 and h2. Each one of your pages or posts should contain only one <h1> tag, as search engines are set up to look for one of those tags, and adding additional h1’s might confuse the search results. It’s a good practice to use heading tags in a hierarchical manner, with h3 tags nestled inside h2 tags, for example.

Take care when creating your page titles and filenames (sometimes known as “slugs”), as this is an excellent opportunity to rank for your target keywords. For example, if you own a dog daycare business, it’s better to use page titles such as “doggie-daycare/grooming/” as opposed to “doggie-daycare/our-services/”. Create a short list of those keywords that you think potential customers are searching on and include them right up there in your page urls. Include them in your image alt tags and meta descriptions as well.
 

Letters in file names should be all lowercase – and remember to use dashes (not underscores) in your folder structure and file names, with no spaces between words. Whenever possible, avoid using slashes or special characters in file and folder names.

 
Creating internal links (links on your website that take the user to other pages on your site) is good for SEO, and it keeps the user clicking around your website or blog for a longer period of time. Remember to include outbound links to other reputable, highly informative blogs and websites (because sharing is caring!). You might need to get permission first from the blog or website owner, though.

Also strive to cultivate inbound links (links coming to your website from other sites and blogs, social channels, etc.) as they are also great for boosting your site’s ranking with search engines.

 

website-indicators-for-accessibility-icon

6) Make your website accessible to everyone:

There are certain measures that you can take to ensure your website can is highly functional and usable by everyone, including users with disabilities. This means taking steps to optimize your site for different forms of user interaction: clicking with a mouse, touching the screen, using keyboard controls, and using voice-activated commands.

Creating a website that is accessible and user-friendly for everyone has many benefits, including:

• increasing the number of people accessing your site and consuming the information on it
• giving your site a boost in SERPs (search engine results pages)
• an overall better user experience for all users of your site, in addition to those with disabilities

Some concrete steps to make your site more accessible include (but are not limited to) the following:

• images should include an ALT html tag to describe the image. More complex images should include a caption next to the image
• videos should include a transcript and closed-captioning
• podcasts and other audio files should include a transcript
• provide the ability for users to skip your site’s navigational features
• allow users to experience your site through the keyboard, mouse, voice-activation and sense of touch
• ensure the ability for users to navigate through your site using only their keyboard’s Tab key:
when tabbing around to the different areas of your website, the user should have a clearly visible indicator of where they are on the page (this is often an outline that appears surrounding an element when it receives focus)
• set your language tag (this is located at the very top of the html code of your web page)
• all pages should include clear, descriptive title tags and links
• wrap a “label” tag around certain elements of your website, such as form elements
• any forms you have on your site should be fairly short, simple and easy to fill out
• include the ability to enlarge the text of your web pages
• textual content and headings should be highly readable and contrast/stand out well against the background on all pages (avoid the use of the color gray for large areas of text)
• in your website’s code, use semantic html5 tags whenever possible. Semantic tags are more descriptive for screen readers and for search engines. Example tags are: <button>, <picture>, <header> and <footer>

For more information, please take a look at the Section 508 accessibility guidelines located here, as well as the Web Content Accessibility Guidelines.

 


ASelfGuru legal bundle for your website

7) Set up a few important required legal pages:

Ok – you’ve come this far and created a website, blog or app and made it accessible. You’ve written some high-quality content, added a few graphics, and optimized your content and graphics for search engines. You might also have a few CTA links and buttons and – for the finishing touch you’ve included some type of social proof (recommendations or testimonials).
 
Anyone who has ever created or maintained a website, blog, app or even a social media account knows what a huge investment in time, effort, energy and knowledge goes into that whole process.
 
It is very important to protect that investment by creating and linking to at least a few absolutely essential legal pages.
 
Disclosure: There is an affiliate link below. We only recommend products, brands or services that we are personally familiar with and are very happy with!

It is recommended that (at a minimum) you should protect your online presence with the following 3 legal pages:

  • Privacy Policy
  • Terms and Conditions
  • Disclaimer

 

Thousands of online businesses have been audited and/or sued by the FTC (Federal Trade Commission) and other entities, businesses and individuals, for failing to disclose certain information or for neglecting to have the proper contracts in place. It is very important to make sure you’re complying with ever-changing laws and regulations surrounding consumer privacy.
For example, consumers need to be made aware of what information you are collecting through your website, how it is used, how you use cookies, your policy regarding third-party links, and much more.
 
For more info on the legal pages that every website or blog needs, we go into the subject in more detail in our article Easy, Affordable Ways to Protect Your Blog or Website Legally.
 
 
A few closing thoughts

Designing and building a truly informative, user-friendly and visually appealing website is an effort that can take weeks, or even months of planning. Besides the things mentioned in this article, there are many other factors that contribute towards a website’s effectiveness – such as the quality of your hosting provider and host server, how quickly your code and graphics load into the viewer’s browser, the quality of your website’s theme and code, and so on. But keeping these items in mind should help you on the road to creating an awesome website!


 

Affiliate Disclaimer: This blog is supported by its readers. This post contains affiliate links. If you use our links to purchase a product we may make a small commission at no extra cost to you. Thank you for supporting us at Create With Code Dragon! For more information read the full disclaimer here.