1 / 12

Web Design Basics

Web Design Basics. Creating Appealing Websites. Basics of Web Design: HTML 5 and CSS3, Felke -Morris, T.c. Use colors and images that appeal to your target audience. www.nasa.gov www.bls.gov Browser friendly Test in IE, Firefox, Chrome Screen Resolution Old monitors and mobile devices.

zona
Download Presentation

Web Design Basics

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Web Design Basics Creating Appealing Websites Basics of Web Design: HTML 5 and CSS3, Felke-Morris, T.c

  2. Use colors and images that appeal to your target audience. • www.nasa.gov • www.bls.gov • Browser friendly • Test in IE, Firefox, Chrome • Screen Resolution • Old monitors and mobile devices Design for Target Audience Basics of Web Design: HTML 5 and CSS3, Felke-Morris, T.

  3. Hierarchical • Too shallow • Too deep • Linear • Need for sequencing • Random • Not common Website Organization Basics of Web Design: HTML 5 and CSS3, Felke-Morris, T.

  4. Repetition • Repeat visual elements throughout the design. • Contrast • Add visual excitement and draw attention. • Proximity • Group related items. • Alignment • Align elements to create visual unity. Principles of Visual Design Basics of Web Design: HTML 5 and CSS3, Felke-Morris, T.

  5. Accessible design can benefit search engine listing. • Legal Requirement • mandated by U.S. government for all federal agencies. • W3C also actively involved. Design to Provide for Accessibility Basics of Web Design: HTML 5 and CSS3, Felke-Morris, T.

  6. Use short sentences and phrases. • Be concise. • Organize the page with headings and sub-headings. • Keep in mind that bulleted lists stand out on the page and are easily read. • Use common fonts. • Typeface – Arial and Verdana Use of Text Basics of Web Design: HTML 5 and CSS3, Felke-Morris, T.

  7. Check font weight. • Be careful not to bold everything, it has the same effect as bolding nothing. • Check font color for contrast. • Check alignment • Centered text is harder to read. • Carefully choose text in hyperlinks. • Check spelling and grammar. Use of Text Basics of Web Design: HTML 5 and CSS3, Felke-Morris, T.

  8. Hexadecimal color values. • Try to use web-safe colors • www.colorschemedesigner.com • www.colorjack.com • www.colorsontheweb.com/colorwizard.asp Web Color Palette Basics of Web Design: HTML 5 and CSS3, Felke-Morris, T.

  9. Appealing to children and pre-teens. • www.usmint.gov/kids • Appealing to young adults. • www.underatedrock.com • Appealing to everybody. • www.nps.gov • Appealing to older adults. • www.nihseniorhealth.gov Use of Color Basics of Web Design: HTML 5 and CSS3, Felke-Morris, T.

  10. Avoid relying on images to convey meaning. • Make sure file size is small as possible. • Use only necessary multimedia • Use animation only if it makes the page more effective. • Younger audiences find animation more appealing than older audiences. Use of Graphics and Media Basics of Web Design: HTML 5 and CSS3, Felke-Morris, T.

  11. Use Cascading Style Sheets (CSS) for page layout • Use consistent logo and color scheme. • Ice • Fixed width, hugs left margin. • Jello • Content stays centered. • Liquid • Content expands. Page Layout Design Basics of Web Design: HTML 5 and CSS3, Felke-Morris, T.

  12. Load time. • Above the fold. • Adequate white space. • Avoid horizontal scrolling. Other Considerations Basics of Web Design: HTML 5 and CSS3, Felke-Morris, T.

More Related