2

There is an enterprise system where all entities are interconnected.

Let's say we have following entities for a example: Customer, Order, Product, Contact, Employee.

The preferred GUI style is keeping everything flat and minimal.

Let's say we want to display the following list (mixed tile-row layout):

Customer, Contact, Order, Product, Employee

MegaCorp, Jon Smith, X12345, Hammer, Ivan Ivanovich

The idea is to make each of those values clickable, so that user would be able to see the details and history of each entity.

Is it possible to avoid making it look like a list of blue emphasized links while adhering to web standards and keeping it minimal?

Improve this question

2 Answers 2

Reset to default
2

For accessibility sake (WCAG standards):

  • As opposed to what Google or SE does, you really should include underline in order to provide a visual way to distinguish links from non-links.

  • Don't use colours to convey meaning. (1/4 people are colourblind) Some things you could consider are perhaps using clever typography and make each entry more human readable.

Source: About 8% of all men are suffering from color blindness. (http://www.color-blindness.com/2009/01/06/50-facts-about-color-blindness/)

A suggested approach for desktop, is to use icons or have a hover effect to indicate that item is clickable.

Also, not sure why you need each cell clickable. Maybe you can make the entire row clickable so everything for this person's profile is available in one place on 1 click instead of 4? Would make it easier and faster for user to get to all the information in context.

Improve this answer
8
  • 2. "...make the entire row clickable..." - I want to make it feel like Facebook's graph of entities, rather than a more old-school master-details interface. Every entity is interesting in it's own way so has an entity-specific details page. It would be nice to keep all 1-st level relation entities always just one click away.
    – Den
    Commented Jan 9, 2015 at 9:17
  • 1
    Accessibility is a legal requirement in Ontario, Canada. Not sure if it might happen for where you are but I do know it's an international initiative so perhaps it may happen that you will need to cover colour blindness. 1:4 ratio related to everyone in the world
    – Pdxd
    Commented Jan 9, 2015 at 12:48
  • 1
    it's an internal product. Also, I noticed Twitter has three different <a> styles on their home page alone: all white just like the header text, some underlined always, some underlined on hover, some never underlined. Does it mean that Twitter is illegal in Ontario?
    – Den
    Commented Jan 9, 2015 at 15:00
  • 1
    Actually, as an internal tool, you should also consider what your company's policy is on equal opportunity. I've worked on these products in the past as well and if you want to minimize effort, just make sure it meets the internal legal requirements.
    – Pdxd
    Commented Jan 9, 2015 at 15:09
  • 1
    People don't announce their invisible disabilities at work. A few years ago I observed the roll-out of internal call-centre software upgrade, and one of the client's employees had been hiding his limited vision. (He was legally blind.) This came up because the app crashed in the Windows high-contrast mode that he needed in order to read the screen. The employee could no longer do the work. That's a story from my work. In your own work, I urge you to think carefully before you say "[any minority status] not an issue in my environment," because you don't know what people haven't disclosed.
    – JeromeR
    Commented Aug 22, 2015 at 23:05
1

I understand why you’re asking this question but unless it is underlined or has different color users will not distinguish links from non-links.

  • I would use navy, muted green, or brown with medium gray for non-link texts.
  • Avoid using highly saturated colors.
  • Use slightly different color for mouse-over.
  • No underline for link heavy website.
Improve this answer
4
  • @DesignerJ To be more specific: what to do when every field of a row is a link and there is no other content? If I open Wiki or Google every link is blue, but they have a lot of other content. Maybe this problem doesn't have a win-win solution.
    – Den
    Commented Jan 8, 2015 at 15:01
  • @Den I would still use color for all links. I know If you don't choose the right color it will look very busy. If you want to follow Standards and Rules what 'Pdxd' said is absolutely right. But I wouldn't use underline if all contents on certain page are links. It will be annoying to read.
    – Designer J
    Commented Jan 8, 2015 at 16:10
  • @Den you'll probably have other text on your site, yeah? Non-clickable text on other pages, headlines etc. So coloring links here is useful relative to other text on your site.
    – Drew Beck
    Commented Jan 10, 2015 at 22:10
  • @DrewBeck the thing is that there is still more links than content. But I have found a middle ground with links being very subtle (dots instead of solid).
    – Den
    Commented Jan 11, 2015 at 13:02

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