on
Broken UI Design
As many do, german FAZ allows their readers to comment their articles on the website. The headings of the newest comments are shown right below the article. If you want to read more than the header, you have to click on the comments title.
Now, the broken design starts: FAZ presents you a page that contains an abstract of the article you came from, plus a list of the comments. But they (again) show the headers only. If you want to actually read the comments, you have to click on each and every single comment to show the text.
It’s getting worse: The heading is not a HTML-link. It’s a HTML-heading with an on-click Javascript. This way, the browser’s status bar, where normal links show the link target, does not indicate that you can click on the heading. All you get as visual feedback is the mouse pointer that changes into a pointing hand, as it does for links.
To make it even more worse, the senders name, that is shown right below the comments heading, is a HTML-Link and styled like that. If you click the name, a new window is opened that shows some details about that person. It does not show the comment but a link called “Show comments of reader xxx”. Clicking this link does not show the comment you came from. It shows a list of all comments written by this reader. Again, headers only. And again, the header is not a link but the text below the header (that describes the article the comment was for) is.
Next to every comment’s heading, there is an indicator about the rating of the comment. Clicking on the indicator (that is not a link but reacts to clicks anyway) does not submit your rating for the comment. It opens/closes the text of the comment. If you open the comments text when you see all comments for an article, there is a feedback section at the end of the comment (indicator at top, feedback at bottom).
Not so, if you opened the comment on the this-reader’s-comments-page: There is no feedback section in this case. You have to open the article, go to the all comments page, search for the comment, open the comment, click on the feedback indicator and then, if you are still willing to do so, can click on the submit button. (I’m trying hard not to mention that you can change the feedback settings after that but there is no longer a submit button.)
Lessons to learn
- If something is to click on, make it look like something to click on.
- If you promise to show the comments: Do so.
- If, on one page, there is an indicator and a knob to change the value: Place them next to each other.
- If a button has been disconnected: Do not show it.