: Any tips to design for a 1024 resolution? (especially with fonts and font sizes) In terms of tips, are there any good resources or things to keep in mind with things like font and typography?

@Murray976

I must say, 1024px is more or less the average resolution (or a minimum, probably, because numbers change quite a lot), so I don't see why you wouldn't be taking the same things in consideration you would do for any other site.

FONT SIZE

There are two current "trends" in font size, one would be min body text of 12px and the other one minimum 16px.


The 12px trend:


This trend got really strong during the first days of Web 2.0, with some (illegible) texts appearing all over sites. One thing is for sure: Never go under 12px.


The 16px trend:


There are some particular findings that are pivotal to issues such as readership and readability and comprehension, which is really what body copy is all about. Some facts for supporting 16ps:


At age 40, only half the light gets through to the retina as it did at age 20.
About 9% of people have minor or major visual impairments
The distance at which we can read letters is a common measure of both legibility and reading speed.
Most people, when sitting comfortably, are about 20 to 23 inches from their computer screens.
16-pixel text on a screen is about the same size as text printed in a book or magazine.


A good source is "16 pixels body copy. Anything less is a costly mistake"

FONT FAMILY

Basically anything that renders nicely in different devices ans browsers. Sans-serif is apparently better for readability (body), while Serifs look nice for titles.

LAYOUT

You mention a large amount of data. This might be better suited for UX, but do you need to show everything at a glance? A good option is to disclose information by steps, so only show what the user needs to see, until he/she asks for more info. Tooltips are great for this. Also lightboxes and sliders.

FInally, your best friend for legibility will be negative space. Whatever you do with your info, make sure you have enough space between your elements. Even if you are working with a small font, it will be much easier to see if it's surrounded by clear space.

Vote Up Vote Down