Landing : Athabascau University

Group members: this is the place for your learning diary. Use this to post your zipped-up site at least once each unit, and your reflections as often as you wish (at least once per unit). Please write your reflections directly in the post, not as attached files. Where you do need to attach documents, such as for unit 1 designs, use PDF, PNG or JPG formats. You can attach files using the 'Embed content' link in the editor.

QUICK COURSE LINKS:  Add blog post - Read latest group postsFAQs: Course process : Site design : HTML : CSS : JavaScript : JQuery : AJAX : MiscPodcasts for each unit

Updated resource pages:  Unit 1 - Unit 2  - Unit 3Units 4 & 5 - Unit 6 - Unit 7

mportant notice: the student web server is unavailable. Until this is fixed, we do not require you to upload your site to the student server. See Running a web server on your local machine for details of how to meet the requirements for the final unit

Unit 3

  • Public
By Brent Beaudry in the group COMP 266 October 26, 2020 - 1:38pm

The focus for the CSS unit was to develop a look that would be appealing to First Nations, because that segment of the population will be a primary target demographic. I chose to use colours of the medicine wheel (black, white, yellow, red) as well as cyan, which is close to turquoise, another popular colour in the indigenous culture. Due to the small number of pages required for the site (most of the weight will be in the back end – databases, etc) only one stylesheet was required. The look is minimalist with a subtle colour scheme. I chose ghostwhite for the background because it has a softer appearance than the stark plain white that is used in many applications, to make colours pop. For pages which children will be viewed by children for potentially extended periods, a softer appearance is required to reduce eye fatigue. For this reason, I used a gradient in the yellow of the head and red of the footer, as well as in the cyan of the nav bar. A simple, web-safe, non-serif font (verdana) was used for the ease of readability. I chose to make the main text content darkblue so that I could make the activity reading content stand out more (the reading text is black and bold).

For other styling, I added borders to the table on the client home page and styled the input boxes for size and added box shadow to enhance appearance. I also made the buttons (enter and send) universally cyan for ease of identification.


Finally, I made h1 distinct with a powderblue background, and added underline for h2 to add some visual organization. I paid attention to detail by adding padding to the table, h1, and a content div that I created to put some space between the content and the edge of the screen.

Everything is designed for simplicity and ease of use rather than flash and pop, since the site is a service delivery site, not a marketing site.


The link: