Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 3 of 3

Thread: Font size

  1. #1
    Junior Member RichardC's Avatar
    Join Date
    Dec 2009
    Posts
    3
    Member #
    20538
    Hi,

    I have 2 questions, and then below that I've given some background info. I don't know how important or not the background info is in answering the questions.

    And thanks for any help


    My 2 questions

    First question: what size in Ems is ideal for body copy, and what size for labelling in forms?

    And second: in building a site/web app, where there are some items of text in forms that are quite long, what are the best ways of dealing with this?

    Simplified version:
    Click for full size - Uploaded with plasq's Skitch - is this bad form design? - moving the input field for the the longer text like this.

    I put 6 solutions that I can think of below. Number 7 or number 2 appeals to me, with some of number 1 where it's possible, but my web designer thinks number 2 would result in a cluttered layout (my answer to that is: not if it's done neatly and mindfully. I'd also consider some of number 6 but not if this means potential probs relating to the code.

    1. Shorten the text of the label - disadvantage = can sacrifice clarity of message

    2. Run text onto 2 lines - disadvantage = possibly less neat design?

    3. Decrease size of font throughout the website - disadvantage = sacrifices readability throughout

    4. Decrease size of font for specific labels - disadvantage = looks out of place

    5. Move distance between labels and text fields throughout - disadvantage = sacrifices aesthetics

    6. Move some form fields further to the right - disadvantage = my web designer said this is bad form design and would mean less streamlined code

    7. Move labelling to above text fields. - disadvantage = while I think this would work for some items, there are some pages where I think this would make it less easy to review information - as it would be perhaps less easy to scan down the items with the responses in the same line of view as the labels... though maybe with the right typography for labels and for responses this would be doable...?




    Background

    I know I should be able to simply ask my web designer these questions, but for a couple of reasons, I'm looking for a second opinion:

    I got some PSDs made showing layout of a site/web app I'm having built. I'm now working with a different person to do the CSS.

    The PSD layout looked good and font sizing looked good. I understand that with the CSS build, there are some things that can't look exactly the same.

    But font size of main body texts and text in forms just looked too small.

    Font size is important - I want forms to be really easy to read and follow and for main body texts - such as About pages - I want users to be able to read effortlessly - so I want good typography/typesetting - on everything from line length to font size.

    The site/app is not a standard brochure site - there are quite a few forms for people to fill in for example, and there are approximately 30 pages which each differ from other pages due to their respective content and functionality.

    Some of the texts for items in forms - the labelling I guess you'd call it - is longer than other texts. This is because some items need a few words to describe what's needed in the form field.

    For example, on one page, form labels range from 7 characters to 43 characters.

    There was a case on one page in which the psd designer had run longer text on one line, with the form field being shunted further to the right than other form fields. It was neat and looked fine. My web designer said that this was bad form design and code would be less streamlined with this.

    His answer was to reduce font size right across the board so things can be fitted in better, so font size is consistent, but to me it looked too small for good readability.

    I think complexities of the layout mean that there might be compromises somewhere. I don't know enough about web design to know where the compromises should be, but I'm not keen on decreasing font size across the board.

    Any advice?

  2.  

  3. #2
    Senior Member
    Join Date
    Dec 2009
    Location
    Chicago, IL
    Posts
    114
    Member #
    20579
    Liked
    2 times
    1: ems are a percentage of your default text size, so if you reset your default body copy size to say, 12px, then 1em = 12px. It is a good idea to reset this value manually because the default value changes from browser to browser. It is said that your default should be 14px and your default paragraph should be set to 1em to make sure that people that are hard of seeing can read your text. However, I often set my default to 12px because 14px appears very large to me when using sans-serif fonts.

    2: that doesn't look terrible, but I like to align labels right because it increases a user's speed to filling out your forms. Here's some interesting reading for you: http://www.lukew.com/resources/articles/web_forms.html

  4. #3
    Junior Member RichardC's Avatar
    Join Date
    Dec 2009
    Posts
    3
    Member #
    20538
    Hi Alligator,

    Thanks for that - and for the link - useful - I'm going to consider text above fields for some items.

    Cheers, Richard


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 10:46 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com