Extreme tracker button

Bill Larnach's TT280 Journal

PicoSearch

| Home | TT280 | TT281 | TT282 | | |

TT280 Web Applications: Design, Development and Management

Note: This page refers to the Pilot presentation of TT280 (May 2002). After looking at some of the study guides for the next presentation I notice that significant changes have been made.

Image of a cobweb representing the theme of web design I decided to take TT280 as I'm interested in web design and I wanted to improve my personal web site. I first found out about the course when it was mentioned on the MT262 FirstClass conference, and after reading the course description I decided to enrol. I found the content and structure of the course excellent, but for me it was badly let down by the presentation, in comparison to the other OU courses I've completed. However, I've decided to create this journal to share my views of the course, and to act as my own reference of links, etc., as I intend to complete the remaining courses in the OU's Web Applications Development Certificate.

Despite the problems with presentation, I found the course enjoyable and managed to learn a great deal about web design. One of the most interesting aspects of the course was interacting with other students on the conferences, and listening to different views on web design. At times the discussion was robust, but it all added to the learning experience. Personally I would have preferred more input from the course team to give a course perspective to certain design concepts, rather than students being left to debate things on our own. The course team seem to have acknowledged that there were problems with lack of resources on the pilot presentation of TT280, and have postponed the next Web Applications Development Certificate course - TT281 client scripting, until May 2003. As long as the problems experienced on the pilot presentation of TT280 are sorted out, it has the potential to become an excellent course, and I would recommend it to anyone interested in web design.

The overall theme of the course is one of giving an introduction to the web application development process rather than any in-depth knowledge of particular concepts.

Pilot presentation May 2002 - July 2002


Week One - Investigating Web Applications

HTML book cover image DWS book cover image The course started off slowly - we were given a study guide for weeks one and two, and our task for week one was to engage in a discussion on "What makes for a good web site?" The activity was quite open and students participated if they wanted to. As there were no exercises to complete, I also used this week to become familiar with the two course books: Reding, Vodnik, HTML Illustrated Introduction, and Sklar, Designing Web Sites Illustrated Introduction.

The set books were well written and easy to follow, but we eventually found that there were inconsistencies with The World Wide Web Consortium (W3C), which later became our definitive HTML reference source.

As well as the study guides that were released each week there was a course web site that contained a study calendar and other resources. This was the first 'short' course that I've done with the OU and at times I found it hard to plan ahead as the study guides were only released one at a time.

Top



Week Two - Assembling a tool kit

Week two was another slow week with the activity of a discussion on "Useful tools for web development". Again there were no exercises to complete, but there was a lot of useful information on the conferences to read through, and new software to try out. Some students advocated professional software packages such as Macromedia's Dreamweaver, others more basic freeware HTML editors. I spent some time finding and trying out different applications and came up with the following freeware web development toolkit.

1st page 2000 - A free HTML editor including many JavaScript and Perl scripts. - includes HTML Tidy code validator. 1st Page 2000 is a powerful html/script editor for beginners, intermediate to professional web builders, it's a powerful product that helps you write, edit and improve your HTML. It has a unique feature that allows you to set the features available to suit your skill level - beginner, intermediate or advanced. Note: A new version has been announced for over a year - but was never released. There may not be any future updates for this product.

NoteTab Lite - More features than Windows Notepad make this a useful text editor for checking HTML source code.

TidyGUI - HTML validator based on the W3C's HTML Tidy source code.

Pixia - freeware graphics program. Pixia is the English version of a famous Japanese painting and retouch software for full color graphics. It supports mask, layer and many other editing functions. You can use your own customized brush tips and even use an image file as a brush tip to create unique effects. Its user-friendly interface is suitable for beginners as well as experts. Pixia supports the most common editing techniques and presents a user friendly interface.

Screen calipers Screen measuring tool based on a set of engineering calipers.

WS_FTP LE - ftp upload program, simple and reliable.

Xenu - link checker - a really useful program that checks any site for dead or re-directed links. It can also be used to produce a site map.

Handy ImageMapper - a quick way to create image maps.

Style assistant - CSS editor (German site) a quick way to create style sheets.

Colour picker - In addition to the standard colour picker it features an 'eye dropper' tool and a 'Send code directly to document' option. The stand-alone version is customisable to produce any sort of RGB based colour code that could be required.

Top


Week Three - The Web design environment

Web Design in a Nutshell book cover image WebMaster in a Nutshell book cover image In week three the work started for real as we were introduced to web standards, browser compatibility, and The World Wide Web Consortium (W3C). The W3C was difficult to navigate at first, but one of the tutor / moderators put it in context by explaining that it's a site designed for academics and web professionals and it contains a wealth of information. As I already had a basic knowledge of HTML I didn't complete the exercises from the set books this week, but I spent some time getting familiar with the W3C site, particularly HTML elements and attributes. A good place to start is the W3C's Finding your way page.

