eLearning Toolkit: Web Design and HTML Authoring

Working towards my upcoming second assignment, I have spent the past few days experimenting with the “Web Design and HTML Authoring” section of the eLearning Toolkit. I primarily used the present blog to test the different requirements related on the site, Web Pages That Suck (WPTS). I felt that using the present blog was a more realistic endeavour in the activity context than designing an new site from scratch that completely avoided the 248 “Mortal Sins” provided on the two different WPTS checklists (One, two), although I will certainly consider these checklists going forward from the present blog and when creating new pages in the future.

I have learned a wealth of information through engaging with this activity – I always understood that it is complicated to build a webpage that doesn’t “suck,” but the list of suggested and discouraged elements is very extensive and includes common mistakes as well as platform-driven “mistakes.” For example, the purported WPTS requirements are not always available through standard themes or templates available on WYSIWYG software.

In addition to working through the WPTS checklists and informational videos, I used three online evaluation tools:

WPTS asserts that if you suffer from any of their 248 listed maladies, your webpage sucks. I found some interesting analytical information from the activity ranging from “doh!” to “oh!” to “….oh?”– for example, my blog did not have a meta-title (now fixed), not all images had alt-tab data (now fixed), some of the images were not optimized (now fixed); and I used some options, such as drop-down menus and theme-specific elements that are not favoured by the webpage designers that write the content of WPTS.

There are many other questions surrounding the choices for web design as compared with the 248 sins of WPTS. I do not have a white or off-white background, but I do have that where there is text. Much of my text is not black, but it is dark grey. My home page has a different layout than the other pages – although all of the others are standardized. The WPTS lists are heavily interspersed with humour, which I can see as being helpful for avoiding a schoolmarm advisory image. While they provide many hard guidelines, I feel that some of them are open to the varied experience of the web.

Just as there are student personalities, there are also designer personalities. As there are 248 sins provided by the writers of WPTS, I imagine there is also some debate at some of the suggested thematical elements. I was up for the challenge of fixing the code to refine what was available using the WordPress WYSIWYG editor, but it appears that some elements of my chosen theme are not adaptable by theme users on WordPress. I have decided that the benefits of keeping my chosen theme, for the layout and the responsiveness to mobile devices, outweighs some of the  WPTS-identified sins.

One of my bigger surprises in this activity related to the filetype for images. I was under the impression that .png filetypes for images were the current preference for images hosted on websites, and as such, when I created by header image I saved it as .png. I can’t positively identify when I first developed this notion, but searching for the answer provided the source conveniently illustrated in webcomic form:

Debate about the benefits of JPG or PNG. JPG is better for photos, PNG for non-photo images.

JPG or PNG? (Click on image for article)

I specifically recall reading the article associated with this comic in the past during my MET program, and as such, I can see where I erred in my decision process. This being said, I had never analyzed webpages using the sorts of tools identified in this eLearning toolkit activity. So, lesson learned.

In sum, this activity was fully invigorating and will inform my creation of websites in the future, beyond merely the upcoming introductory Moodle module.

Tagged with: , , , , ,
One comment on “eLearning Toolkit: Web Design and HTML Authoring
  1. John P Egan says:

    Excellent 🙂