ProFantasy Community Forum

Formatting your posts with HTML

DogtagDogtag Moderator, Betatester Traveler
in Site Matters

Introduction

This thread is intended to contain some tips and tricks for formatting your posts with HTML, including bulleted and numbered lists, bold and italic (and underlined, but you should try to avoid underlined text on a web page), font sizes and other effects, displaying your message as plain text exactly as typed, mdashes — the long dashes, and whatever else I or other contributors can think of.

Before reading on, you may want to read the first post of this related thread, about adding hyperlinks to your forum posts. It introduces the concept of markup, the method of placing "tags" around text that you want to format or affect. That previous post discusses, both, HTML and BBCode. For now, this thread will discuss HTML. For information on BBCode, visit BBCode.org.
Share on FacebookShare on Twitter

Comments

  • DogtagDogtag Moderator, Betatester Traveler
    edited September 2016

    The Basics: Bold and Italic (and Underline)

    First, why the parentheses around "Underline?" From a readability/usability standpoint, you really should avoid underlining text on a web page whenever possible because people have a tendency to click underlined text.

    There are a couple of ways to format text as bold, italic, and underlined in HTML. This first post (yes, I know, it's second) will cover the simplest, fastest way. Newer versions of HTML consider the following formatting methods to be deprecated because they are being superseded by other methods. But HTML still currently supports them for backward compatibility and, frankly, we're not building a website, we're posting to a forum. So, quick and easy is good.

    Formatting the Text

    To make text bold, enclose it in b tags, like this: text to make bold.
    text to make bold

    To make text italic, enclose it in i tags, like this: text to make italic.
    text to make italic

    To underline text, enclose it in u tags, like this: text to underline.
    text to underline
    You can combine these tags to make text, for example, both bold and italic.
    To combine tags, simply enclose tagged text in another pair of tags. For example, you can make text bold and italic by making it bold, then making the bold text italic, like this:
    This text is both bold and italic.
    This text is both bold and italic.

    Or, you can make the text italic and then make the italic text bold:
    This text is also both bold and italic.
    This text is also both bold and italic.

    Notice that the closing tags are in the opposite order of the opening tags? Good practice is to keep your tags "together." That is, don't "overlap" them, like this:
    Bold and italic
    The text itself is surrounded by an italic open tag and a bold close tag. This gets the job done but you should try to avoid it because it's a bad habit to get into.

    Summary

    This first post discussed the basic, but useful, formatting options for making text bold, italic, and underlined. We learned the following items:
    • Bold tags, .
    • Italic tags, .
    • Underline tags, .
    • Underlined text should be avoided, or at least used sparingly, on web pages.
    • Combine tags by adding tags to already-tagged text, such as bold and italic text.
    • Don't mix up, or overlap, your tags, so text is good but text should be avoided.
    • There are other ways to make text bold, italic, and underlined.
    I'll discuss the other ways later in this thread for anyone interested, but these are the quickest and easiest ways to format your text.

    Cheers,
    ~Dogtag
    Share on FacebookShare on Twitter
Sign In or Register to comment.