HTML Primer - CAMEO EZ Support

Here are some tips for using simple HTML tags if you need to create long product descriptions for your product spreadsheet in the “Item Descriptions (Detailed)” column. It is also possible to use HTML tags in the Item Name column.

Create the Description file and simply enter the name of the file (“filename.html” or “filename.txt”) in the column in the spreadsheet and the information will display on the web site. Since each file will be for a specific SKU, it is wise to name the file with the SKU number (i.e. BF12345.html).

It is best to create and edit HTML files in a text editor like Windows’ Notepad, rather than a word processor like Word or Word Perfect, because word processors add unseen formatting to documents that would corrupt the HTML. MS Word does allow you to create and save HTML documents, but they tend to be overly complex. You can use one of the HTML editing software programs that have a desktop-publishing-style interface and you can bypass the HTML “tags” described below. Popular programs include Macromedia’s Dreamweaver and Microsoft Frontpage. If you use one of the editors, you will need to remove the <html>, <head> and <body> tags that are usually present in HTML documents.

Below are some basic HTML “tags” to use in formatting your descriptions.

What is HTML?

Hypertext Markup Language (HTML) is the method used to format text and images for web pages. Web pages are text files with a “.html” or “.htm” extension. HTML “tags” are the commands embedded in the text to indicate formatting and begin and end with the “less than” and “greater than” symbols ( <tag> ). Some tags require an ending, indicated with a slash, i.e. </tag>.

Paragraph Breaks:

The paragraph tag is  and end paragraph is . Example:

This is an example paragraph. It includes beginning and ending HTML tags. Everything between the two paragraph tags will be the same font face, style and color, unless you add <style> tags to change them.

The  and  won’t be visible on the web page, just the beginning and end of the paragraph. Each paragraph will be separated from the others by a blank line.

Heading sizes can also be used and are numbered “H1” (the largest) through “H6” (the smallest).

Line Breaks:

If you don’t want to have a blank line between paragraphs or if you want to break a line in a specific place use   for line break. If you simply hit “Enter” or “New Line” as you type your description, it won’t show up in HTML. You must put a tag in order for the web page to be formatted. The   tag doesn’t need a closing tag; it stands alone.

Style:

Through Cascading Style Sheets (CSS), text files which end in “.css”, websites can have style characteristics built in, such as font face, font size and color, backgrounds, etc., that unify an entire web site. But it is possible to put styling inline with your text and that is what we are concerned about here. If you want to change the style within a paragraph, to bold  or italicize  certain words for emphasis. To change the size or color of text, you can use the  tag. You must end the style change with  or the rest of the document will retain the new style.

Bold: – or – . Both will still work in most web browsers but  is preferred and  may be deprecated, meaning it will not work in the future.

Italic  (for “emphasis”) – or –. Again,  is deprecated, use .

While  and  for bold and italic are easiest to use,  and  are preferred because they have implications for making web sites accessible to the site-impaired, since systems that will read websites to the blind are becoming available and  is interpreted correctly when read aloud by a speech program, unlike  and .

Color: The  tag is also deprecated, You should use  like this: Your red text – or use a hexidecimal color- Your red text (See below for info on Hexidecimal colors).

Size: Your 12 pt text here. You can also express font-size in pixels, percentages and more.

You don’t need multiple tags if you are modifying multiple styles. Simply combine the styles separated by semicolons like this:

Your 12 pt, red, bold text

There are many variations possible for the above, but that’s enough to allow you to do a lot. Here’s an example of several things you can do with the HTML tags:

In this example paragraph we will change the weight, the color and the size of the text so you can see how it is done. You can combine the elements in different ways to get different effects.

Below you can see exactly how it looks in HTML.

In this example paragraph we will change the weight, the color and the size of the text so you can see how it is done. You can combine the elements in different ways to get different effects.

HTML Colors

In the examples above, font color is stated as “red”, “black”, etc. Below are the basic colors available and the Hexidecimal equivalents. Example: is the same as or <style=color:#FF0000>.

Name	Color	Hexidecimal
Red		#FF0000
Green		#00FF00
Blue		#0000FF
Yellow		#FFFF00
Cyan		#00FFFF
Magenta		#FF00FF
Black		#000000
White		#FFFFFF

More extensive color variations are possible beyond the very basic examples above. For more information, refer to online color charts such as http://www.visibone.com/colorlab/.

What is HTML?

Paragraph Breaks:

Line Breaks:

Style:

HTML Colors

Pages

Archives

Categories

Blogroll

Meta

Subscribe