|
|
|
|
|
by araes
4542 days ago
|
|
There does seem to be an assumption that making your reader "feel better" while they read is a good thing. However, the tactics in the article may actually be counter to what a lot of websites want - I.E. the Cracked example. Your eyes "squinting and darting", and the need to "second guess what you should be reading" is actually desirable. They want you to read more / different content on their site. Its possibly more desirable for you to feel distracted and vaguely unsatisfied by the experience, because then you're hunting for the next hit. Admittedly, there's still a presentation difference between places like Cracked (fuggly blog style) and sites with similar motives (Reddit / HN). In that case though, the deciding feature is mostly minimalism (list presentation, no huge ads, no content tiles, limited social content links, very light scripting). Similar to why I prefer them over traditional blog layout news sites (Reuters, CNN, ect...) as the initial step of surveying the days events has Way less overhead. |
|
The elements I attack:
⚫ Anything that moves. Animations, sliders, pop-ups.
⚫ Fixed elements: headers, footers, fixed-position social bars.
⚫ Fonts. My preferred reading font is 15pt (about 20px on this display). Most sites seem to run between 12-14px, which is painfully small.
⚫ Crappy contrast. Backgrounds should be light.
⚫ Anything "social". If I want to share your content, I've got a perfectly good URL with which to do it.
⚫ Interstitials. If you're relying on those for advertising or messaging, I'll see them precisely once.
⚫ Sidebars. I either nuke them entirely, or de-columnize the page. See: http://www.reddit.com/r/dredmorbius/comments/1tniu3/user_sit...
⚫ I find call-outs and images floated to the right rather than the left less annoying (at least in ltr languages). So I move those elements to float right, clear right, and pad with 10px (or 0.5 em), add a 1px border, and a 20px (or 1em) margin. Often a shadow drop for images just for grins (see above).
⚫ I find a blue link color is far less distracting than other alternatives. Many sites seem to prefer red/orange links (they stand out), my usual preference these days is for #1e6b8c (or something close to it).
⚫ I've found both drop caps and bold leading lines useful in some cases for affordance -- especially in streams of aggregated content where practice of the originating source doesn't include strong ledes, these at least allow you to find the start of a post easily.
The saddest overall impression is that most web design is actively hostile to reading.