cm143web week 8 review of assignment 1 revision & elaboration

8
CM143 Web Week 8 Review of Assignment 1 Revision & Elaboration

Upload: griselda-price

Post on 30-Dec-2015

213 views

Category:

Documents


1 download

TRANSCRIPT

Page 1: CM143Web Week 8 Review of Assignment 1 Revision & Elaboration

CM143 Web

Week 8Review of Assignment 1Revision & Elaboration

Page 2: CM143Web Week 8 Review of Assignment 1 Revision & Elaboration

Assignment 1 Review

• Quality of submissions excellent• Some issues for review:– Problems uploading– Use of container divs– Linked external css file– Problems with directory structure

Page 3: CM143Web Week 8 Review of Assignment 1 Revision & Elaboration

Uploading the site

• A site created on a local machine can be transferred to the web server by File Transfer Protocol (FTP), or an encrypted version (sFTP).

• The completed site can be uploaded by FTP in Dreamweaver. The process does not require other transfer software (WSFTP)

• Uploading a site requires login details for the destination web server– FTP Host, folder, username, password

Page 4: CM143Web Week 8 Review of Assignment 1 Revision & Elaboration

Dreamweaver FTP Upload Details

• FTP Host – This is the url of the server you are uploading the site to– For DCU: student.dcu.ie

• Folder – Specification of the folder on the server space allocated to you that the site files will be copied to– For DCU: public_html

• Username & Password– For DCU: Your Novell login details

Page 5: CM143Web Week 8 Review of Assignment 1 Revision & Elaboration

Use of Container <div>

• Using a container div for the site allows you to set a maximum width for the site and to centre it at that width– This ensures that on large screen resolutions, the

site does not expand horizontally to fill available space and reduce legibility

• Nesting the structural divs inside a container of fixed width allows for fewer width and position settings in CSS

Page 6: CM143Web Week 8 Review of Assignment 1 Revision & Elaboration

Step-by-step Centred Container

• Redefine the body tag– Centre everything on the page so that the

container will appear centred in large resolutions– Optionally, set margins to avoid differences in

margin defaults between browsers• Create a class for the container and apply– Set a width (~800px recommended)– Set margins to auto to allow for centring in Firefox– Optionally set borders, background, etc

Page 7: CM143Web Week 8 Review of Assignment 1 Revision & Elaboration

External CSS Files• Defining Styles in “This Document Only” in

Dreamweaver causes the style settings to be added to the head of the html document– This is useful for single-page sites but problematic

beyond this because changes in a style have to be made for every page if required

• For a site where the same definitions apply to numerous pages, the styles should be defined in a central CSS file

• The .css file can be specified when styles are first defined and linked to multiple pages

Page 8: CM143Web Week 8 Review of Assignment 1 Revision & Elaboration

Directory Structure

• A site should be contained within a single folder (to be defined in Dreamweaver’s define site settings on the local machine)

• This entire folder will be copied to the server– It should not contain extraneous files (planning

documents, photoshop PSDs, etc)• The folder can be structured with subfolders for

images, css, etc• The homepage must be called index– Index.htm, index.html, index.php, etc etc