Import word/text formatting from pasted text

I tried search with no current answer - but wondering if there’s a way to keep formatting like bold text - larger font, tabs, etc.?

I’ve been presented with 7000 words of business lingo content - all of which is pre-formatted – even though I have to rearrange this manifesto into an actual website - it would be nice to not have to go through line by line and tweak - the text all comes in as plain, single formatting. At least the paragraphs work.

Question PART 2 - How to deal with so many words? I can move some to different pages obviously, but I thought about drop down/accordion sections (or pop ups?) - neither which seem user friendly. There’s always link/anchors combined with page jumps. Just wondering if anyone else has had such a huge amount to get up online and looking friendly/readable.

Thanks in advance!

Pasting formatted text does attempt to preserve sizes and text color, mapping the incoming color on the available colors. Tabs are not a thing in web content, so that sort of alignment needs to be recreated separating text in different boxes.

Long text isn’t necessarily a bad thing, and letting people read it by scrolling isn’t as bad as it sounds. Accordions and popups, albeit heavily requested and popular on the web, aren’t good interactions in my opinion.

1 Like

I like @duncan am not keen on accordions (unless played by Simon Care😀). If the text is well written and informative then people will want to read it. Do make sure you know what devices the users of the site are likely to be using. If it is a portrait smartphone then design for this. On wide devices consider flowing the text as two columns.

A few other things to consider that you, or others with this problem, may find useful are:

  1. Typeface choice is vitally important for large amounts of text. You can get some excellent ideas of type combinations online. I find Typewolf’s website a great source of inspiration. If you are likely to be producing text heavy sites then the checklist is worth it.

  2. Try to keep your line length to about 65 to 70 characters including spaces. This is what the brain finds easiest to read. You may need to adjust the font size to achieve this. Obviously, you can’t go too small on portrait phones so you may need fewer characters on a line for this device.

  3. Watch out for orphans (and widows if using two columns). Judicious use of non-breaking spaces helps keep things together.

  4. Subtle changes to the line spacing can make a huge difference to readability. Sparkle uses a line height of 1.4 by default. Try reducing this to 1.2.

  5. Depending on your font choice, increasing the tracking a smidgen can make a huge difference to readability, too.

  6. Period space or Period space space? The latter is considered easier to read but will need you to change the space following the period to a non-breaking space because HTML ignores multiple spaces.

There are myriad other ways to improve the appearance of text on a webpage but you are always at the mercy of the text renderers of individual browsers on different operating systems and any user settings or custom style sheets in use. You can only do your best and try to have fun doing it!

2 Likes

Thanks to you and Duncan for the feedback. Tips for readability are especially appreciated!

Here’s another idea for dealing with 7000 words.
Write an “executive summary” a few paragraphs long, post that on your homepage, and offer a link to the full document, either on another page or as a PDF download. Tease the important points, then for those you’ve “hooked” they can go get the rest. Another little suggestion: Start each paragraph with a large font size, maybe in a different color text.
Perhaps dress up the page with a few small graphics that the text wraps around to bring some color and interest to the homepage.

2 Likes

Very well said @FreewayFugitive! :slight_smile:
I would add to always always always use Web Fonts and not System fonts. System fonts are unique to the OS (operating system) and so the text rendering in the browser will always substitute to something similar and in most cases throw out all your text leading, spacing, etc…

A really well thought out take on humongous amounts of text on a web page @macmancape! :slight_smile:

Well said – mostly – especially the line length thing, which is so often left unconsidered.

The above, however, I’m afraid is simply incorrect. Double spaces between sentences date back to the time of typewriters and monospaced characters. At this time a double space did clarify confusion.

Unfortunately, it carried though as a fad into secretarial colleges for a while even after typewriters were no longer used and double spaces were not needed. Thus, every MS Word documents seemed to use it and it became the de facto norm.

In reality, with proportional fonts, it is unnecessary and, in fact, a hindrance to clear communication. The designer of the font will have considered this, unless it is one of the millions of poorly home-made fonts out there. Any extra visual space required between sentences is provided by the full stop itself, anyway

Double spaces create holes in the text which interrupt the flow, in the same way overly long or short line lengths interrupt flow.

Find some double-spaced text and squint at it, all those holes become apparent, like narrow measure, justified, un-hyphenated text.

In short, typographically speaking, it is an abhorrent anathema!

[Try it here, thankfully, the software strips it out]

Whilst we are in full-on type geekery mode, a couple of other atrocities which should be avoided at all costs – and if I had my way would be capital offences – are:

  1. The use of straight quotes instead of typographic quote marks. It’s just lazy and ugly. Also misuse of possessives, but that is drifting into grammar, rather than typography – though equally irksome.

  2. Using hyphens instead of en and em rules. Again lazy. They are there for a reason.

  3. Finally, if you do need wider spaces – and there are legitimate uses – use an en space (or even an em space, on very rare occasions).

Sorry, if this comes across in any way as sanctimonious, but I’m type-obsessive, it goes with the territory!

1 Like

Quite right @sprout about the period space. I should have qualified my statement to apply to badly made or system fonts (good point @FlaminFig). However, this study showed that people who use two spaces (probably those who were brought up in the typewriter days and the early monospaced CRT computer display era) can find it easier to read but, interestingly, not to comprehend. The study even resulted in an edition of the APA style manual recommending this practice, quickly reversed in the next edition!

The space/two space argument has a long and complex history. If anyone is interested this is a good summary from Chicago Manual of Style Shop Talk.

Now, does anyone want to throw anything in regarding serif versus sans serif typefaces :wink:?

Nah, let’s just use Comic Sans…

I’ve used some of the tips provided here and it definitely helps. Work in progress - Services (simple site - nothing fancy)
The vast majority of the high word count fell on this page.

The array of buttons jumping to anchors, places the topics (selling points) at a more visible level - which they felt was important.

Too many items for drop down menus - and dividing them up over pages wasn’t ideal either…