MMDT1144 Multimedia and the Web
Week 2



Week 2

Notes on web server functions.

Notes on synchronize.


Review of graphic image types and some basic concepts.
Review chapter 5 notes from the MMDT1021 HTML course.

For this course you will need to use image editing software of your choice.  Common choices are Adobe Photoshop, Jasc Paint Shop Pro, Macromedia Fireworks, Microsoft Digital Image, The GIMP, Irfanview, and Paint.NET.  If you don't have a license to one of the commercial products, then I recommend that you try Paint.NET.


Pressing "Enter" creates an blank line (double spacing) by creating a new paragraph <p>.

Line 1

Line 2

Line 3.

 

Pressing "Shift + Enter" does not create a blank line rather it single spaces by creating a <br /> tag.
Line 1
Line 2
Line 3

I like to turn on the hidden line break icon so that I can see the line breaks in design view.  Edit > Preferences... > Invisible Elements > check Line Breaks.


Adding space between characters

HTML only allows for one space between characters; to add additional space in a document you must insert a non-breaking space . You can set a preference to automatically add non-breaking spaces in a document.

To insert a non-breaking space , do one of the following:

  • In the HTML category of the Insert bar, click the Characters button and select Insert Non-breaking Space .
  • Select Insert > HTML > Special Characters > Non-Breaking Space .
  • Press Control+Shift+Spacebar (Windows) or Option+Spacebar (Macintosh).

To set a preference to add non-breaking spaces :

  1. Select Edit > Preferences (Windows) or Dreamweaver > Preferences (Macintosh).
  2. In the General category make sure Allow Multiple Consecutive Spaces is checked.

File and folder name conventions

  • Use all lowercase.
  • Use only the characters a - z and numerals 0 - 9.
  • Do not use spaces.  If you must have a space, then use an underscore _ .
  • Keep file names and folder names short, yet meaningful.
  • Use some sort of logical structure for your folders.
  • Try to follow some convention.  If you use the ".htm" extension, then use it everywhere.  If you use the ".html" extension, then use it everywhere.

Significance of index.htm

Every web server has a list of valid startup file names that are used to "automatically" bring up the first page in a web site.   One of the most common file names used is "index.htm".  Other commonly used names are "index.html", "default.htm", "default.html", "index.asp", and "index.php".   You may need to check with your web hosting provider to find out what are the valid startup file names.


Testing

You test your site locally by pressing F12.
You test your site on a alternate browser by pressing Shift-F12

Check your spelling!  Shift+F7.

Periodically do a Clean up HTML and Apply Source Formatting.
You can assign shortcut keys to functions that you use often.


Orphaned Files

Periodically check your site for orphaned files.
That is... Files that are no longer being used
.

 

 

Lab 2

This lab is to test your knowledge of being able to do basic page creation and to create some basic links.

Create a subfolder on your web server named "lab2".  Within "lab2" you will create a mini site.

This site must contain as a minimum:

  • Sub directories.
  • Pages must be titled. (title tags in the head).
  • Examples of different font styles, sizes, and colors.
  • Text that you copy and paste from another source.
  • A "special" character in your text, such as ©
  • A background image.
  • An e-mail link.
  • A simple navigation menu.

Look at this example site for more information.

Use your imagination and creative skills. You may use advanced features if you desire.

The tree showing the subdirectories and files for my example site is shown below.

screen shot

Create an "index.htm" file in your root directory that will be a simple list of links that point to your labs.  When viewing your website, this index.htm file should come up.

Assignment is due 1 week from when it was assigned.  50% penalty if late.

Grading Criteria Possible
Points
20
Your
Points
20
At least four subfolders created under the "lab2" folder. 2 2
At least one htm in each folder.  Get text from another source. 4 4
A background image that is the same on all pages. 2 2
All pages linked together with a navigation menu. 4 4
An email link. 1 1
Different font types, sizes and colors used. 3 3
A special character used. 1 1
All pages titled. 1 1
A index.htm in the root folder with links to lab1 and lab2 2 2