Lesson 1 Overview

1. Work Flow
To make a professional web design, you need to go through following steps:
a. To establish a marketing strategy based on customer's demand.
b. Analyze the whole website to confirm the functionality, menus, etc.
c. Creating the sample page.
d. Polish the design.
e. Revise to meet the customer's demand.

2. Targets
a. Viewer can easily find what they want to see.
b. Considering the user experience.
c. Better visual experience

3. User Experience
a. autofocus and usable keyboard input control to switch the input focus With JavaScript after the page has finished loading automatically and immediately focus (focus) to the first input controls. Available TAB key (IE the default implementation ) or the arrow keys to switch focus to the next input controls.
b. available Enter ( or Ctrl + Enter) key to submit and click the submit button to ensure the effect is the same Do not add onClick = "..." this JavaScript code on the submit button.
c. Tips and respond to mouse movements
Positioning the user's mouse operation, when the position to be the response should be given a visual or audible prompts . d. The client to verify the legitimacy of the input data is completed as early as possible Examine the legality of the input data should be validated client using JavaScript . Unless the server side validation can only be done, otherwise the validation should be done in the case of the first to complete .
e. Depending on the application scenario in the decision to submit the form page and return whether to use an intermediate page between pages Depending on the application scenario , to decide whether to display the received form page ( returned after submitting the form page and page transitions between the middle of the page ) , as well as how to use the display receives the form page .
f. Prevent duplicate submission form processing After clicking on the submit button is grayed out treatment to avoid doing slower network response submitted by the user to repeat the same form . Avoid using the page expired user browse back repeatedly submit the form.
g. Page links open a new window , using the principles of the original window or pop-up window Generally, you can use the home page link target = "_blank" attribute to open a new window , and links to other pages should be used on the original window or pop-up windows. If you link the original page content is relatively unimportant page , is a subsidiary nature , the way you can use the pop-up window .
h. Arranged as few options , as few steps arrangements Arrangements as little action menu options based on user habits , while ensuring the least possible steps.
i. Operating logic without loopholes , to ensure safe operation of the data is Logical relationship between multiple operations on the operation between multiple pages and pages designed with safety and rigorous . Users will not be allowed to ensure that the operating portfolio , not because of improper operation of the user causes an error at least .