Page design (web design) 5 Tips

In a sense, page design (web design) is the user interface design. There are a lot of tricks that can help us create beautiful, practical interfaces, and 5 tips collected here will help you. These techniques do not depend on specific themes or templates, so they apply to design in most cases. No more wordy, let's get started!

1. Improve the link experience
Text links in a Web page are usually underlined, indicating that the text is clickable, but the clickable area does not exceed the width and height of the character. When designing a clickable area with hyperlinks, you can use a few tricks to increase usability, such as increasing the interval and, in some cases, converting the link to a block element . As shown below, use highlighting to distinguish between clickable regions.

Obviously, the larger the clickable area, the easier it is for the user to click. When the width is not specified, the link is converted to block elements so that the clickable area of the text link expands to the width of the entire container, which is especially useful for links to sidebar. This technique can be achieved by using the following CSS.

A
Display:block;
padding:6px;
}

Note: Because converting to block elements only works on the width of the link, you need to set the interval (padding) to ensure that the block is spaced vertically.

2. The button also needs typesetting!
The design of every detail error may be the perfect product into mediocrity, such as buttons, tab such simple interface elements, because users will click countless times a day, also need to be appropriate for typesetting. Take a look at some of the following examples:

At first glance, there is nothing wrong with the image, and careful observation shows that the button and select text are biased, because the lowercase letters as the basis for typesetting, lowercase letters in the middle, the position of the entire text will appear biased. The following figure:

Just like in the picture above, if the text on the button contains uppercase letters or some higher lowercase letters, such as "t,d,f,h,k,l", the text appears to be biased. Therefore, you should usually use uppercase letters as the benchmark for positioning, or, if you have more lowercase letters, move the position of the text up slightly.

The text layout above makes the button look more comfortable, focusing on small details like this to help the interface design.
Big head: Although Chinese does not have the problem of uppercase and lowercase letters, but there are a lot of page design does not pay attention to the text typesetting button, resulting in dislocation.