Website Research and Purpose

Post date: Sep 20, 2012 1:51:09 AM

Websites are something that are part of the background of our daily lives. We ignore them and take them for granted, however if we look at them closely we will see that they are carefull planned out and thoughtfull constructed.

Step 1: Background Knowledge

Take the following information and create a graphic organizer (of your choosing/ design) out of the following information.

INTRODUCTION TO WEBPAGE DESIGN

A webpage is a document stored on a web server which can be accessed and viewed using a web browser on a computer or mobile device. A webpage can contain graphics, audio and video. A webpage may also include hyperlinks to other documents on the Internet. Webpages can either be static or dynamic. Static webpages have content that remains the same every time it is viewed, the content does not change,

whereas, Dynamic webpages have content that can change each time the webpage is accessed based on how each viewer interacts with the content.

A website is a collection of related webpages. A website is developed to build a relationship with a target audience and is created for the following reasons:

• Sell – sells products or services:
• Inform – provides information about a cause, event, or organization
• Entertain – provides information or links to movies, music, magazines, etc.
• Social Networking - provides a network where people can interact online.
• Hybrid - may be a combination of any of the four purposes listed above.

WEBPAGE DEVELOPMENT STANDARDS

Standards are a basic set of rules for authoring and scripting languages used to make webpages.

Standards are created to make websites accessible to everyone regardless of culture, education, ability,

resources, or physical limitations. The World Wide Web Consortium (W3C) develops the HTML coding

standards.

Legal issues that affect Standards

• Section 508 Amendment to the Rehabilitation Act requires US Federal Agencies to make information
• and data equally accessible to individuals and employees with disabilities.
• Applies only to US government agencies.

AUTHORING LANGUAGES

• HTML - Hypertext Markup Language; The first authoring language used to create files that can be viewed on the Internet; Embedded tags define the layout and appearance of the webpage.
• HTML is platform independent.
• HTML 4.01 is the current version.
• XML - Extensible Markup Language; Designed to carry data, not to display it; Uses author-defined tags to identify data so that the data can be easily imported into other applications.
• XHTML - Extensible Hypertext Markup Language – uses XML code along with the HTML programming language to develop webpages.

WEBSITE ENHANCEMENT TOOLS

Style Sheets

• . Describe how browsers should present or display information on a webpage.
• . Give web developers more control over layout and page formatting.
• . CSS – Cascading Style Sheets is a popular style sheet language.
• Advantages of Style Sheets
• . One style sheet can control the formatting for multiple webpages.
• . An entire website can be reformatted by editing one file.
• . Styles can also be set internally.

Disadvantages of Style Sheets

• . May alter the ability of some devices to accurately read and display information.
• . Not all browsers recognize style sheets.
• Scripting Languages
• . Lightweight programming languages used to create interactive webpages in which content will respond
• to mouse or keyboard actions or at specified timed events.
• . JavaScript is the most popular scripting language on the internet because it is widely supported by
• most browsers and it does not require plug-ins to work properly.

WEBPAGE AUTHORING SOFTWARE

Text Editors – allow developers to write code in plain text. Examples: Notepad and WordPad

**Microsoft Word should not be used to create webpages.

Web Editors – provide a graphical user interface with menus containing commands to make webpage creation

easier for developers.

WEBSITE STRUCTURES

Linear - Use for pages that users need to read in order

• . Topics arranged in chronological, alphabetical, or series order
• . Include links to next page and back to previous and index page

Hierarchical – Use to organize complex bodies of information

• . Looks like a family tree or a chain of command
• . Pages are organized and linked by categories and subcategories

Webbed - Use when the order in which the user views the pages does not matter

• . Allows users to jump to any page from any page on the website
• . Navigation bars or menus are included on all pages.

WEBSITE FILE MANAGEMENT. The files for a website should be saved in one folder called the root folder

• a. The home page of a website is named index.html
• b. Use lowercase letters for all folder and filenames.
• c. Files can be organized into different subfolders within the root directory
• . Use relative hyperlinks to point to other files within the website: news.html.
• . Use absolute hyperlinks to point to other websites: http://www.citizentimes.com
• CASCADING STYLE SHEETS
• . Inline Styles – the code for the style is inserted inside the opening html tag.
• i. Syntax: <p style=”color:red”>
• ii. Affects only the information between the opening and closing tag.
• iii. Overrides internal and external style sheets.
• . Internal style sheet – used to control the appearance of one webpage.
• i. The <style> tag is placed inside the <head> section of the webpage.
• ii. Styles are defined between the opening and closing <style> tags.
• iii. Internal style sheets override external style sheets.
• . External style sheet – styles are defined in a separate text file saved with the .css extension.
• i. A code is inserted into the <head> section giving the location of the style sheet.
• ii. All webpages in a website can be linked to one external style sheet which helps keep all webpages in
• a website consistent in appearance.

WEBSITE DESIGN GUIDELINES

• . Body Text Guidelines
• a. Sans Serif typefaces are easier to read on computer screens.
• b. Choose a typeface that is common to many computers.
• c. Left justified text is easier to read for webpages.
• d. Do not use underlining—it implies a hyperlink.
• e. Let users know if a link will move them to a page on a different website.
• f. Use headings that are descriptive and unique from one another to divide page content.
• g. Use descriptive headings for lists.
• h. Use abbreviations sparingly and define acronyms and abbreviations.
• i. Avoid jargon.
• j. Consider the target audience when selecting typefaces, text size, etc.

. Multimedia Guidelines

• a. Use images, video, animation, and audio only when they help support the website's message.
• b. Ensure that images load quickly.
• c. If large images are used, use thumbnails that link to the larger images.
• d. If plug-ins or players are required, include a link to a website where the they can be downloaded.
• i. Provide controls so that users can stop, start, play, and adjust volume.
• ii. Be aware that embedded media can dramatically increase the download time.
• iii. Provide text descriptions or captions for images and video.

. Color Guidelines

• a. Use contrasting colors for background and text to make text easy to read.
• b. Use web safe colors
• i. Colors that every browser can display
• ii. 216 web safe colors are available
• . Miscellaneous Guidelines
• a. Always list the author of the page.
• b. Place the organization's logo in a consistent place on every page.
• c. Include a title in the <head> section to be used if a viewer bookmarks the page
• d. Date every webpage. Change the date when the page is updated.
• e. Include a link back to the home page from every page.
• f. Place the most important information near the top of the page.
• g. Be consistent in all design elements throughout the website.

WEBSITE COMPONENTS

• . The Home/Index Page
• a. Creates a positive first impression of the website.
• b. Communicates the purpose of the website.
• c. Shows the main menu options on the home page.
• d. Should contain navigational links or menus
• . The website should contain the following pages:
• a. About Us – defines the website’s purpose and goals.
• b. Contact Us – contains contact information to communicate with the business.
• c. Privacy Policy- informs viewers how their private information will be handled.
• . The website may contain the following pages:
• a. Splash page - an introduction page that appears while the website is loading.
• b. Site Map – a basic skeleton of the website intended to help users locate information on the website.

PUBLISHING WEBSITES

• 1. Before Publishing.
• a. Check the site in multiple browsers.
• b. Validate source code.
• c. Check spelling and relative and absolute links.
• 2. Choose a Web Host.
• a. A host computer is also called a web server and is a computer that stores webpages.
• b. Sends webpages to viewers over the Internet upon request.
• 3. Obtain a Domain Name.
• a. Use assigned name provided by web hosting service.
• b. Register and purchase a unique name for a fixed period of time.
• 4. Publish the Website.
• a. Upload files to the web host/server

Step 2:

Complete the three worksheets attached to this post. Email them to me.