Class 4 -Feb 20

Posted on February 20, 2015 by Prof Dillon

The HTML documents will be created with BBEdit (HTML editor) and it will be uploaded using  Cyberduck (FTP to downloads and uploads remote files).

 FTP stands for File Transfer Protocol. As the name suggests, FTP is used to transfer files between computers on a network or to upload, download, and manage files on our server.

Today we will discuss

  1. Upload a html document (index.html, logo-options.html and resume.html) to the FTP server
  2. Format a resume demo
  3. Navigation (Menu) demo
  4. Site Map and Wireframes
  5. Review logos options from the assignment (logo-options.html)

Assignment

  1. Complete a site map for your portfolio site
  2. Build 2 different wireframe  of a page
  3. Upload the 3 html documents to your server
    • sitemap.html
    • wireframe1.html
    • wireframe2.html
BBEdit

BBEdit

Cyberduck_icon

Cyberduck

FTP setup window

FTP setup window

  1. Server: Domain name (example.com)
  2. Username
  3. Password
  4. Click on More Options
  5. Path: public_html
  6. Connect

 

Posted in Uncategorized | Leave a comment

Class 3 – Feb 13

Posted on February 13, 2015 by Prof Dillon

Before we start the class please post your domain name to the discussion board.

Today we will discuss

  1. Introduction to the C-Panel admin interface
  2. Set up email accounts
  3. Upload a html document (index.html, logo-options.html and resume.html) to the FTP server
  4. Format a resume demo
  5. Site Map and Wireframes
  6. Review logos options from the assignment (logo-options.html)

Assignment

  1. Complete a site map for your portfolio site
  2. Build 2 different wireframe  of a page.
  3. Upload the 3 html documents to your server.
    • sitemap.html
    • wireframe1.html
    • wireframe2
Posted in Uncategorized | Leave a comment

Class 2 – Feb 6

Posted on February 5, 2015 by Prof Dillon

Today we will discuss

  1. Continue with the introduction HTML (structural markup)
  2. Introduction to the C-Panel admin interface
  3. Set up email accounts
  4. Upload a html document to the FTP server
  5. Lab-time (resume)

Assignment

  1. Complete welcome page (use design statement and image) – index.html
  2. Create a resume page – resume.html
  3. Create 3 logo options for website – logo-options.html
  4. Upload the 3 html documents to your server.
    • index.html,
    • resume.html
    • logo-options.html

Research 3 examples of websites used for inspiration/reference for your portfolio site

Brief review of January 30, 2015

HTML element consist of an opening tag, content and a closing tag.

The HTML Element

The HTML Element

Basic structure of an HTML document

HTML Basic Stucture

HTML Basic Stucture

It consists of 5 elements:
<html> . . . </html>
<head> . . . </head>
<title> . . . </title>
<body> . . . </body>
<h1> . . . </h1> and/or <p> . . . </p>

HTML describes the structure of a page or document.

HTML Comments are used to leave notes in the source document.

HTML Comment

HTML Comment

Heading Elements

<h1>Largest Heading</h1>
<h2> . . . </h2>
<h3> . . . </h3>
<h4> . . . </h4>
<h5> . . . </h5>
<h6>Smallest Heading</h6>

Text Elements
<p>This is a paragraph</p>

Empty Element - do not have text content.
<br /> (line break)
<hr /> (horizontal rule)
<img />

Image and Attributes
The syntax of defining an image:
<img src=”images/bluejay.jpg” alt=”Picture of a Blue Jay” />

Posted in Uncategorized | Tagged , , | Leave a comment

Welcome Spring Students

Posted on January 30, 2015 by Prof Dillon

Welcome to COM 2450 Wed Design 1

Today we will discuss

  1. course description (COMD2450 Web 1-Syllabus)
  2. portfolio website
  3. Introduction to HTML (structural markup)

This is a required course for all Advertising Design and Graphic Arts students. Topics include creative user interface design and best workflow practice. Students will design a website using an (X)HTML template, and will develop design, typography and web programming skills. (X)HTML and CSS will be taught.

Over the semester, you will:
Design and build an effective portfolio site
Gain a solid foundation in current markup languages and applications.
Explore industry standards in layout design and functionality
Upload a fully operational site to a personal URL

Assignment

  • Choose an appropriate domain name and purchase
  • Sign up for ISP (hosting) service
  • Compose design statement about yourself
  • Create a HTML file with design statement and image
Posted in Uncategorized | Tagged , | Leave a comment