Web Page Design Overview

Web Page Design

• Emphasis: Effectively communicate the message, highlight crucial topics, and organize information for easy navigation.

• Contrast: Generate visual interest and enable easy navigation by making the page appealing.

• Typography: Enhance readability and complement graphics. Use typography to create a mental image and convey the appropriate tone (professional, recreational, whimsical). Maintain a readable size (12-10pts to 14-18pts for body text), and avoid "dancing letters." Choose fonts that fit the site, are readable, and widely available across browsers. Utilize Cascading Style Sheets (CSS) for defining formatting and applying styles.

• Colors and graphics: Use color schemes, such as monochromatic, analogous, or complementary, that enhance the reader's experience, considering the needs of visually impaired individuals. Utilize appropriate graphic formats (GIF, JPEG) and place buttons and icons strategically. Opt for standard icons to improve recognizability. Provide matching text links for users with lower bandwidth. Make sure animated graphics turn off automatically to minimize distraction. Avoid flashing images.

Webpage Navigation

• Structure: Visual cues guide users to their destination, with navigation tools grouped for easy access (horizontally or vertically). The placement of tools and terminology should be consistent. Utilizing a "breadcrumb trail" aids in finding the way back.

Webpage Content

• Clarity: Communicate the page's purpose clearly.

• Brevity: Use short sentences and provide a summary of the page.

• Informality: Maintain an engaging and enticing tone.

• Accuracy: Verify all facts and remove any typos to enhance the positive response of the reader.

• Relevance: The content should match the target audience's needs. Relevant information should be prominently placed at the beginning (e.g., at the top). Keep information updated and provide options regarding the language used.

• Consistency: Use standard, consistent terminology. Utilize a style guide.

Do's and Don'ts

• DO'S: Address your target audience directly, personalize pages for specific users, communicate with visual elements (e.g., white space, contrast, layout), provide alternate graphics and multimedia solutions, and use consistent navigation tools. Provide "breadcrumb" trails and links to relevant external sites. Obtain approval before publishing content external to the site. Conduct thorough testing and seek feedback.

• DON'TS: Limit your audience unnecessarily, make everything overly obvious, use large files, overuse multimedia, overload your pages with information, maintain inactive links, employ jarring colors, or publish external content without consent.

Webpage Elements

• HTML: The fundamental code language for creating web pages.

• HTML History: Evolution and key milestones (starting in 1964) involving important individuals and advancements like email, chat, etc.

• Internet Protocols: (e.g., HTTP, SMTP, FTP, VoIP)

• Components of a URL: Describe the scheme, subdomain, second-level domain, top-level domain, and subdirectory.

HTML Elements

• HTML Attributes: Explain how attributes (like HREF, src, alt, width, height, lang, and style) provide additional information about HTML elements (like links, images, paragraphs).

• HTML Tags: Explain which tags are mandatory and their placement in an HTML file (e.g., , ,