Work Competed and Learning Outcomes:

            To start off this unit I completed the Moodle reading of Unit Three. Before I began to actually create code I went through some of EJ Media’s Tutorials for CSS on youtube.

            Throughout this unit I found CSS to be a fairly easy to understand language. It did not take long for me to being to feel proficient at styling my HTML. One of the more challenging parts of creating my stylesheets was making the tiles, in the “TILE section” of the stylesheet, which appear in play.html, and blog.html. I wanted Tiles that cover approximately one third of the screen, with a fixed height and border. Inside these tiles I wanted to have an image with text underneath it, and I wanted them to be centered both vertically and horizontally within the tile, with hidden overflow.

            I believe that I accomplished the task fairly well, purely with CSS. At first I was quite bothered by the fact that when the browser width is unusually small, the tiles width become different sizes, but other than that it functions as I originally planned. It doesn’t bother me as much anymore considering that I’m planning to create a better way to style the tiles, so that they work perfectly, using JavaScript and perhaps jQuery.

            In the Moodle content it says that there are six concepts that must be learnt in throughout this unit.

            In this unit I have used nearly all of these concepts repeatedly. The only ones that I did not use were internal, inline CSS, and for good reason, and the fixed or relative position. I also didn’t use static position explicitly, but many of my elements are static be default. Although I didn’t use those few concepts I do have a fairly well grounded understanding of each of them.

Rationale for What Has Been Done:

            I used one large stylesheet in this unit as opposed to several smaller stylesheets in order to limit the amount of HTTP requests based on the this link: http://stackoverflow.com/questions/2336302/single-huge-css-file-vs-multiple-smaller-specific-css-files. In the future before uploading my files to a server I would first minify the files, however because of the purpose of this course, my files need to be readable so they can be properly graded by my tutor and the professor.

            Although my CSS file is fairly large, (251 lines, so not massive) I’ve created separate sections that fulfill very specialized tasks that are clearly defined. There are seven different sections: Elements, Header, Banner, Content w/ Sidebar, Tile, Canvas, and Mail Form. They are all labeled and are organized in a parent to child manner for readability, as well as easy maintenance.

The Good and The Bad:

            I believe that I did fairly well going through this unit’s content, and applying its principals to my website. I am not confident in my ability to write maintainable, standard compliant CSS code.

            I was a bit upset that I was unable to create the tiles as perfectly as I had wanted. I’m not saying that it is impossible, however I spent a considerable amount of time working on it, and believe that I will be able to accomplish my goal using JavaScript in a fairly nominal amount of time.

What I Would Have Done Differently:

            Perhaps in retrospect, I could have limited the energy expended on my tiles. I knew that there I would be able to implement a simple solution using JavaScript, however didn’t want to give up trying to use only CSS. Other than that though I believe that I worked well, accomplishing all outcomes that have been asked of me, as well as self imposed outcomes.

Live site can be found at: http://student.athabascau.ca/~jessemc11/index.html

Zipped Site: