3

I have a lot of text for the website and all of them are important. I cant cut down the text much.

Then, is there any better way to represents those text?

The contents include some bullet points and two or more independent headings.

1
  • Some good answers on formatting - but the fundemental one is 'does the user actually need / want all that text' - You might think all the text is important - but does the user ?
    – PhillipW
    Jul 16, 2014 at 16:50

5 Answers 5

1

There is several tricks.

  1. Split information to paragraphs with different level headers. Like you can see at wikipedia http://en.wikipedia.org/wiki/Article_(grammar)

  2. Hide information and show the wide button [show more]. Don't forget about formatting.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

  1. Hide some paragraphs under accordions
  2. Show more info and simple view on the side like this: http://about.pinterest.com/en/terms-service
2

Depends on the purpose of your site. You have some techniques to improve your page with a lot of text. You could use some approaches like @Pierre's and Aleksandr Blekh answer. But if you can't hide your text for any reason, you have other options:

  • Choose a clean and simple font:

    To makes the text more attractive and easy to read.

  • Combine big titles with colors and font-weight: bold;

    Focus the user attention on the most important things in the text: example 4.

  • Wrong way (example):

example1

  • Now, the correct way with the same text:

example 2

  • You also can use visual elements with icons or images to improve your design:

example 3

source examples: http://focuslabllc.com/

1

It actually all depends on the purpose of your site and of course of its users.

If you take the example of a newspaper website, no one will argue that displaying a lot of text is bad practice. Such sites, however, have taken design steps to continually improve the experience for their users. One interesting idea is to take advantage of the "reader" feature of modern browsers :

enter image description here

If applicable, you can also first display the beginning only or split and paginate your content to give your users the opportunity to :

  • take a first look and make a decision to go further or not
  • take control and interact
  • have shorter loading times

enter image description here

1

Adding to some approaches mentioned in @Pierre's answer. You could use some visual elements that hide portions of the information (text, in your case) and display the hidden portions instantly on demand (usually, following user's action, such mouse click). Such visual elements include, but are not limited to, tabs, expanding text panels and widgets (I'm sure that the terminology differs across UI/UX libraries and frameworks). The same on-demand display behavior can also be implemented via simpler elements, such as combination of text panels and check boxes or drop-down lists, albeit with lower development productivity.

0

Without meaning to be facetious, printed books have spent centuries refining solutions to this problem, on several different levels. If you want to make it easy for someone to consume a large body of text through a rectangular viewport, look at the page of a comparable printed book and imagine it's a browser window.

Websites tend to strongly emulate printed periodical design, because commercial content websites are very similar to magazines in their intentions and business strategy, i.e. keeping readers (over)stimulated and constantly diverting their attention to ads. This tradition will work against you if you're trying to help readers pay attention to a long text.

The most obvious difference between a book page and a web page is that the book has nothing apart from the text, plus a page number to mark your position. The second most obvious thing is that books (especially those with higher production values) use a huge amount of whitespace, which for some reason we're needlessly afraid of doing onscreen. If you can fit more than 10 words per line, then you can afford to use more white space!

printed book

I would actually take an opposite line to some of the other answers. You want the reader to get comfortable and read the whole text from end to end, so own that; don't paginate or supply widgets to help the reader skip around the page, and let the scrollbars show that this is going to take a while. People can happily read 300 pages of Stephen King in one sitting, with no hyperlinked ToC or elaborately-diagrammed structure or other assistance, so let them approach it that way.

(Of course, this makes it even more important that the text itself is readable and well-structured).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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