<br />Recently, UCDChina wrote a series of articles on the theme of "Pay attention to the text on the interface", which benefited me a lot in using text on the interface. Afterwards, I also made some summary and analysis on the performance of the content on the button, and shared it with you and hoped to get your corrections. 1. Don’t differentiate between buttons and links. ( The points listed here are not intended to attack other people's views, but are just for reference.) Many people advocate the distinction between links and buttons. Here, Civic has an article "About Mouse Click Objects: Which Should Be Buttons and Which Should Be Links." Chouyu's "Functions and Performance of Web Page Buttons" divides buttons into two categories: real buttons and pseudo-buttons. In fact, whether it is a button or a link, the task can be completed according to the user's goal guide. The link can also be made into a button to highlight the user's goal. Furthermore, it is not always possible to define the functions of buttons and links. If a button is designed to cause a "functional event", then is a link that opens a new page also a functional event? Therefore, in order to highlight the important functions of the current page for users to complete, even if it is just a link, it can be achieved through buttons visually and semantically. Of course, it is not recommended to use too many buttons on one page . For example, on Taobao's product page, in order to allow users to easily find the source of the current product and other relevant information about the store owner, they changed the previous link to a button: ![]() 2. What happens when I click At present, the text content on the buttons on various websites does not have any subjective ideas. It is whatever comes to mind without much consideration on the text. As mentioned earlier, links can be used as buttons, but sometimes a long string of text is a link, such as the title of an article. The text on the button needs to be concise and easy to understand so that its meaning can be quickly understood. Let's look at a few examples for comparison: ![]() A: This is the window that NOD32 antivirus software displays when it encounters a virus. When users encounter a virus, they will be a little fearful and cautious. They want to quickly keep the virus out, but they are not sure whether the system itself will be threatened. When this window pops up, two questions will arise about the "Stop" button. Will clicking this button stop the software blocking? Or stop the threat of the virus? ![]() ![]() B: Look carefully at the words on these two buttons. "Write a diary" is taken from QQ space. It has a predicate and an object. Of course, the subject is the user "I", and the combination is "I write a diary"; "Buy" is taken from Taobao's product page, but it only has one predicate (action), and the combination that can be completed is "I buy the product." But they all fulfilled their duties in their respective positions just right. Why? I will summarize it later. ![]() C: “Click to enter” is completely redundant and only increases the time users spend on the button. So, usually: a button, combined with other interactions and information organization on the page, should be able to be properly combined into a complete sentence "what happens when I click it", and the three words "I click" are between me and the mouse, and do not have to appear on the web page . So the "click to enter" on the button in Example C is redundant. As for what is just right, why the "buy" on Taobao with only a predicate verb can be just right, this is related to page interaction. My analysis is that when the user and the page complete a task, a series of interactive events occur, and this object comes with this series of events. If another object is added here, it will create an ambiguity of returning to the beginning of the series. Conversely, if a page contains multiple series of interactive events, an object must be added to the button to make it clear which event occurs when the user clicks . ![]() A series of events ![]() Multiple events per page 3. Using shapes to express meaning <br />Chinese oracle bone inscriptions used shapes to express meaning, and later, after reaching a consensus on a large number of characters, people did not pay much attention to the actual origins of the characters. The same is true for buttons ![]() Consensus button ![]() The button without consensus will not work. 4. Look at some more buttons ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() |
<<: JavaScript Advanced Programming: Variables and Scope
>>: MySQL View Principle Analysis
So which one of these formats, GIF, PNG, and JPG,...
Solution 1 Completely uninstall and delete all da...
If someone asked you whether running EXPLAIN on a...
Over a period of time, I found that many people d...
Including the use of check boxes and radio buttons...
You can go to the Ubuntu official website to down...
Table of contents Preface 1. Monadic Judgment 1.1...
Recently, I plan to deploy a cloud disk on my hom...
1. Check the character set of the default install...
In the table header, you can define the dark bord...
<br />Now let's take a look at how to cl...
Table of contents 1. Install the required environ...
1. Grammar: <meta name="name" content...
1. Purchase a server In the example, the server p...
Table of contents Preface 1. unknown vs any 2. Th...