Various HTML fixes

[chrisdenman]

Hi,

This PR contains:

• Quite a few HTML fixes to make the files more standards compliant
• Setting the height of an image to reflect the actual size (this will help with faster page layouts (no flashes)) + another for an image width declaration that was off by 1.
• Making links https instead of https
• Adding a .gitignore file
• A few JavaScript fixes to use e.g. const/let instead of var and, using === instead of == where appicable
• A couple of spelling issues

As part of this work and, to ensure that I've not regressed anything, I created a new project (test.learnyouahaskell.github.io) which is dedicated to functionally testing your site. This projects contains some standard stuff (checking links work, checking link text, ... ). Also, it goes through the site taking screenshots using both firefox and chrom (on Linux) at two different browser widths (860 & 1024 currently). Then, I use ImageMagick to compare the screenshots from the PR branch with that from the live site.

I ensure that the screenshot directories contain identicall named files. After that, if the ImageMagick image signature for a screenshots indicates that there is a difference, I create a flicker image (animated gif) to easily check the visual differences.

Please find these flicker diagrams attached. There's nothing major. They show the two spelling instances, the image height correction and a similar image width correction.

I have not checked in the functional testing project yet... I want to tidy it up a bit more before I do, it's a little invovled and has no documentation presently. I hope to complete that this weekend. As part of getting the project onto GH I shall ensure that we have a complete set of screenshots of the current production site that we can use as a base going forwards.

I hope you find this useful. I think it will be useful going forwards for generating the site from markdown should that be an aim people find useful.

Thanks! Any comments/suggestions will be gladly received.