Embed Size (px)
Citation preview
IT 245 – Website Development
Welcome!
Welcome to Unit 2!
Creating Page Layouts
Introduction
This unit covers the basics of creating general page layouts. This unit also covers the most common basic formatting options available to you within the Dreamweaver application.
We will explore how to: enter heading and paragraph text; insert text from another source; insert bulleted lists; insert blockquotes; check your spelling; search and replace text; insert and modify tables; and use Spry tooltips. browser compatibility and validity.
Introduction
We will also review how to: define CSS rules for layout areas; apply CSS rules to inserted <div> tags; add text and image placeholders to the page; export internal CSS rules to an external style sheet; work with code view and code navigator; use rules and guides to fine-tune a layout; and check your layout for browser compatibility and validity.
Kaplan Server Troubleshooting
Class, if you have not received your Kaplan server login information, please check your spam folder (User name distributed to you by WebAdmin).
Once the login information is received, please go into Doc Sharing area and download a PDF on “Using Dreamweaver FTP to Send Files to the Kaplan IS&T Student Web Server”
Using Dreamweaver, adjust the following settings: Access: Choose FTP from the dropdown menu FTP Host: Enter ist2w.kaplan.edu Host Directory: Enter your class name and section in the
name, for example, it245-03 for the class it245 section 3. This will be sent to you in your welcome e-mail.
Kaplan Server Troubleshooting
Login: User name distributed to you by WebAdmin Password: Password distributed to you via email by WebAdmin.
Choose Save Password if you prefer.
If you need additional help with Kaplan server, please email Robert Cox [email protected]
Kaplan Server Troubleshooting
Not seeing index.html on Kaplan server?
In order for the pages to render properly with your given URL, all of you files have to be in your class folder. Your index.html file is not in your CLASS-SECTION (example: IT245-03) folder. In order to put the file in that folder, double click on the folder in the right pane after you log in. At that point, the folder name will be at the top of the right pane out of the white area. Once you are in the CLASS-SECTION folder, upload your index.html file. Once you do that, your URL should work properly.
Kaplan Server Troubleshooting
Connecting to Kaplan Server via DW tips:
The biggest problem I have seen with Dreamweaver is when students put the server address in as ftp://ist2w.kaplan.edu, which does not work. It needs to be ist2w.kaplan.edu without the ftp://. Also, students need to set their folder as IT245-03
Introduction
Sitemap Structure:
Generally speaking, there are two types of structures: LINEAR and MODULAR.
LINEAR structure means that the viewers can move to the next page only in the order that was set by the designer (like a book or a step-by-step tutorial). This approach does not usually work for a website.
MODULAR allows the users to access any page at any point within the site from the main navigation.
Readings
Chapter 5: Creating a Page LayoutChapter 5 reviews the basics of web page design and strategy, designing thumbnails and wireframes, formatting a predefined CSS layout, and using Code Navigator to identify CSS formatting.
Chapter 6: Working with Cascading StylesheetsChapter 6 reviews working with Cascading Stylesheets in Dreamweaver.
Chapter 8: Working with Text, Lists, and Tables
Chapter 8 reviews working with headings, paragraphs, and other text elements.
To-Do-List
Complete the Readings
Complete the assigned readings for this Unit. Respond to the Discussion Board : 20 Points
Access the threaded discussion and respond to the Discussion questions for this Unit.
Seminar or Flexible Learning Activity : 20 points Participate in Seminar or complete Flexible Learning Activity.
Complete the Unit Assignment : 60 PointsComplete the Unit 2 Project.
Discussion
Post two links to Web sites that you feel are particularly well designed.
In your post, be sure to include elements you would like to include in your own site, such as their navigation structure.
Also include elements you feel detract from the design of the site.
What elements will you not use in your own design?
List two items you would like to implement and two items you feel are not effective aspects to include.
Project 2
Outcomes addressed in this activity:
Unit Outcomes: 1. Create a table 2. Apply CSS styles to a table 3. Create layout styled Div elements 4. Modify existing CSS
Course Outcome: IT245-1 Utilize a rapid application development tool to develop
web pages and components.
Project
Project Instructions:
Review the IT245 Web site Plan document from the Doc Sharing area. Using this document as your guide, design a page layout for the home page, second-level pages, and third-level pages. Design a page layout for the home page, second-level pages, and third-level pages on your site. At this point, all you need to have on each page is a header telling us what page it is (home page, second-level page, and third-level page).
Upload one layout for the home page, one for the second-level pages, and one for the third-level pages. Provide a link to each page layout in the Comments area of the Dropbox.
IT245 Web site Plan
Purpose: What is the purpose of your site? Are you attempting to entertain, inform, collect information, a combination of these, etc.?
The purpose of this site is to inform potential employers and clients about me and my knowledge, skills, and career aspirations.
Audience: Who is the intended audience of the site? Do you anticipate that the site will viewed by kids, teens, adults, seniors, people with a specific interest or handicap?
My web site will be viewed by many members of the community, but will focus on business managers, business owners, human resource representatives, and recruiters.
IT245 Web site Plan
Content: What information will be included on your site? The content of your site should directly reflect its purpose and audience.
My Web site will include: A home page with a brief introduction to me and my site A skills page An experience page A contact page A career aspirations page A portfolio page A relocation, or “where I want to work” page A career research page A resume or CV page A student’s choice page
IT245 Web site Plan
Web site Structure: It is essential to develop the basic layout of a site before you begin creating it. Every web site begins with an index page (also known as a home page). This is the page that opens when you go to a web site. All other pages on a site are connected, either directly or indirectly to the index page.
The site structure for your IT245 web site looks like this:
(please see the diagram in the Word Doc)
IT245 Web site Plan
Other considerations when planning a site:
Accessibility: Web sites should comply, as much as possible, with standards designed to make pages accessible to all viewers. There are a few basic rules: legible font size, graphics with alt tags, etc.
Download Speed: While lots of graphics may be pleasing to the eye, they also add considerably to the time a page takes to load. Graphics should be used with a specific purpose in mind.
Content: Content should be predetermined and reflective of the overall purpose of the site.
Aesthetics: The look and feel of your web site.
Project
Project requirements:
1. Design three page layouts: one for the home page, one for the second-level pages, and one for the third-level pages.
2. Upload all 3 pages to the Web site host. 3. Post URLs to each of the three pages to the Comments
area of the Dropbox.
Project 1 - Grading Rubrics
1. Design three page layouts: one for the home page, one for the second-level pages, and one for the third-level pages. : 0-30
2. Upload all pages to the Web site host. : 0-30
Total Points Possible : 0-60
Thank you!
Feel free to contact me with any questions!
Use the Virtual Office to post questions throughout the week, as well as to upload your zipped folder if you need me to look at the code!
