Top Three Web Design Misteaks (sic)

Slides:



Advertisements
Similar presentations
Designing e-Portfolio Website ( Part 3 ) Lan Vu. Overview Some techniques in web design Demo on creating & designing website What make a good website.
Advertisements

And How To Avoid Them! Continuing Studies CS 22: Enhanced Web Site Design September 2013 Top Ten Web Design Misteaks (sic)
Good Websites. 2. Submit one good web interface. This website is a good because of it usability and appears of the website.
INTRODUCTION OF WEB DESIGN 2003 TALL SUMMER INSTITUTE 7/7/2003 Chi-Hua Tseng.
Website: Best Practices. Sources: The World Wide Web Consortium the main international standards organization for the World Wide Web Research-Based Web.
Do’s and Don’ts of Web Design By: Cassandra VanHumbeck.
STANFORD UNIVERSITY INFORMATION TECHNOLOGY SERVICES Technology Training Services, January 2011 Web.
Website Design BTT1OC/2OC. What is web design? O A web site is a digital page consisting of HTML (hypertext markup language) files, images, movies, sound,
Basic Web Design. Technology is a tool  FIRST, understand how people actually interact with each other and with the information in their lives, in all.
Chapter 18 Web Design April 16 th & 17 th. Content The most essential element of any Web page is the content Before you begin a Web page you want to know.
Creating an Attractive Site How will your site look. Think about what your customers are seeking and what type of Web site they find attractive.
 Understand the problem  Brainstorm solutions  Introduce the constraints  Choose the solution  Paper design  Actual design  Evaluate  Revise.
Developing Content and Layout Lesson 6. Creating Web Site Content Online users scan a page, read key words of text, and check out graphics Reading from.
Website Development with Dreamweaver
Web Page Design. Some Terms Cascading Style Sheet, (CSS) –a style sheet language used to describe the look and formatting of a document written in html;
Computing Theory: HTML Year 11. Lesson Objective You will: o Be able to define what HTML is - ALL o Be able to write HTML code to create your own web.
Dreamweaver MX Unit B CIS 205—Web Site Design and Development.
Ordered Lists By Brian Christian. Ordered List Tags You use this tag when you want to start an ordered list. Each list item you write need to start with.
Dr. Andrew P. Ciganek WebsiteNightmares. Why Examine User Interface? Developers often lack user interface expertise –Many “mistakes” are quite common.
Web Pages That Suck By Vincent Flanders William Featherstone.
INTERACTIVE BRAND COMMUNICATION Class 6 Creative Issues II: Creating Effective Online Advertising.
Design Principles for the Web Lavanya Koppaka. Why follow design principles? Structure the information being presented Increase the readability Ease of.
PRINCIPLES OF WEB DESIGN. EDGAR GARCIA – WEB DESIGN 2/8/13.
Tools For State and Local Web Sites Web Style, Site Headers and Promotion Banners.
Enhanced Web Site Design Stanford University Continuing Studies CS 22
 Understand the problem  Brainstorm solutions  Introduce the constraints  Choose the solution  Paper design  Actual design  Evaluate  Revise.
IT: Web Technologies: Web Animation 1 Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Designing Web Site Layout Using.
Why Navigation is So Important in Your Website Design.
 CSM 583 CAPSTONE ADA Compliance: Easy Steps to Get Started with Accessibility By Jeff Statham.
