How to Select HTML Font Styles – Web Design Tips for Beginners
Selecting HTML font styles isn’t always as easy as it sounds… especially when we consider just how many styles are available.
If you’re new to website design, however, you might not realize how important it is to select font styles that go with your web page theme AND that are compatible with all browsers/systems available today.
Let’s take a look in this web design lesson at the most popular web fonts and how you might use them to create a great page.
HTML Tags for Fonts
The basic HTML tag for creating font style is:
<font face=”arial”>This text is written in the font style called Arial.</font>
The basic font tag is <font></font>; attributes may be included within the opening and closing tags to let the browser know which font style should appear on the page.
You can also add other attributes to customize your text, such as SIZE and color. The video lesson will show a bit more of what you can do with creating fonts in HTML.
Select a Font for Your Main Written Content
Your main written content should have a plain type of font that’s easy to see and read, even by those with poor eyesight.
If your readers have to strain their eyes to read your web page, then you might lose them as a visitor and/or customer.
This can cause you to lose sales! So choose a font that’s very easy to read for all your main content, such as Times New Roman, Arial, Courier New/Courier, or Georgia.
Avoid using cursive or handwriting fonts… as these can be very difficult to read for some web users.
Other “safe” fonts for most systems are:
Arial Black, Comic Sans MS, Verdana, Impact and Trebuchet MS.
HTML Font Style and Headings
If you have a certain site theme that can be emphasized with a unique font, then try to limit using the special font to headings or subheads.
And the reason for doing this? If it happens to be a font that’s difficult to read for some or that doesn’t appear correctly on certain types of screens, then those users will only miss reading the heading, but will still be able to read the rest of your content.
You might even want to always put the main headline in a common, easy-to-read font on sales pages since this is usually the most powerful attention-grabber on the page.
Font
s and Graphics
If you must use a unique font that might not be a common font style with all computer or mobile systems, then consider placing the wording in a graphic (.jpg, .gif or .png).
Unlike fonts, images will appear the same across the board, no matter which font style is being used.
You can even make images that look like plain text by leaving off the borders and fancy graphical drawings.
Experiment with this on pages where you need to get a point across while keeping the content in a text-looking format.
Practical or Fancy Fonts?
If having a fancy looking page is the only reason you wish to use a special type of font, then avoid the urge.
Unlike newspaper ads, magazines, etc., using fancy fonts on the web can cause readers to click out of your site without ever reading a word.
Don’t assume that your website will look the same on every operating system or in every browser.
The styles you choose for your fonts might look one way in Mozilla Firefox and totally different in Internet Explorer or Google Chrome.
If you have to choose between practical and fancy… then always choose practical so you can convert your site’s visitors to buyers!
Don’t waste space with fancy font styles that your users will never read.
While the look and feel of a web page is important… it’s even more crucial that your site’s visitors be attracted to and able to read your content.
Choosing the right styles for your fonts will serve all purposes and help you keep your readers’ focus while they are browsing your website.
Keep studying the other web designing tips for beginners to become more adept at creating HTML fonts that work for your website.
