Differences between revisions 26 and 27
Revision 26 as of 2021-02-15 14:51:06
Size: 12424
Editor: shoobe01
Revision 27 as of 2021-06-09 03:39:15
Size: 12475
Editor: shoobe01
Deletions are marked like this. Additions are marked like this.
Line 29: Line 29:

Click here to buy from Amazon.Greeking is a long-standing design term used to refer to using placeholder text or images instead of the real, final content. Traditionally this is important as the real text is not available, or would be irrelevant and you want the reviewers to see the design alone.


Design documents must by their nature represent content. In fact, I find it hard to understand why you design at all if you don't have real content. Content doesn't distract from the design, but is the point of the design existing.

But still, many design techniques like wireframing use boxes or other greeking methods, instead of using real content, even when it is available. This is a somewhat contentious issue, but our experience in design indicates that the proper choice is crucial in several different facets.

The many types of greeking, and some real content for comparison.

Aside from graphic representations of type, another common representation is the classic typographers greeking. The entire, original version of it is reproduced here:

  • Sed ut perspiciatis, unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam eaque ipsa, quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt, explicabo. nemo enim ipsam voluptatem, quia voluptas sit, aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos, qui ratione voluptatem sequi nesciunt, neque porro quisquam est, qui dolorem ipsum, quia dolor sit, amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt, ut labore et dolore magnam aliquam quaerat voluptatem. ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? quis autem vel eum iure reprehenderit, qui in ea voluptate velit esse, quam nihil molestiae consequatur, vel illum, qui dolorem eum fugiat, quo voluptas nulla pariatur? At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti atque corrupti, quos dolores et quas molestias excepturi sint, obcaecati cupiditate non provident, similique sunt in culpa, qui officia deserunt mollitia animi, id est laborum et dolorum fuga. et harum quidem rerum facilis est et expedita distinctio. nam libero tempore, cum soluta nobis est eligendi optio, cumque nihil impedit, quo minus id, quod maxime placeat, facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet, ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat. Hanc ego cum teneam sententiam, quid est cur verear, ne ad eam non possim accommodare Torquatos nostros? quos tu paulo ante cum memoriter, tum etiam erga nos amice et benivole collegisti, nec me tamen laudandis maioribus meis corrupisti nec segniorem ad respondendum reddidisti. quorum facta quem ad modum, quaeso, interpretaris? sicine eos censes aut in armatum hostem impetum fecisse aut in liberos atque in sanguinem suum tam crudelis fuisse, nihil ut de utilitatibus, nihil ut de commodis suis cogitarent? at id ne ferae quidem faciunt, ut ita ruant itaque turbent, ut earum motus et impetus quo pertineant non intellegamus, tu tam egregios viros censes tantas res gessisse sine causa?

    Quae fuerit causa, mox videro; interea hoc tenebo, si ob aliquam causam ista, quae sine dubio praeclara sunt, fecerint, virtutem iis per se ipsam causam non fuisse. -- Torquem detraxit hosti. -- Et quidem se texit, ne interiret. -- At magnum periculum adiit. -- In oculis quidem exercitus. -- Quid ex eo est consecutus? -- Laudem et caritatem, quae sunt vitae sine metu degendae praesidia firmissima. -- Filium morte multavit. -- Si sine causa, nollem me ab eo ortum, tam inportuno tamque crudeli; sin, ut dolore suo sanciret militaris imperii disciplinam exercitumque in gravissimo bello animadversionis metu contineret, saluti prospexit civium, qua intellegebat contineri suam. atque haec ratio late patet.

John McWade wrote in Before and After Magazine, Volume 4 number 2: "After telling everyone that Lorem ipsum, the nonsensical text that comes with PageMaker, only looks like Latin but actually says nothing, I heard from Richard McClintock, publications director of The Garnet at Hampden-Sydney College in Virginia, who had enlightening news:

"Lorem ipsum" is Latin, slightly jumbled, the remnants of a passage from Cicero's De Finibus 1.10.32, which begins thus: Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci veldt… [There is no one who loves pain itself, who seeks after it and wants to have it, simply because it is pain.]. De Finibus Bonorum et Malorum, written in 45 BC, is a treatise on the theory of ethics; it was very popular in the Renaissance.'

