About this document

If you are holding a paper copy of the CS 203 "Course Pack" you must be a Bishop's student. Otherwise, you are simply viewing the table of contents of that publication. You are welcome to click on the various items, as they are all little html pages.

This course pack is designed to serve as a basic reference and a starting point, with basic examples, for creating your own pages. All of it is also on-line in the course web page, and contains links to additional material and outside tutorials and references.

"Copyleft"

The internet documents itself. I acknowledge the many sources of information that exist there, These notes are intednded as an introduction and guide to that vast body of knowledge.  In particular, I refer to the "HTML Quick Reference" by authors at the Univ. of Kansas. It is classic documentation, surviving on a handfull of University servers such as ours.
I assert authorship of the effort that has gon into the compilation of these notes, and grant use and improvement of them to anyone, and would abhor any attempt to restrict their free distribution.

Lin Jensen
Bishop's University

This course pack is to be found at http://cs.ubishops.ca/ljensen/webdesign/

CS 203 - Interactive Web Page Design

Introduction

You will be familiar with web pages, unless you have spent the last 25 years in a cave with no electricity. You know that every computer has a "browser" that will display web pages, and let you surf the Internet by clicking on links. As you click, you are contacting various "servers" whose job is to deliver content to you in the form of HTML "pages", your browser's job is to act as a "client" to display them.

In this course you will learn four languages that are used to describe pages (HTML), give them style (CSS), and to carry out programmers' directions, either by the server or by the client. Each week's lab session will build upon the last, it is important to learn by doing. The glue that holds these elements together is the html form, and the http protocol that sends the form data to the server, where your program instructions process it. We will be using PHP for this. Finally, JavaScript allows you to write instructions to be executed by the client (browser) to do a number of tasks, one of which is to check that a form has been properly filled out before it is sent.

Contents

  1. Getting started: Accounts and Tools
  2. HTML - the syntax describing web pages
    1. part 2, some HTML tags
    2. Note on Tables
    3. Quick Reference (old classic, includes Forms)
    4. Forms
    5. Forms in HTML5
    6. Image processing for cropping, scaling, and backgrounds
  3. CSS - describing styles
  4. PHP - server-side programming
    1. A note on computer languages ("Computers don't think")
    2. Arrays
    3. How to use PHP, for form results
    4. File uploads
    5. Defining functions: Some additional functions (mine) to help print form data
    6. Using Cookies -- have the client save "state" information
    7. $_SESSION variable -- saving state information at server
  5. JavaScript - client-side programming
    1. Form checking with Javascript
    2. Cookie manipulation using JavaScript
  6. SQL Introduction and quick reference (for CSC 107)
    1. Using SQL in PHP: Connecting to a Database and doing queries
  7. Specific topics: (PHP, Javascript & SQL -- comparison of techniques)
    1. Date & time manipulation (with "LastModified" example)
    2. Internationalization - the gettext approach to translation
2
6
7
9
10
17
20
22
24

27
30
32
36
38
41
42
44
46
49
50
54

58