The Good, the Bad & the Ugly: Style and design in Website creation Chris Webster: Information Officer and Website Manager at the EARL Consortium for Public.
Planning and Designing Effective Web Pages. When planning a new site Determine site goals 2. Identify the target audience 3. Conduct market research.
Graphics Navigation Usability Typography Content Clarity & Consistency.
Human Computer Interaction: World Wide Web Rebecca W. Boren, Ph.D. Introduction to Human Factors & Ergonomics Engineering IEE 437/547 November 2, 2011.
DMT612 Professional Preparation EFFECTIVE WEB DESIGN.
Making the website. Get your folders sorted first Create a new folder in “N” called “My hockey website” Create folders inside called “Documents”, “images”
Click anywhere to start the presentation. Characteristics of a bad website.
Web Design ECT 270 Robin Burke.
Technology and Marketing The Awesomeness That Is Google Part II
Principles of Graphic Design
How to Design an Effective Web Presence
Unit 2, Lesson 5 Website Development Tools
Top Three Web Design Misteaks (sic)
Top Five Web Design Misteaks (sic)
Unit 2, Lesson 5 Website Development Tools
Checklist to Consider For Design Ultimate Landing Page Menomonie Web Design Agency.
Objective % Explain concepts used to create websites.
Content Management systems
Web Design Techniques.
HTML5 Level III Responsive Web Design (RWD) and Front-End Frameworks
Fixed Positioning.
TITLE OF POSTER (40 pt.) HOW TO USE THIS TEMPLATE (36 pt.)
HTML5 Level III Responsive Web Design (RWD) and Front-End Frameworks
Design Principles and Why We Need Them…
PowerPoint Presentation Guidelines
Design Principles 8-Dec-18.
How To Create A Website That Keeps Customers Returning.
TITLE OF POSTER (40 pt.) HOW TO USE THIS TEMPLATE (36 pt.)
This portion of this packet allows you to edit your ‘ball words’ as you like. Before you start, you will need to go to TpT and download a free font from.
TITLE OF POSTER (40 pt.) GRAPHICS + PHOTOS
Web usability -04-.
Top Ten Web Design Misteaks (sic)
BENEFITS OF WEB DESIGNING. 2 There are many benefits that a web designer gets. Web designing can be one of the best option for getting most of the benefits.
Design Principles 5-Apr-19.
Objective Explain concepts used to create websites.
Manipulating Text & Links on your website
Website A website is a collection of web pages (documents that are accessed through the Internet) When someone gives you their web address, it generally.
Accessibility Guide.
Matching Gift Roadmap Jump-start your matching gift efforts.
Module 5 Top Skills A Helping People
Designing Web Site Layout Using Fireworks
Presentation transcript:

Top Three Web Design Misteaks (sic) And How To Avoid Them! Continuing Studies CS 21: Beginning Web Site Design November 2015

Top Ten Web Design Misteaks (sic): Misteak #1 Designing your website for your needs, not the needs of your visitors. A web site shouldn’t be just a marketing tool for you – it should be there to help your visitors achieve their goals. People go to websites for one of 4 main reasons – don’t make it difficult for them! They want to: Get information. Make a purchase or donation. Be entertained. Be part of a community. ‘bad’ examples: http://www.gotoscw.com/ -- try to buy items! http://tinyurl.com/old-brownuniversity -- try to click Annual Fund http://tinyurl.com/old-globalaigs ‘good’ examples: http://givingtostanford.stanford.edu/ http://babelfish.yahoo.com/ http://paypal.com/

Top Ten Web Design Misteaks (sic): Misteak #2 Designing your site in a way that people can’t figure out what they’re supposed to do. It should take no more than 3-5 seconds to be able to figure it what you can do on your web site. ‘good’ examples: http://www.learningguitarnow.com/ http://www.w3schools.com/ ‘bad’ examples: http://www.arvanitakis.com/en/ http://www.pandminc.com/ http://www.snarg.net/ http://web.archive.org/web/20070115231803/http://www.marshill.org/

Top Ten Web Design Misteaks (sic): Misteak #3 Don’t use fonts or content that makes it difficult to read Don’t make the font size any smaller than 80% of the default size for the browser. Don’t use graphics as text Don’t use dense text Don’t do “mystery meat navigation” Use this tool to ensure that your text is in high contrast to the background: http://www.accesskeys.org/tools/color-contrast.html ‘good’ examples: http://metaverse.stanford.edu http://www.duckduckgo.com/ ‘bad’ examples: http://www.wherever.com/ http://www.macys.com http://www.dokimos.org/ajff/ http://tinyurl.com/old-havenworks http://www.historianofthefuture.com/ http://www.bellads.info/ http://www.flatpakhouse.com/ http://www.bluebell.com/ http://www.webpagesthatsuck.com/web-design-question-which-looks-like-a-dentist-1.html