"What I find remarkable, is that this text has been the industry's standard dummy text ever since some printer in the 1500s took a galley of type and scrambled it to make a type specimen book; it has survived not only four centuries of letter-by-letter resetting but even the leap into electronic typesetting, essentially unchanged except for an occasional 'ing' or 'y' thrown in. It's ironic that when the then-understood Latin was scrambled, it became as incomprehensible as Greek - hence, the term "Greek" for dummy text."

This term has since been expanded to the broader meaning of any false content, even to include simple gray lines or boxes representing type.

Designing with words

There are several issues with the use of greeking.

  1. It is a specialized design language. The styles using boxes or lines, especially, will not always be understood by consumers of the document. Any confusion, even if solved before implementation, can cause delays, or induce errors in estimation.
  2. Far too often, the exact same fake content is used over and over again. Every bullet starts "Lorem ipsum" for example. This does not accurately represent the variety of content that would be encountered, so is not an adequate representation of the final design.
  3. Text greeking of the "lorem ipsum" variety is not universally recognized as fake content, so may have to be explained.
  4. Latin is not English, and does not have the same cadence, or average length of words or distribution of those words. Letters are also used at different rates, adding to the lack of fidelity with real content. This is non-trivial on mobiles as the lines will break in different places.
  5. They are not words, so you won't treat them as words. It's common for designers to do things like truncate or ellipsize impossibly short phrases in greeked text, then be unhappy when real text fails to work in the same place.
  6. They are not words so no one reads them. That means the eye tracks differently, and no one notices readability and legibility issues, again until it's too late and you have the real product built.

Many of these issues become worse on mobiles, with small column widths. Greeked text will wrap in ways unlike real content. This is even worse if the real text is in a particular technical language as there are no compound words, and phrasing is not organized in this manner.

The suggestion, therefore, is to use real copy whenever possible. Content either already exists, or will be created for your project. Either get this copy as early as possible (even if it is in draft or you have to make it up) or work closely with the content team to create enough for your mockups.

In the same way you are a design or software professional, writers have a specific skillset that cannot be simulated. I rely on writers whenever possible to help create everything from page titles to button labels. They will do a better job, in less space, than you can do.

Respect names and languages

Although already mentioned within the Order Data pattern, it is worth re-stating here that real names must always be displayed. Use caution picking names of individuals, products, and locales when providing placeholder or sample content. Make sure there is room for as many of the likely results as possible.

It may be useful to specifically keep long names for various data fields. For names, for example, I have long used a former co-worker (who has since returned to Thailand and teaches HCI), Narin Jaroensubphayanont. When you include hyphenated last names, this is really not that overwhelmingly long, even for the US.

This also points out a crucial lesson in regionally specific information. Different languages have different cadences, so if designing a global application, periodically load a language other than your default. Check local address and name formats to make sure they fit. If you think all addresses are like your home in the US (address line, then city/state/ZIP line) you are wrong. Businesses and foreign countries can have 5 or more address lines alone. Don't make assumptions.

Seriously, no jokes

If you have to make up content for temporary, internal use, there is often an inclination to use pop culture references, or make internal jokes. If you are still doing this, you will be surprised to find out what a bad sense of humor many, many people have.

Designers have been fired, and customers have been lost over placeholder copy. While guidelines could be provided, even around the edges of these there is room to make costly mistakes.

Even seemingly-innocuous fake content can cause immense troubles. There are incidents where placeholder phone numbers have made it into production. To look real, they were not 555 numbers or anything else clearly fake, so ended up not being fake but dialing real locations. Two real-world cases:

  • The phone listed for a retail store instead resolves to a house. The retired residents, having lived there for decades, received dozens of calls a day and do not want to change their long-held number that has now been published in numerous locations. Lawyers got involved, and it took years to sort out.
  • The phone number listed to contact customer care dials an "adult chat" number. This was easily rectified, but offended customers left, or had to be offered apologies from senior management and expensive enticements to remain customers.

Yes, really. These both happened at places I worked. Unless you want to talk to lawyers or justify to your boss's boss why it's time to send rebate checks to customers, don't let it happen to you.

Next: Type for Mobile Devices

Discuss & Add

Please do not change content above this line, as it's a perfect match with the printed book. Everything else you want to add goes down here.


Greeking (last edited 2021-06-09 03:39:15 by shoobe01)