Don't Quote Me

Hierarchy is important, on web-pages, just as in real-life. People need to know where they are; they need to know where the current piece of information fits in as a whole. It gives people a sense of direction, and lets them know where their current location fits in whatever you’re trying to present them.

If you’re reading an article, it makes sense to have something pointing you to even more articles:

Articles » Don’t Quote Me

That bread crumb would inform you that you’re reading an article, and if “Articles” was a link (imagine it is) it should lead you to more articles.

We’ve gotten good at this as a whole; we’re presenting relationships in a logical manner even more. However, there is a problem…

Quotation Marks

That glyph in the previous example (“»”) is a quotation mark; for a host of nations and languages.

Let’s look at a few more examples:

Articles » Don’t Quote Me

Articles › Don’t Quote Me

Articles ” Don’t Quote Me

Articles ’ Don’t Quote Me

Articles „ Don’t Quote Me

Articles ‚ Don’t Quote Me

All of these symbols have one thing in common: they are all quotation marks; they do not naturally resemble a relationship. This is a problem if your main language–the language you use most fluently–is not English.

The first two examples “fit”; they seem to point to the second item. I know they look snazzy (and the fact there’s a pointy-end and a nonpointy-end don’t help), they just don’t work.

The last four are quotation marks, in English and other languages. They don’t “fit”; something feels odd about using them in this context. Do they resemble a relationship between the two items?

No. They are out-of-place. English-speaking programmers/designers wouldn’t use an English quotation mark (or those last two at the bottom) to signify a relationship; why do we use a foreign-language to do so?

What’s a Boy to Do?

Let me all introduce you to one of the seldom-used “arrow” glyphs:

Articles → Don’t Quote Me

The arrow is universal, it starts somewhere, and goes to another place, as-if to say: “Hey, I’m taking you here. I know you stared over there, but this is where we’ll end up. These two pieces of information share a relationship, and the direction of my pointy-end shows you an example of that relationship”.

There’s also an arrow going in another direction:

Articles ← Don’t Quote Me

Just looking at it you know that there is a relationship to these two things. They go together:

Mom and Dad → Lil’ Jessica

It might as well say:

Mom and Dad had Lil’ Jessica

Taking it a step further:

Lil’ Jessica belongs to Mom and Dad

Depending upon use, and how you decide to prevent your information, you can utilize various arrows in different positions and context to show your avid readers hierarchy & relationships:

  1. ← ← leftwards arrow
  2. ↑ ↑ upwards arrow
  3. → → rightwards arrow
  4. ↓ ↓ downwards arrow
  5. ↔ ↔ left right arrow
  6. ↵ ↵ downwards arrow with corner leftwards

Of course, this solution creates a problem: using arrow glyphs inside the HTML title tag is problematic. I’ll admit it first: I don’t have a solution to this.

The Dash Glyph

I’m well aware that some languages use the – (–) as the start of a quote. It does, however, signify a change in pace or thought in the English Language. I’m okay with this; it already has multiple meanings.