BIS 353 IWU Web Application Project – Description
Headers are used to brand a site and provide a consistent theme. HTML5 has a header tag to contain the information.
Creating a header is an important component of web design. The header, which can contain navigation along with the content and footer, is part of the “wireframe” or blueprint for your pages. Most headers contain a logo that identifies the business, organization, or content of the site.
Upon successful completion of this assignment, you will be able to:
Add images to webpages using the image element.
Describe why CSS is used for page layout.
Use relative and absolute positions on a webpage.
Configure images as backgrounds and hyperlinks.
Background Information
Section 5.10 in Chapter 5, “Page Layout Design,” introduced the wireframe, which is a sketch of a webpage. You already submitted a wireframe for your home page and the content pages for your Website Project. Remember, you may not have content for all of your pages, but all the pages should share the same header, navigation, and footer. Your site logo should be placed within your header.
To create a logo, you must use a graphics program such as Adobe Fireworks or Adobe Photoshop. There are some free graphics tutorials available for these programs as well as some free graphics programs, or you can opt to use Paint. Section 6.10 in the textbook, “CSS Sprites,” covers using an image to replace header text.
Instructions
Review the rubric to make sure you understand the criteria for earning your grade.
Download a free version of one of the following graphics software options.
GIMP Image Editor
Adobe Fireworks
Adobe Photoshop
Go to the companion site for Chapter 4.
Scroll down the page to the section that has the heading Free Graphics Tutorials. The tutorials on this page are for older versions of Fireworks and Photoshop, but the programs are still very similar to the current version.
Select one of the tutorials listed on this site and follow the instructions to create a logo banner, or try one of the logo tutorials for GIMP.
Once you are familiar with a graphics program, then use it to create a logo for your Website Project.
Make sure that you create the logo as a Graphics Interchange Format (GIF) and as a Portable Network Graphic (PNG).
Once you have created the logo, add to your header image for each HTML page of your Website Project.
Validate all of your pages using the validator tools at W3C Markup Validation Service to ensure correct/valid code.
The post BIS 353 IWU Web Application Project first appeared on .
