Page 1 of 2 12 LastLast
Results 1 to 10 of 11
  1. #1
    Famous for offering help & advice
    Join Date
    Oct 2004
    Location
    West Yorkshire
    Posts
    1,729

    Question FONT attributes in HTML

    Please could anyone advise on the correct way to change font faces and sizes in HTML when creating fairly simple web pages and without using CSS (which I understand not all browsers support)?

    What I have read suggests that if you are using a non-default font face and size for several adjacent paragraphs of text it is necessary to close the FONT tag at the end of each paragraph and redefine the font attributes at the start of the next. Is this correct, and is it strictly necessary?

    (In fact my browser (IE6) doesn't seem to mind if you use a P tag without first closing the FONT tag, but I know that doesn't make it correct HTML, and I'd rather do things properly.)

    Also, if you want to use a different font from the default Times New Roman throughout a web document, is it good practice to define this as a BASEFONT attribute, rather than as a FONT attribute for each element on the page? Some reference guides seem to suggest that defining the face in BASEFONT is poorly supported and better avoided - but it's obviously a lot quicker and easier than repeatedly redefining the FONT attributes.

    If I do use BASEFONT to define the font face, will it work in tables? I gather that some browsers ignore any defined BASEFONT size in tables, but does this apply to the other attributes as well?

    Thanks for any help,
    Arthur

  2. #2
    Rod Neep
    Guest

    Default

    Quote Originally Posted by Arthur Kennedy
    Please could anyone advise on the correct way to change font faces and sizes in HTML when creating fairly simple web pages and without using CSS (which I understand not all browsers support)?
    It is some features of CSS that some browsers don't support, but font definitions are fine!

    What I have read suggests that if you are using a non-default font face and size for several adjacent paragraphs of text it is necessary to close the FONT tag at the end of each paragraph and redefine the font attributes at the start of the next. Is this correct, and is it strictly necessary?
    It is good practice, if you are changing the font, to close the last one first, and then start the new one. It is not a good idea to use non-standrd fonts (Times New Roman and Arial, Helvetica, Geneva, sans-serif are ok). If the end user doesn't have the font that you specify on their computer, then they can't display it!

    Rod

  3. #3
    Rod Neep
    Guest

    Default

    A typical CSS file to define fonts:

    BODY {font-family : Arial, Helvetica, Geneva, sans-serif; color : "#000000"; font-size : 9pt;}
    P {font-family : Arial, Helvetica, Geneva, sans-serif; color : "#000000"; font-size : 9pt;}
    TD {font-family : Arial, Helvetica, Geneva, sans-serif; color : "#000000"; font-size : 9pt;}
    DIV {font-family : Arial, Helvetica, Geneva, sans-serif; color : "#000000"; font-size : 9pt;}
    A-link {color : blue} A:visited {color : purple}
    A:active {color : green}
    H1 {font-family : Arial, Helvetica, Geneva, sans-serif; color : "#800000"; font-weight : bold; font-size : 16pt;}
    H2 {font-family : Arial, Helvetica, Geneva, sans-serif; color : "#800000"; font-weight : bold; font-size : 14pt;}
    H3 {font-family : Arial, Helvetica, Geneva, sans-serif; color : "#800000"; font-weight : bold; font-size : 12pt;}
    H4 {font-family : Arial, Helvetica, Geneva, sans-serif; color : "#800000"; font-weight : bold; font-size : 10pt;}

    Name this file myfonts.css, and put it in a folder called /common

    and then in the header section of the web page, make a call to it, e.g.

    <LINK REL=stylesheet TYPE="text/css" HREF="common/myfonts.css">

  4. #4
    Rod Neep
    Guest

    Default

    Quote Originally Posted by Arthur Kennedy
    Also, if you want to use a different font from the default Times New Roman throughout a web document, is it good practice to define this as a BASEFONT attribute, rather than as a FONT attribute for each element on the page? Some reference guides seem to suggest that defining the face in BASEFONT is poorly supported and better avoided - but it's obviously a lot quicker and easier than repeatedly redefining the FONT attributes.

    If I do use BASEFONT to define the font face, will it work in tables? I gather that some browsers ignore any defined BASEFONT size in tables, but does this apply to the other attributes as well?

    Thanks for any help,
    Arthur
    I never use BASEFONT
    Yes. some browsers will ignore it in tables.
    The CSS file illustrated above will work in all browsers though (including Apple Mac) and in tables.

    And finally, it is not a good idea to use lots of different font faces on a web page. It becomes too fussy and cluttered. Stick to one font, and by all means change its size, make it bold, italic, or change its colour for emphasis.

    Rod

  5. #5
    Reputation beyond repute
    Join Date
    Oct 2004
    Location
    Kent
    Posts
    16,792

    Default

    But isn't it true that specifying font sizes in that way (eg 10 pt) means that the user is unable to resize the text? This can cause problems for some users.

    Also it's my understanding that with style sheets, tables - which can be used simply for laying out text in HTML - simply aren't needed to the same extent (except of course when you really need to show a genuine table!)

  6. #6
    Mary Young
    Guest

    Default

    Hi, Arthur
    The vast majority of browsers support CSS nowadays. If you are writing "simple HTML pages" now is the time to bite the bullet and tackle a simple CSS stylesheet, such as Rod's example above. It will save much time and trouble in the end. As a bonus, the filesize of your pages will be smaller and faster to load. You can change the appearance of your entire site in a couple of minutes - even change the fonts if you really want to. (Though it's good advice to stick to basic fonts that everyone has on their computer.)
    I'm in process of changing my old site to CSS and starting to appreciate the benefits. Steep learning curve for an oldie like me - but fun
    Excellent advice, tutorials and sample files at https://www.yourhtmlsource.com/fullindex/

  7. #7
    Reputation beyond repute
    Join Date
    Oct 2004
    Location
    Kent
    Posts
    16,792

    Default

    Arthur

    I spotted a simple demo to illustrate what I was saying about font sizes.

    1. Call up https://www.w3schools.com/css/tryit.a...ycss_font-size

    2. The CSS code is on the left, the result on the right.

    3. Before you do anything else, note the way the font sizes are described in the CSS code and change the text size with your browser (View...Text Size in IE). Try Largest, Smallest etc.

    4. Now edit the CSS code on the webpage entering font sizes as absolutes. For example:
    h1 {font-size: 14pt}
    h2 {font-size: 12pt}
    p {font-size: 10pt}
    and press the "click me" button

    5. Now, as before, try altering the text size in the browser. Not so useful doing it that way, I think you'll agree.

  8. #8
    Famous for offering help & advice
    Join Date
    Oct 2004
    Location
    West Yorkshire
    Posts
    1,729

    Default

    Many thanks for all the replies - you've given me (and my wife) plenty of food for thought! The plan of action now is to get hold of a good guide to CSS, and take it from there, though in creating pages we are anxious not to exclude those genealogists who cannot afford up-to-date systems with the latest browsers.

    Also, just to reassure you all - neither of us is into using lots of different or fancy fonts, it's just a case of using Arial in preference to Times New Roman.

    Peter - I take the point about fixed text sizes in CSS, and I agree with you on this. However, please could you explain a bit more about CSS making it less necessary to use tables for positioning text, as I tend to do this quite a lot.

    Thanks,
    Arthur

  9. #9
    Reputation beyond repute
    Join Date
    Oct 2004
    Location
    Kent
    Posts
    16,792

    Default

    Because you can position different chunks of text more precisely using CSS than you can with plain HTML.

    But I'm not an expert - just a dabbler.

    For example (I don't make any claims for this, it's probably shot through with errors but it seems to demonstrate the principle if only by accident). This the style embedded which isn't good practice but needs must. You should be able to cut and paste this and call it up with a browser.

    By the way, if you're looking for a book, try the library first. I did


    <html>
    <!-- Created on: 04/09/2005 -->
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title></title>

    <STYLE TYPE="text/css" MEDIA=screen>
    <!--
    .text1 { position: absolute; top: 1px; left: 1px; right: 48%}
    .text2 { position: absolute; top: 1px; left: 52%}

    -->
    </STYLE>
    </head>
    <body>
    <p class=text1> Put any text here. Put any text here. Put any text here. Put any text here. Put any text here. Put any text here. Put any text here. Put any text here. Put any text here. Put any text here. Put any text here.
    </p>
    <p class=text2>
    Put some different text here. Put some different text here. Put some different text here. Put some different text here. Put some different text here. Put some different text here.
    </p>
    </body>
    </html>

  10. #10
    Famous for offering help & advice
    Join Date
    Oct 2004
    Location
    West Yorkshire
    Posts
    1,729

    Default

    Thanks for your help, Peter. I've got some books from the library - now I need to try and work out what they're saying...

    Arthur

Page 1 of 2 12 LastLast

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Select a file: