4

In this question I asked about the appropriate label for viewing/editing an item in a list.

I settled on a different solution than any there given - that of using a link for the viewing/editing, and a button for the delete. The reason being that the link is more semantically correct - it will navigate you to the details of the item and there you can view, edit, etc.

enter image description here

However now I have another problem...the button seems more noticeable, and more prominent. I would like the link, which is the more frequently used action, to be more noticeable, enticing, and prominent. I want it to be the obvious first choice for a user.

When I have a link and button side by side, and the link is the more important action, how can I SHOW that it's the more important and frequent action?

Improve this question
  • 3
    Why don't you just move your button away? Ideally on another "column" otherwise even just right aligned (and if it has not to be mobile-friendly then also hidden until hovering). – Adriano Repetti Dec 1 '15 at 8:26
  • 1
    I've considered that. But I don't understand how that would make sense. This column is the "actions" column...seems like it would be confusing to have one column for each button. – richard Dec 1 '15 at 8:31
  • 2
    I don't mean one column for each button but, for example, details may stay in first column and "delete" (and/or "edit") in the last one. Often you may even skip "Details" link and directly make the title as link (assuming your links stand out enough). Can you provide a sample row and little context (mobile? desktop?) – Adriano Repetti Dec 1 '15 at 8:35
11

You have a primary and secondary action. Details is the primary action, delete is the secondary action.

What you could do is move the delete function into the window that contains edit/information. This has the added advantage of cleaning up your listing layout.

This will only work if delete is a fairly uncommon function and the use case is something like "I don't know if I want to delete this record because I've forgotten the details. Why don't I click on more information and then I can decide whether I want to delete it or not"

Improve this answer
  • That's a great idea! – richard Dec 1 '15 at 10:43
  • 2
    A possibly big problem here is that while delete may be rare, sometimes you want to do it a lot. And you just doubled the clicks (and hence time and error rate). To solve this, batch operations can be added. – Yakk Dec 1 '15 at 15:37
  • 1
    so on one day you might want to delete a whole bunch of stuff, so yes on this day it would be a pain. But you design for the most common use case, not peripherals. – colmcq Dec 1 '15 at 16:14
  • 1
    So I guess the answer is, you shouldn't need to because the link and the button shouldn't be next to each other. ;-) – richard Dec 1 '15 at 19:22
  • the comment from @colmcq seems similar to "let's develop the happy paths only, bad paths won't happen anyway". While it's important to work on the most common use cases, don't leave uncommon cases hanging: work on them later, but these on your backlog. – igorsantos07 Dec 4 '17 at 6:30
1

To give yourself some more information and possible ideas about how to solve this, take 5 to 10 minutes to scan the Microsoft Style Guide sections on Command links and Links. Even if you're not designing or coding for the Microsoft platform, there are some good concepts here.

In particular, the Command links topic may reframe how much supplemental explanation you feel you can provide with the command-link label, and the Links topic defines the difference between links for:

  • navigation
  • task
  • Help
  • definition
  • menu
  • option

There are several other ways to present this information, visually, to signal to your users which command is more important. One possibility is to switch the visual presentation of your two commands:

The commands are presented differently

And in the comments, Adriano proposed physically moving the button. Remember that (in the west) people read and scan from left to right, top to bottom. You can lay out the commands in this pattern to suggest that "this" goes before "that".

Improve this answer
  • 5
    Thanks @JeromeR. I want to keep "Details" as a link and "Delete" as a button because they are semantically correct - Details takes you to another page, delete acts on the data. – richard Dec 1 '15 at 10:42
  • Yes, it's important to get the details right. The section in the Style Guide on command links shows that a command doesn't need to be a button. So you've got one interpretation of semantically correct, Richard. – JeromeR Dec 1 '15 at 12:03
  • 1
    "shows that a command doesn't need to be a button" - Hm, "shows" might be overstating it. "States" or "claims", perhaps. Just because Microsoft have abandoned a principle doesn't mean everyone else has to. – AlexC Dec 2 '15 at 15:54

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.