Lab Work - 21/09/2017
Part II - 1: Using <meta> in a HTML5 page<meta> tags are used to provide information to search engines in order to help them index and rank results of searches performed. These tags will never be seen on the front end of a web page as they are contained within the <head> tags.
Four typical uses of the <meta> tag can be described using the following elements:
- "description": This is used to describe the HTML document.
- "author": The name of the author of the HTML document.
- "keywords": These are comma separated words which help categorise the document and tell search engines specific terms which should be associated with the HTML document.
- "viewport": This gives the browser information on how to scale the webpage according to the device being used to view the webpage.
Part II - 3: Sample Code From FishCreek<head>
<title>Fish Creek Animal Hospital</title>
<meta name="description" content="Animal Hospital and Clinic">
<meta name="keywords" content="Vet,Veterianrians,Animal,Clinic, Hospital">
<meta name="author" content="Stephen Stenson">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="styles.css" rel="stylesheet">
Part III - Search Engine Optimisation (SEO)
|A diagrammatic representation of the workings of SEO - in flat design format no less!!|
1. Future proof by thinking mobile
Not only is it a good idea to design a website by using mobile first and then scaling up for practical coding purposes but it seems that Google have now made the commitment to begin to index web pages using mobile sites as opposed to desktop versions.
This means that both desktop and mobile websites will be ranked using the mobile version thus massively increasing the importance of the mobile friendliness of websites. This can be achieved by using the various tools to help your website become more mobile friendly, for example: https://search.google.com/test/mobile-friendly
As Google is the most popular search engine by quite a long way, I see this change as hugely important to web developers and it should radically change their approach if they previously developed with a desktop-first style.
2. Ensure all your pages are indexed
As obvious as this may sound, it's often an overlooked important step to ensure you're as searchable as possible!
The process is simple: subtract the total number of pages on your site you don't want indexed from the total number of pages on your site - this gives you the total number of pages you want indexed.
Use a tool like Website Auditor to see how many pages you have indexed and if there's a disparity then you need to take action to ensure the pages which should be indexed are indexed.
3. Make sure your page speed is optimised
Not only does page speed affect your UX and therefore likelihood of users returning to your website, Google are also obsessed with speed. They have included a signal in their search algorithm which affects site ranking by measuring how fast a website responds to web requests.
As the world wide web gets larger and sites become more process heavy, speed is becoming more and more a priority. Tools like Website Auditor (linked above) or Google's own PageSpeed can give you an indication as to how well - or badly - your site's speed will affect your page ranking.
4. Optimise <meta> tags for greater searchability
As outlined earlier in this blog, <meta> tags are important as they enable search engines to quickly and efficiently categorise your website without needing to crawl through tons of data to find keywords and descriptions etc.
Using the correct <meta> tags in smart ways can make a huge difference to SEO. For example, the "description" <meta> tag can affect your page ranking. Google recommends using a unique description that is human readable and diverse in order to maximise the effectiveness in the ranking algorithm.
Finally, using the <title> tag to appropriately describe the website is the most important on-page factor for search engine optimisation.
Follow me on Twitter: