Session 1: Welcome to Interactive Design I. Today we will start with introductions, review the syllabus, and discuss the goals of the class. Our first project will be a simple one page layout called the Project Portal. The document layout will use “normal flow” to present a short biography and links to all of your upcoming projects.
Important: Normal flow is a term used to describe how an HTML document behaves when none of the elements within the document have been given values for the CSS position or float attributes. In this case all block-level elements stack vertically from top to bottom in contrast to inline-level elements that stack horizontally from left to right.
We will begin the first project using a text editor to create a basic single page website. Before getting started it’s important to understand a little about HTML and how websites operate. Therefore we will build our sites by using a text editor like TextEdit, TextMate, Sublime Text, or Smultron. This technique allows for the possibility of mistakes to be made and in-turn you will learn about troubleshooting techniques.
Assignment 1: “Project Portal” Static Web Page
Due: Session 1, Week 3 (10 points)
Description:
This assignment is an introduction to the most basic concepts of building a web page (i.e. normal flow, hyperlinks, file management, creating sub-directories, and basic CSS). It is also the mechanism through which I will grade all of your subsequent assignments. start by creating a home directory titled “im1480”. Next, create four new directories within “im1480” labelled for each upcoming project. You will then build one web page with the filename “index.html” with links to the new directories you created. Upload the environment to the student webspace and place an internet shortcut on the Dropoff Drive as demonstrated in class.
Requirements:
1. Build an environment for your Project Portal and upcoming assignments
2. The environment should contain all of the subdirectories necessary
3. Create a single project portal page in the “im1480” directory called “index.html”
4. The project portal will include a header, biography, images, and an unordered list
5. The list will have links to all upcoming projects
6. Upload the environment to the student webspace
7. Place an internet shortcut on the Dropoff drive
Points Breakdown:
2 points are awarded for coding headers, lists, links, images, and divs within the document
4 points are awarded for illustrating normal flow layout, CSS styles, and basic typesetting
4 points are awarded for preparing readable, accessible, and well design content for the page
Session 2: Today I’ll be demonstrating a couple of ways to produce the "Project Portal" assignment that we discussed last time. We will also start our discussion on HTML5 and look at some functionality within the text editors and FTP applications.
Reading Assignment:
Speaking in Styles – Introduction and Chapter 1
Setting up your Student Webspace
Student Webspace Support:
For MyAiCampus support, call 1.866.642.2711 or email campus_support@aii.edu. Support is available Monday through Saturday, 7 AM to midnight, and Sunday 10 AM to midnight (Eastern).