8 points to note about Web programming small details

For a long time, we have created certain conventions and practices that are built and scoped to enhance the usability of the website. Then there are always some omissions and flaws in our web programming. Today,e-Mentor Network inThis summarizes some of the small errors that are prone to web programming, and gives the appropriate remedies to help improve the usability of the site. (You can also go to see the relevantFreeWeb Development Video Course)as long as you avoid these errors, the user experience of the site will be greatly improved.

Error One: The form label is not associated with the corresponding field

650) this.width=650; "src=" Http://static.oschina.net/uploads/img/201512/23134015_PKdS.png "style=" padding:0px; margin:10px 0px;border:1px solid RGB (221,221,221); Background:rgb (244,247,249); "/>

Use the "for" property to enable customers to select the correct input field in the table by clicking on the tag. This is a larger clickable area for both check boxes and radio fields.

Error Two: Logo chart is not linked to the homepage

650) this.width=650; "src=" Http://static.oschina.net/uploads/img/201512/23134015_HTMC.png "style=" padding:0px; margin:10px 0px;border:1px solid RGB (221,221,221); Background:rgb (244,247,249); "/>

Adding a link to your logo to the homepage is a very basic point. And most users will naturally think that through the logo can return to the home page. The logo is best placed in the upper left corner.

Error Three: The Access status of the link is not displayed

650) this.width=650; "src=" Http://static.oschina.net/uploads/img/201512/23134015_Jkbz.png "style=" padding:0px; margin:10px 0px;border:1px solid RGB (221,221,221); Background:rgb (244,247,249); "/>

The access state of the display link is often ignored. It is important for the customer to see whether the link has been clicked at a glance.

Error Four: The currently active form field is not displayed

 650) this.width=650, "src=" Http://static.oschina.net/uploads/img/201512/23134015_wZlW.png "style=" Padding:0px;margin : 10px 0px;border:1px solid RGB (221,221,221); Background:rgb (244,247,249);/>

You can use "focus" to select or bundle elements. However, the most useful approach is to use the input and text areas to indicate that the field is active. Contains some CSS styles, such as a highlighted border, or a slight change in the background color.

Error Five: Picture not added description

650) this.width=650; "src=" Http://static.oschina.net/uploads/img/201512/23134015_GV40.png "style=" padding:0px; margin:10px 0px;border:1px solid RGB (221,221,221); Background:rgb (244,247,249); "/>

Unless it is a purely cosmetic use, the ALT attribute may not be filled in, otherwise remember to add a descriptive statement to the picture alone. The advantage is that the image is treated as a link, and the search for the corresponding Description statement will access the link.

Error Six: Background image without background color

650) this.width=650; "src=" Http://static.oschina.net/uploads/img/201512/23134015_o3Q6.png "style=" padding:0px; margin:10px 0px;border:1px solid RGB (221,221,221); Background:rgb (244,247,249); "/>

It is common practice to use background images for a certain part of the content. It is worth mentioning that if the customer disables the background map, this part of the text will not be visible. So it's best to set a background color.

Error Seven: inconsistent interface design style

Excessive creation can sometimes be superfluous. Some designers are prone to make such mistakes, the same Web page design is different. This is more than chaos for users, it is simply annoying! No matter how stunning a website is, if the overall style is incoherent, users will not be recognized. Suggestions:

1. Use the template.

2. The key is to be concise.

Error Eight: underline non-linked content

650) this.width=650; "src=" Http://static.oschina.net/uploads/img/201512/23134015_sNLU.png "style=" padding:0px;margin:10px 0px;border:1px solid RGB (221,221,221); Background:rgb (244,247,249); "/>

As you know, the underlined or shadowed content is probably a link. In order not to mislead users, it is best to use bold or other emphasis marks to indicate the emphasis.

8 points to note about Web programming small details