Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 17

Thread: Font PT vs PX?

  1. #1
    Regular Coder
    Join Date
    Apr 2005
    Posts
    313
    Thanks
    18
    Thanked 2 Times in 2 Posts

    Font PT vs PX?

    I keep reading about point vs. pixel, and was wondering what others thought? My page..

    http://www.moderntimes.com/

    Is coded in points, but I was at a friends house and we checked it out on his Mac IE 5.0 and the type was about 6 sizes too large, I had to reduce it several times to get it to display correct? On my Mac it appears perfect.

    The only thing I can think of is the points vs pixels.

    Thanks,
    Michael

  • #2
    Senior Coder
    Join Date
    Dec 2004
    Location
    Essex, UK
    Posts
    2,636
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Pixels is not really a good way to specifiy font size, mostly because IE can't resize fonts which are in pixels. I don't know that best way but I normally use CSS sizes - small, x-small, medium, etc.

  • #3
    New Coder
    Join Date
    Dec 2004
    Posts
    34
    Thanks
    0
    Thanked 0 Times in 0 Posts
    That will happen in IE or other browsers if the user has the view size set to anything different from yours. I highly suggest using CSS to define your text sizes so others can not change it. I had that problem with a lot of sites I was designing then this forum turned me on to CSS and it is a realitvely easy language to learn. Hope that helps.

  • #4
    New Coder
    Join Date
    Jun 2005
    Posts
    72
    Thanks
    0
    Thanked 0 Times in 0 Posts
    %

    Use % for on-screen so people with bad eyes can increase the text-size.

    Pt's is better used for printing instead of pixels. (as far as I know, correct me if am wrong)

  • #5
    Regular Coder Donkey's Avatar
    Join Date
    Sep 2003
    Location
    Blackfield UK
    Posts
    311
    Thanks
    1
    Thanked 35 Times in 35 Posts
    As well as % you could also use em's for the same reason.
    " 90% of everything is crud" - Theodore Sturgeon
    Filthy Beast - a 60's Rock Band

  • #6
    New Coder
    Join Date
    Jun 2005
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Use anything relative, but not points.

    Definitely do not use points, points are a print based font encoding and not good for screen or web at all.

    Pixels are Ok technically, but as others have said they are fixed not relative, which means that users cannot scale the text to suit their needs.

    Although this is a little scary from a design perspective, for many who have access issues and bad sight it is vital, or they will not be able to use your site all.

    Allowing everyone to use is now a legal requirement in the UK, Europe and the US (and probably other places too).

    Use, %, css or html values (xsmall, 1 to 7) or em's.

    Of course you should use points if you use a style sheet to make a print version of your page.

  • #7
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    If you use pixels any browser but IE can still resize the text.

  • #8
    Regular Coder Graft-Creative's Avatar
    Join Date
    Aug 2004
    Location
    Web Designer - North East Lancashire U.K.
    Posts
    842
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'd probably go with ems, then scale everything down by setting the font size for <body> in my CSS to 75-80%

    %s you have to be careful because of inheritance: you may end up with text that is 75% of 75% of 75% etc etc.

    Declaring font sizes in ems, then universally shrinking them all by declaring a single percentage value in the body element seems reasonable (from what I've read anyway)

    Kind Regards,

    Gary

  • #9
    Regular Coder
    Join Date
    Apr 2005
    Posts
    313
    Thanks
    18
    Thanked 2 Times in 2 Posts
    Thanks, Gary. Tell me how are you able to do the drop shadow the sides of your pages on the Foxhill site? I really like that.

    Thanks,
    Michael

  • #10
    Regular Coder Graft-Creative's Avatar
    Join Date
    Aug 2004
    Location
    Web Designer - North East Lancashire U.K.
    Posts
    842
    Thanks
    0
    Thanked 0 Times in 0 Posts
    it's just a centered, fixed background mate

    Something like this: CSS;

    Code:
    body {
    margin: 0;
    padding: 0;
    text-align: center;
    background: white url(images/background1.jpg) fixed repeat-y center top;
    }
    Gary

  • #11
    Regular Coder
    Join Date
    Apr 2005
    Posts
    313
    Thanks
    18
    Thanked 2 Times in 2 Posts
    So how big is the background.jpg? It's not the entire page is it? I still can't figure it out?

    But thanks,
    Michael

  • #12
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Its just a big background image at a resolution of 1024x746, you could also view the image directly to get this info.

  • #13
    New Coder
    Join Date
    Jun 2005
    Posts
    72
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Simonp
    Allowing everyone to use is now a legal requirement in the UK, Europe and the US (and probably other places too).
    o.k. I knew it was mandatory in the states, didn't know for the other continents as well. I am all for it. While we are sorta on the subject. How do you do that for braille readers then. Saw the css style for screen, all, braille, print, etc. If I set a stylesheet to 'all' it overrides the print stylesheet. So is it best to add some braille sheets to it? It is all for the better.

  • #14
    Regular Coder
    Join Date
    Apr 2005
    Posts
    313
    Thanks
    18
    Thanked 2 Times in 2 Posts
    Quote Originally Posted by _Aerospace_Eng_
    Its just a big background image at a resolution of 1024x746, you could also view the image directly to get this info.
    I know I'm going to get murdered here, but how do I view the background image. If I right click I don't get the option to view image. I thought I'd ask anyway.

    Thanks

  • #15
    Regular Coder
    Join Date
    Apr 2005
    Location
    San Diego, CA
    Posts
    107
    Thanks
    3
    Thanked 0 Times in 0 Posts
    There are several ways.

    1) View the source, find where he imports his CSS from, view the CSS, find that image, load it into the browser, see it.

    2) Download FireFox, right click on the image and select "View Background Image"

    And while you're at it... get the Developer's Toolbar


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •