Formatting and special characters in Fodor's posts
Updated 3/17/09 for the new Fodor's layout
The Fodor's page on "smileys" can be found at http://www.fodors.com/community/smileys/

I often post about travel on the Fodor's Forums. My wife and I are particularly apt to be found on the Fodor's Europe forum, posting as "justretired". (To learn more about me, see my home page.)

To start off, here's a set of special character "clips", in a small separate window, in which you can highlight special characters, and then drag-and-drop them into your Fodor's post:

Click here for the clips window.
CAUTION! You may need to turn off your
pop-up blocker for this window to appear.

Next, a more detailed explanation of what can be done with HTML "tags" in Fodor's posts:

Simple HTML Formatting Tags

Certain features of HTML ("HyperText Markup Language", used to create web pages) can be used to format Fodor's entries to make them more readable. Fodor's does not allow all features of HTML to be used, but you can use those described below. To start, a table is provided for quick reference, and more detail is given in the notes that follow.

CAUTION: Any powerful tool can be misused, and these various formatting tools are no exception. They should be used judiciously. Putting section titles in bold, or underlining them, makes them stand out. Italics can be used for emphasis, or, in some contexts, for foreign words.

Words in foreign languages should be properly spelled, and that means they must have accent marks. It's not a "cafe" (does that rhyme with "safe"?), it's a "café" (unless you're in Italy, and then it's a "caffè").

You can overuse these tools to create an unreadable mish-mosh, but as Fodor's poster PatrickLondon says, "Please don't". He suggests that a well-written post should have "focused titles, proper paragraphing, short sentences, and regular spelling and grammar".

I'd appreciate comments on this page, and suggestions for improvement. Please also let me know of any errors. Click here for my e-mail address.

Simple HTML Formatting Tags
HTML "tags" are shown in color; regular text black
This is just for readability. You type them all in the same color, of course.
Item This text in a Fodor's edit box will produce...  ... this result 
 in your post 
1. <b>Bold</b> Bold
2. <i>Italic</i> Italic
3. <u>Underline</u> Underline
4. <s>Strikeout</s> Strikeout
5. <font color="red">Red text</font> Red text
6. <font color="#00FF00">Green text</font> Green text
7. <font color="#0000FF">Blue text</font> Blue text
8. <font color="#FF00FF">NE<i>ST<u>ED</u></i></font> NESTED
9. &eacute; é
10. &lt; <
11. &amp; &
12. &#38; &
13. X &nbsp; &nbsp; &nbsp; X X       X

Notes on the above tags:

Items 1-4: Note how each "opening tag", in angle brackets (<tag>) is matched by a "closing tag" with a forward slash (/) after the first angle bracket (</tag>). Thus, <b> (Start Bold) is matched by </b> (End Bold), and everything in between these two tags appears in bold.

Item 5: Changing color is a bit more complex. The <font> tag contains an attribute which specifies the color. Thus, <font color="red">Text</font> will produce Text in red. Note: Fodor's doesn't allow you to use any other "font" attributes - you can't change the text size (HTML "size" attribute) or the font typeface (HTML "face" attribute).

Item 6: There are only a limited number of colors with names. But other colors can be specified using a numerical code. Thus, <font color="#RRGGBB">Text</font> will produce Text in color, where RR, GG, and BB give the amount of each of the primary colors red, green, and blue, respectively. RR, GG, and BB are expressed as two-digit hexadecimal numbers between 00 and FF. "#00FF00" means 00 (no) red, FF (maximum) green, and 00 (no) blue; hence added together, green.

Item 7: Similarly, the numerical code "#0000FF" is equivalent to "blue". For a list of the allowed color names, their corresponding numerical codes, and for more about colors, see the section on "colors" below.

Item 8: Note that tags can be nested, like parentheses in a mathematical expression, where the opening tag is like an opening parenthesis, and the closing tag is like a closing parenthesis. In item 8, underline is inside italics, which is inside a font color change. The matching opening and closing tags are shown in matching colors, for clarity. It's sort of like this: (NE(ST(ED)))

