WA1

** [|Class Project] **

1. Write a brief description of the steps you followed to create the web site.

About 12 years ago I created my first website with Microsoft Front Page. While others were rather impressed with my ability to create a website it was rather idiot proof as I did not have to know HTML, I simply created Microsoft word files, saved them as html files and uploaded folders to my domain and I let the magic of the internet do the rest. I created a website for my friend who was an artist, a few years ago, he hired a professional to upgrade his site, but as I review it now, many of the WebPages I created then still remain. Additionally, I created a website for the guidance department which provided more information than the “official” counselors page. [].

So coming into this project, I had a rough idea of what a webpage should look like, I had played a little with HTML code when I was working with colors and text. However, what I learned back then was to use tables, I was able to center the tables on the page, and then I aligned text and pictures inside the tables. I set all the tables to have a width of zero so they appeared invisible to the end user. For this project, I wanted to stay away from tables and learn more about HTML. I watched several YouTube videos explaining how to use Dreamweaver. But after about the fifth one, I decided I would rather jump in and give it a go. So after opening Dreamweaver I followed the steps provided by the instructor regarding creating folders etc. I then considered the design of the project. Since I was unsure what direction I was going to head, I began by copying several files/pictures from my hard drive into my recently created folder with dream weaver. From there it was a series of trail and error as I played with color, size and fonts. I found some exceptional tutorials on w3 schools website and when I got stuck with my trial and error, I would visit that website for further information. I was able to grasp the general idea of how coding works using HTML and really didn’t have much difficulty once I decided what direction I wanted to head with this first attempt. Once I finished designing the series of pages, after several revisions based on appearance I was able to upload the whole folder to my domain hosting company. That process was also seamless as it was quite similar to the explanation explained in the Go Daddy Tutorials provided.

2.. Provide reasoning for your design choices with specific references to the Web Style Guide (opens a new window) or other provided materials on web design. You should list a minimum of five design choices and why.

One design choice I considered was Navigation and Way finding. As I constructed my site I realized that it was very easy to get lost. I created a few pages that said, “click here”, but quickly realized that it I was not providing users an opportunity to return where they started so I created footer on each page.

In regards to visual design I ensured I followed the same layout for each page setting the images in the center, and placing footer on each page to show continuation between pages. I also was careful not to place too much information on any one page is it does lead to crowding and confusion.

The web style guide mentions the importance of color, which corresponds to something I saw in one of the tutorials about skinning. I tried to give each page a unique color and have the pages backgrounds be similar enough that the change was not drastic. I tried to select colors that were complementary to each other.

Additionally I made considerations for multimedia by ensuring that all YouTube videos I embedded into my website had accurate closed caption.

When using hyperlinks on my website I ensured I advised visitors where the links would redirect them. If the link took them to an external webpage I ensured the hyperlink opened in a new window allowing users to keep my main page open. Reflecting on this now, future revisions of my webpage my include the note –“this link will redirect you to an external page”

3.. List all items you addressed from the competency worksheet.

Level One


 * X || Create a site (Dreamweaver) ||
 * X || Create a new page ||
 * X || Enter and format text ||
 * X || Insert an image ||
 * X || Create a hyperlink ||
 * X || Create an email link ||
 * X || Set the title ||
 * X || Create an ordered or unordered list ||
 * X || Preview a page in a browser ||

Level Two


 * X || Insert/embed media (such as swf, mov or wmv) ||
 * || Insert anchors where appropriate ||
 * X || Modify Page Properties ||

Level Three


 * X || Create or modify CSS ||
 * || Create an image map ||
 * X || Upload to a domain ||