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 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, it for the class it245 section 3. This will be sent to you in your welcome .

Kaplan Server Troubleshooting Login: User name distributed to you by WebAdmin Password: Password distributed to you via by WebAdmin. Choose Save Password if you prefer. If you need additional help with Kaplan server, please Robert Cox

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-03ftp://ist2w.kaplan.edu

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 Layout Chapter 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 Stylesheets Chapter 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 Points Complete 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. : 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!