Day: March 5, 2015

General SEO Principles

Getting Your Website on the First Page on Google

This will be a short and sweet post. Below I outline some good SEO principles to keep in mind when developing a website.

1. Understand what SEO actually is.  Search Engine Optimisation (SEO) is the technique in which web developers design websites so that search engines have a greater chance to find and rank your site higher than the millions of other sites in response to a user’s search query.

2.Include the “alt” attribute for each individual image on your webpage. The ALT tag ensures that every image has a relevant textual representation within my website, therefore providing more valuable content to the search engine. Ensure that there is also good content surrounding the image on the page; a factor that the search engine algorithms consider.

3. Content is king.  Include valuable and meaningful content on the actual pages so that the search engine algorithms can identify primary keywords and keyword phrases. Google (and other search engines) will lower your rank for trying to ‘trick’ the search engine, so avoid using techniques such as entering a bunch of unrelated of keywords in your website.

4. How long does your page take to load? Search engines like Google for example analyse the amount of time it takes too load your page. Search engines consider page size to be important due to the ever increasing number of users who choose to access the web via smartphone/tablet, etc. It is becoming increasingly rare that a user will solely depend on their wired PC connection at home to view pages on the Internet.

5. Utilize CSS as much as possible. CSS (Cascading Style Sheets) allows you to separate the content of the webpage from the display of the web page. This idea follows on from the aforementioned points about speed and ‘search engine friendliness’. By defining your styles once in a separate CSS style sheet, you can apply these styles to every page with one line of code. Not only is the code more ‘clean’ to the search engine, it also reduces the amount of code contained in each HTML document, therefore improving download speed.

Hope this helps!

roman empire map 117AD

HTML Image Maps

The Beauty of Clickable Maps

Most of you are probably aware of HTML Image Maps. It’s where a standard HTML image has clickable sections that act as hyperlinks.

Here is an example that I whipped up a few years ago (on the homepage): http://homepage.cs.latrobe.edu.au/mj2romeo/assign/assign.php

The code is reproduced below:

<img src="map.png" alt="roman empire map 117AD" usemap="#empire" />
<map name="empire">
<area shape="rect" coords="362,403,431,424" alt="Rome" href="rome.html" />
<area shape="rect" coords="727,626,782,687" alt="Petra" href="petra.html" />
<area shape="rect" coords="831,396,884,445" alt="Armenia" href="armenia.html" />
</map>

You might be wondering how to determine the coordinates. For rectangles, you need to provide four coordinates. The horizontal position of the top-left corner, the vertical position (from the top of the image) of the top-left corner, the horizontal position of the bottom-right corner and the vertical position of the bottom-right corner.

Image maps can cause significant accessibility problems (and can be hard work to maintain), so you should restrict their use to places where they are really appropriate, such as (surprise) a map, where clicking on the parts of the map gives information about the relevant area. If you plan to make an image map out of a list of words just to make your navigation prettier, then you are using them for the wrong reason, and you should use a normal list styled with CSS.

Please note that you can also use different shapes as clickable areas besides rectangles (e.g. circles, polygons).

Simple PHP Hit Counter

No need for a service when you can do it for free!

On many pages it is common to have a generic hit counter displayed at the bottom of each page. Now it goes without saying that this is a very simple metric that arguably has zero intrinsic value. If a user spams F5 on your beloved homepage (or a sneaky web dev wants to impress his friends), this piece of code will just keep incrementing its value.

Of course, these days there’s tons of tools available to analyse web hits from various dimensions – hits by the country, unique hits, hits by second/day/month/year/etc.

Nevertheless, sometimes you just want to whip up a quick script with 0 effort.

The code is below:

// open file
$fp = fopen("hitcount.txt", "r");
$count = fread($fp, 1024); 		// grab current hit counter value
fclose($fp);
$count = $count + 1;			// close file and increment counter by 1

// Display the number of hits
echo "Page views: $count";

// write new counter vale to file
$fp = fopen("hitcount.txt", "w");
fwrite($fp, $count);
fclose($fp);

Enjoy!