Item 9: Item 9 illustrates one of a number of special characters, called "Named Entities". These are introduced by an ampersand ("&"), followed by a name, and ended by a semicolon (";"). The Named Entities for accented characters and other diacritical marks are particularly simple and easy to remember. Just type an ampersand ("&"), followed by the character to be accented (in lower or upper case, as desired), followed by the name of the accent, and terminated by a semicolon (";"). The names of the accents and other diacritical marks are "acute" ( ´ ), "grave" ( ` ), "circ" (for circumflex, ˆ ), "uml" (for umlaut, ¨ ), "tilde" ( ˜ ), and "cedil" (for cedilla, ¸ ).

Thus, "&eacute;" will produce an é, and "&ocirc;" will produce an ô. "&ccedil;" will produce a ç, and "&Ntilde" will produce an Ñ (note that a capital N in the name produces the capital version of the character). Not all combinations of letters and accent marks have meaning; only those that are actually used. Some other special characters for Spanish: "&iquest;" produces an inverted question mark ("¿"), and "&iexcl;" produces an inverted exclamation point ("¡").

Item 10: Some other special characters: we've seen that "less-than" ("<") is a special character used to start an HTML "tag". But what if you actually want to put a less-than character into your text without allowing it to be interpreted as the start of a tag? You can do that with another Named Entity, "&lt;".

Item 11: Similarly, "&amp;" will insert an ampersand ("&") into your text.

Item 12: But note that "&#38;" will also insert an ampersand ("&") into your text! Why are there two ways of doing that? In addition to Named Entities, there's another way to put special characters into your text. You start with an ampersand ("&") as before, but then follow it with a hash mark ("#") and a number, finally ending as usual with a semicolon (";"). These codes for special characters using numbers are called "Numerical Entities". The general term for both Named Entities and Numerical Entities is "Character Entities".

Item 13: Here's a curious Named Entity: "&nbsp;" produces a "non-breaking space", which is a space that behaves like a printing character. One reason this is useful is that groups of ordinary spaces between printing characters will be reduced to a single space (in general, excess "white space" in HTML is ignored). But non-breaking spaces can be used to indent, or to otherwise space out your text.

For a table of the most useful special characters that can be used on Fodor's, see the section on "Character Entities", below the section on colors.

This document does not address the "smileys" ("emoticons") you can add to your Fodor's posts. That is well covered by the Fodor's page on smileys. But there isn't a similar Fodor's page on the HTML features that Fodor's allows you to use.


Previewing your message

It's always a good idea to preview your message before actually posting it, particularly if you use the formatting methods of this document. After typing your message, don't click on the "Submit" button under the text entry box. Instead, click on the "Preview" button. A preview of what your message will look like when posted will appear.

In some cases ("Replying" to an earlier post), the preview appears above the text entry box, but the text entry box remains, to allow you to do further editing right on the same screen. In other cases (starting a new topic), you may have to click an "Edit" button if you want to edit your message. In either case, if you're happy with your message, and want to post it, click "Submit". But if the preview reveals some problem (perhaps you forgot to turn off bold at the end of a heading), edit your message to fix the problem. You can edit your message repeatedly, and click on the "Preview" button as often as you like, until you get it right.

If you've included one or more URLs (links) in your post, it's a good idea to check them in the preview, to be sure they work! A good way to do that is by right-clicking on each link, and then selecting "Open Link in New Window".

Careful proofreading using the Preview button will save you from having to follow up your post with an embarassing "Oops!" message. That never happens to me sometimes happens to the best of us.

Testing

You can use the above preview capability to play around with the formatting methods described here, without actually posting anything. After typing a test message, click on the "Preview" button, as described above. This will show you what your message would have looked like, if posted. A preview is always shown with a banner above it indicating that it will not actually be posted until you click "Submit".

But if you're just testing, and don't want to submit your post at all, just navigate away from the page without ever hitting "Submit". Voilà, you've seen how it works without having to actually send it out to the world.


Colors

Specifying colors by name is done using a tag of the form:

<font color="ColorName">Text to be in color</font>

Fodor's accepts all the basic color names that were originally used in the old VGA display, with its very limited color palette:

aqua black blue fuchsia green gray
lime maroon navy olive purple red
  silver teal white yellow  

There are a great many other color names recognized by browsers, such as "Medium Orchid 4". However, only some of these are supported on the Fodor's Forum as Named Colors. You can still look them up in a chart, and substitute their numerical value. Thus, "Medium Orchid 4" corresponds to a value of "#6A287E", and can be specified using:

<font color="#6A287E">Text to be in Medium Orchid 4</font>

The curious number above, 6A287E, represents 6A worth of red, 28 worth of green, and 7E worth of blue, where 6A, 28, and 7E are hexadecimal numbers. You don't need to understand hexadecimal numbers, though. You can just treat them as magic incantations representing particular colors.

The following combination of color and bold is what Fodor's uses for the screen names of posters, such as the name I use, "justretired". I can produce that name in a Fodor's posting by using:

<font color="#0066CC"><b>justretired</b></font>

Fodor's will render it in the Arial font. Actually, the exact font and size seem slightly different from the font Fodor's uses for screen names, but it's very close.

You can look up the numeric codes corresponding to an extended color name at Computer Hope.com, on the Microsoft Developer Network site, or on other similar sites.

A note for readers with some familiarity with HTML: normally the HTML <font> tag allows you to specify other possible attributes in addition to the font color, in particular "face" and "size". Thus in HTML I can write:

I love the <font face="Arial" size="+2" color="red">Fodor's</font> Forum!

and the result will be:

I love the Fodor's Forum!

But Fodor's doesn't allow you to use the "size" or the "face" attributes. If you include them in a <font> tag, the opening tag will not be acted upon - it will appear in your posting just as typed (not what you want).


Character Entities

I've already discussed the convention for naming accented characters. The following long table includes those, and a great many more special characters. If the "Name" column below is blank, either a Named Entity doesn't exist for that character, or it isn't supported by Fodor's. In that case, the Numeric Entity must be used. The tables below are not complete. They contain only a sampling of what I think are the most interesting characters for use in Fodor's posts.

Fancy quotation marks
Char.Name NumericDescription
&lsquo;&#8216; left single quotation mark
&rsquo;&#8217; right single quotation mark
&ldquo;&#8220; left double quotation mark
&rdquo;&#8221; right double quotation mark
«&laquo;&#171; French open quote (left angle quote)
»&raquo;&#187; French close quote (right angle quote)

Currencies
Char.Name NumericDescription
&euro;&#8364; euro
£&pound;&#8356; English pound
¥&yen;&#165; Japanese yen
¢&cent;&#162; US cent

Commercial symbols
Char.Name NumericDescription
®&reg;&#174; Registered trademark
©&copy;&#169; Copyright
&trade;&#153; Trademark

Typographical
Char.Name NumericDescription
&para;&#182; Paragraph mark
§&sect;&#167; Section sign
¹ &#185; Superscript 1
² &#178; Superscript 2
³ &#179; Superscript 3
æ&aelig;&#230; Small ae ligature
Æ&AElig;&#198; Capital AE ligature
œ&oelig;&#156; Small oe ligature
Œ&OElig;&#140; Capital OE ligature

Bullets, daggers, and dashes
Char.Name NumericDescription
&bull;&#8226; bullet (black small circle)
&dagger;&#134; Dagger
&Dagger;&#135; Double dagger
&ndash;&#8211; en dash
&mdash;&#8212; em dash

HTML special characters
Char.Name NumericDescription
<&lt;&#60; Start an HTML tag (less-than sign)
&&amp;&#38; Ampersand (start character entity)
 &nbsp;&#160; Non-breaking space

Linguistic: French, Spanish, & German
Char.Name NumericDescription
ç&ccedil;&#231; French small c with cedilla
Ç&Ccedil;&#199; French capital C with cedilla
ñ&ntilde;&#241; Spanish ñ, small n with tilde
Ñ&Ntilde;&#209; Spanish Ñ, capital N with tilde
¿&iquest;&#191; Spanish inverted question mark
¡&iexcl;&#161; Spanish inverted exclamation point
º&ordm;&#186; Masculine ordinal (e.g. Spanish 3º, tercero)
ª&ordf;&#170; Feminine ordinal (e.g. Spanish 3ª, tercera)
ß&szlig;&#223; German S-Zett ("ss")

Linguistic, accented vowels
To create the Named entity:
start with &, add the Vowel, then the Accent Name, then ;
e.g. for e-circumflex (" ê "), use &ecirc;
(Colors above for explanatory purposes only; you type "&ecirc;")
Vowel Acute
acute
Grave
grave
Circumflex
circ
Umlaut
uml
a á (&#225;)à (&#224;) â (&#226;)ä (&#228;)
e é (&#233;)è (&#232;) ê (&#234;)ë (&#235;)
i í (&#237;)ì (&#236;) î (&#238;)ï (&#239;)
o ó (&#243;)ò (&#242;) ô (&#244;)ö (&#246;)
u ú (&#250;)ù (&#249;) û (&#251;)ü (&#252;)
A Á (&#193;)À (&#192;) Â (&#194;)Ä (&#196;)
E É (&#201;)È (&#200;) Ê (&#202;)Ë (&#203;)
I Í (&#205;)Ì (&#204;) Î (&#206;)Ï (&#207;)
O Ó (&#211;)Ò (&#210;) Ô (&#212;)Ö (&#214;)
U Ú (&#218;)Ù (&#217;) Û (&#219;)Ü (&#220;)

Linguistic, breve & macron (short & long vowel marks)
Char.Breve (short vowel mark) Macron (long vowel mark)
aă (&#259;)ā (&#257;)
eĕ (&#277;)ē (&#275;)
iĭ (&#301;)ī (&#299;)
oŏ (&#335;)ō (&#333;)
uŭ (&#365;)ū (&#363;)
AĂ (&#258;)Ā (&#256;)
EĔ (&#276;)Ē (&#274;)
IĬ (&#300;)Ī (&#298;)
OŎ (&#334;)Ō (&#332;)
UŬ (&#364;)Ū (&#362;)

Mathematics
Char.Name NumericDescription
&minus;&#8722; Minus sign
×&times;&#215; Multiplication sign
±&plusmn;&#177; Plus or minus
°&deg;&#176; Degree (similar to &ordm; above)
¼ &#188; Fraction one fourth
½ &#189; Fraction one half
¾ &#190; Fraction three fourths

Some ordinary characters
These may be used to keep Fodor's from expanding
certain combinations into graphical "Smileys"
These combinations are shown at http://www.fodors.com/community/smileys/
e.g. ":-)" will become Fodor's smiley image, but "&#58;-)" will not.
Char.Name NumericDescription
 &#32; Ordinary space
"&quot;&#34; Plain double quote
&&amp;&#38; Ampersand (start character entity)
' &#39; Plain single quote
( &#40; Left parenthesis
) &#41; Right parenthesis
. &#46; Period ("dot")
/ &#47; (forward) Slash
: &#58; Colon
; &#59; Semicolon
<&lt;&#60; Less than
>&gt;&#62; Greater than
@ &#64; Commercial atsign
A &#65; A (66 through 90 for B through Z)
[ &#91; Left square bracket
\ &#92; Backslash
] &#93; Right square bracket
a &#97; a (98 through 122 for b through z)
{ &#123; Left curly bracket
| &#124; Vertical bar
} &#125; Right curly bracket

Directly inserting special characters

There's an alternative way of directly inserting characters using the numeric codes given in the above tables. It can be used only for characters with two or three-digit numeric codes - it won't work for four-digit codes that start with "8". Hold down either "Alt" key on your keyboard, and, while holding it down, type the numeric code on the numeric keypad, as a four-digit number. Then release the "Alt" key, and the character should be directly inserted.

Some words of caution: you must use the numeric keypad, and not the numbers on the top row of the keyboard (this means this is hard to do, or cannot be done, on some laptops and netbooks without a numeric keypad). You must type the number as a four-digit number, which will mean adding one or more leading zeros (if you type a three-digit number, you will get a different character, or nothing at all).

As an example, consider the "Plus-or-Minus Sign" in the table just above, code 177. To enter it, hold down an "Alt" key, and type "0177" on the numeric keypad. Then release the "Alt" key, and you should see the character "±". But if you type only 177, and not 0177, you'll see "¦".

Yes, I know there's a different set of three-digit codes. But the four digit codes correspond to the Numeric Entities in the table above.

The Greek alphabet

Greek characters can be created by name - I won't bother to list them all here. Just put their name between an ampersand and a semicolon, capitalizing the first letter if you want the capital version of the character.

For instance, &theta; produces θ, and &Theta; produces Θ


Reply box vs. posted fonts

Here's a curiosity of Fodor's text entry: you enter your text in Courier, a fixed width font, but it is ultimately displayed in Arial, a proportionally-spaced font. Thus, if I enter:

mmmmmmmmmmmm
iiiiiiiiiiii

it ultimately gets displayed as

mmmmmmmmmmmm
iiiiiiiiiiii

Keep that in mind when typing a post - when posted, it won't look exactly the same as when entered. In particular, you can't use the fixed-width font to line up characters to make a table - it won't line up when converted to the variable-width font for display. This is another reason to always "Preview" your posts before clicking "Submit".


Hexadecimal numbers

I don't want to get into a big explanation of hexadecimal numbers here. Sometimes just called "hex" numbers, they are just numbers "base 16", using as the "digits" zero through 15, respectively:

0 1 2 3 4 5 6 7 8 9 A B C D E F

The two-digit hexadecimal numbers, in order, from zero through 255, are:

00 01 02 03 04 05 06 07 08 09 0A 0B 0C 0D 0E 0F
10 11 12 13 14 15 16 17 18 19 1A 1B 1C 1D 1E 1F
20 21 22 23 24 25 26 27 28 29 2A 2B 2C 2D 2E 2F
30 31 32 33 34 35 36 37 38 39 3A 3B 3C 3D 3E 3F
40 41 42 43 44 45 46 47 48 49 4A 4B 4C 4D 4E 4F
50 51 52 53 54 55 56 57 58 59 5A 5B 5C 5D 5E 5F
60 61 62 63 64 65 66 67 68 69 6A 6B 6C 6D 6E 6F
70 71 72 73 74 75 76 77 78 79 7A 7B 7C 7D 7E 7F
80 81 82 83 84 85 86 87 88 89 8A 8B 8C 8D 8E 8F
90 91 92 93 94 95 96 97 98 99 9A 9B 9C 9D 9E 9F
A0 A1 A2 A3 A4 A5 A6 A7 A8 A9 AA AB AC AD AE AF
B0 B1 B2 B3 B4 B5 B6 B7 B8 B9 BA BB BC BD BE BF
C0 C1 C2 C3 C4 C5 C6 C7 C8 C9 CA CB CC CD CE CF
D0 D1 D2 D3 D4 D5 D6 D7 D8 D9 DA DB DC DD DE DF
E0 E1 E2 E3 E4 E5 E6 E7 E8 E9 EA EB EC ED EE EF
F0 F1 F2 F3 F4 F5 F6 F7 F8 F9 FA FB FC FD FE FF

The pattern should be obvious. See the Wikipedia entry on Hexadecimal if you want to learn more.


Click here to go to my home web page
Click here to send me e-mail.

This page was first posted August 1, 2006
Revised 2/18/09 for the new Fodor's layout, then 3/17/09 for the Preview function
Most recent revision 8/30/09, minor cosmetic changes 8/27/12