Although there are other more user friendly web sites about standards, it soon became clear that the W3C site was important as they set the recommendations, and therefore are the best reference source. There were sometimes inconsistencies between other sites or books, and the W3C site itself, which came to light following the first CMA. Several books were recommended during the course, but one that many of us found particularly useful was Web Design in a Nutshell (2nd Edition). The other recommended book for week three was Webmaster in a Nutshell (2nd Edition), but this one was last printed in 1999, and the next edition is out on 31st January 2003, so I intend to get the 3rd edition in preparation for the remaining Web Applications Development Certificate courses.

Top



Week Four - Web Design Principles

Usability book cover image
In week four the study guide suggested that we think about three questions:

• What makes for a good web design?

• What brings visitors to our web site?

• What brings visitors back to our web site?

The concept of web site usability was introduced, and linked to the weeks recommended reading: Nielsen,J. and Tahir,M.(2001) Homepage Usability: 50 Websites Deconstructed. I purchased the book, and recommend it as additional material, but it's not essential, as there's a wealth of usability information on Nielsen's web site. There were also several exercises to complete from the set books this week, and the first Computer marked assignment (CMA). There was some confusion over the first CMA as the number of answers per question was not made clear, and the wording of some questions seemed ambiguous.

Top



Week Five - Planning


Information Architecture book cover image Practical information architecture book cover imageIn week five we were introduced to planning a web site and the new discipline of 'Information Architecture'. We worked on planning of the site and also detailed planning of navigation, by working through various exercises in the set books. Two new recommended reading books were introduced although I decided that I didn't need them at this stage. (Information Architecture for the World Wide Web (2nd Edition) and Practical information architecture).



Top



Week Six - Templates and tables


In week six our goal was to learn about tables and how they can be used to control the position of page content. I focused on the DWS set book and the way it described the areas of screen importance. The screen is broken up into a grid where users tend to view the centre, then the top and then clockwise around the screen.


2





5







1







3




4

Templates were also covered this week, which linked to the usability feature of users becoming familiar with a site because of consistency in the design.

Top


Week Seven - Typography and graphics


Week seven was a very interesting week with vigorous discussion in the conferences over the deprecated <font> tag / Cascading Style Sheets(CSS) debate. For me there were valid arguments on both sides, but I came down in favour of CSS as the way forward. I found it disappointing that there was no official course team input on this issue, apart from a late confirmation that CSS was required for the ECA. To put this debate in context, it was amongst a group of students with a huge range of experience from complete novices to professional web designers and questions were raised such as:

• Why learn <font> tags, when they're deprecated?

• Why learn CSS when it isn't fully supported?

• Why bother supporting old browsers, when new browsers are free?

• There are millions of pages with deprecated tags out there, so why change things now?

Graphics were also introduced, focusing on file types and uses of .jpg, .gif, and .png files.

The second CMA was completed this week, and everyone's results seemed to improve - probably because the number of answers per question were stated, W3C and not the course books was made the HTML reference, and the questions seemed more straight forward.

Top


Week Eight - Page layout and Framesets


Frames were introduced in week eight, and the Study guide discussed the advantages and disadvantages of using framesets. There was some confusion as to whether they would be allowed in the ECA, so most students seemed to avoid using them. They also seemed to cause a problem with validation. A short term solution was to use the HTML 4.0 rather than 4.01 Document Type Declaration (DTD) which seemed to support more Frameset attributes.

By now I had started to think about starting the templates and report for the ECA.

Top


Week Nine - HTML forms


In week nine we were introduced to the use and design of forms, with the emphasis on creating and testing our own forms using a test CGI application that had been uploaded to the TT280 desk top. I used this time to create my feedback template, and experiment with form attributes and options.

Also in week nine was the third CMA, again this one seemed straight forward, compared to the first one.

Top


Week Ten - Introduction to client side scripting (JavaScript)


Week ten gave us a broad introduction to client scripting focusing on JavaScript, and using examples such as form validation, image roll-overs, and pop-up windows. We weren't required to have a detailed understanding of the functions, just an understanding of what client scripting is, and what features and facilities it offers.

Top


Week Eleven - HTTP protocol and The Three-tier Architecture of Web Application Development


This was another interesting week that included downloadable Flash presentations of HTTP protocol. However, the ECA cut off date was rapidly approaching so I decided to make my report a priority.

Top


Week Twelve - End of course assignment

The end of course assignment (ECA) consisted of a report and a set of templates for the design of a web site for a kitchen utensil company.

My templates (Image place holders, rather than actual images were used in the templates as there was a limit on the number of files allowed. The text used is Lorem Ipsum - Latin filler text, used to focus the viewers attention on the overall design, rather than the text).

Unfortunately, the course ended abruptly, shortly after the ECA cut off date, the course web site and FirstClass conferences closed. Although several TT280 students are still active on the OUSA Web Design / Web chat conferences (OU Server 2 FirstClass client software). We were given the chance to fill in a feedback questionnaire, but I would have preferred the conferences to stay open until at least the ECA results were sent out.

Top

CSS   Valid CSS!   Valid XHTML 1.0 logo!   Level A conformance icon, W3C-WAI Web Content Accessibility Guidelines 1.0

| Home | TT280 | TT281 | TT282 | | |

URL of this page: http://www.larnach.info/TT280/index.htm