Home > Article > Web Front-end > When the title cannot display the complete solution_Experience exchange
In fact, it is recommended to use css to control the hidden display
That is, the title is not fully displayed due to the width of the design. It seems that a program is used to truncate the text. I think many websites encounter this situation. For visual effects, truncated display has to be performed to meet the overall visual effect of the website. Usually we use two methods of truncation. One is to set a certain number of characters in advance during background output. The other is to use CSS or JS to visually clip the complete content that has been output.
When web standards did not rise, the first method was basically used to solve this problem. This method is still widely used until now. The advantage of this method is that it can accurately cut the number of words, but the disadvantage may be that the output content is incomplete because the cutting work has been completed in the background. The second type is a deception made through CSS or JS. Hide content beyond a certain length. In order to achieve the required visual effects, the advantage is that it can retain the complete data content. The disadvantage may be that the text intercepted by non-IE browsers is not perfect. For example, Firefox often has the embarrassing phenomenon of truncating half a word.
The question I want to ask is: "Will the incompleteness of the title affect the user's motivation to click?" I boldly make this conclusion: The incompleteness of the title will affect whether the user will click to a large extent. The motivation for the message. Here we use a news headline from Youai.com for analysis. There is a news headline on the website, "The United States Invents New User Interface Technology and Blows It", which is a mechanically cut-off headline. Whether our curiosity is piqued by such a title, of course it is possible. But our understanding may be this: "The United States has invented a new user interface technology, and they are bragging about it... This is anti-fake news. It may be that the two companies are bragging." If this is the case, then I will not hear such gossip news. Interested. However, the complete title should be: "The United States invented a new user interface technology that can operate a computer by blowing on it." I am more interested in such a title. I want to know why this can operate a computer by blowing on it. This is me Something I never thought of. In this way, I will be very interested in clicking to view this news. We can compare and find that the thing that arouses our curiosity the most is actually the "blowing operation". This is the core of the new technology. This is also the core content of this news.
Of course, sometimes truncation is necessary, otherwise the entire website will look very cluttered. So now the general solution is to add the "title" attribute to the link. When encountering such a title with unclear semantics, I usually hover the mouse to view the text in the prompt area to obtain more complete title information. This completes the judgment of whether I click on the news. But it is a pity that the title attribute in the title link of Youai.com is the same as the title content, so the meaning of the title attribute is greatly reduced.
When designing, of course we try to display the title as completely as possible. If it cannot be displayed completely due to special needs, we must try to make the title attribute as complete as possible.Also, although CSS truncation is flawed in Firefox, I still think truncation should be done by CSS. At least this way we can get a complete HTML information document. When there is no CSS, at least we can still see the complete information content.