Start with a
Cyber-Safe ASCII text resume
(go to creating and polishing
an ASCII text resume before you come do this step). Once
you have converted your resume to HTML, add the final
touches to make it employer and search engine friendly.
may be "hosted" by your Internet Service Provider (e.g.
AOL, AT&T, RCN, etc.) as a form of "passive" job hunting.
It stays on the Web to be found by recruiters looking for job candidates
Keep it up to
date, and be sure that it is Cyber-Safe
and you'll have a jump start for your next job search.
this page, and in the other related pages for this section,
HTML code will be presented in italics -- like this.
Basic HTML for an Effective Online Resume Page:
are interpreted by the browser software to modify what is seen by
the person surfing the web. The problem is that there are hundreds
of different browsers out there, in many different versions, so
simple is best. You can create a resume web page with Microsoft Word and safe it as an html file, but creating "from scratch" using a simple text editor like Notepad is better because the HTML can be more complete.
Naming Your Webpage File
webpage file names is one of the ways recruiters find resumes using search engines, so make
it easy for them to find you.
The name you give your HTML file provides an important clue to search engines about what is on the webpage. To improve your personal resume web page's "find-ability" by a recruiter or employer using a search engine, include the word
"resume" in the name of your webpage file, like "resume.html." For additional search engine optimization, add your name and some marketing keywords, like -
HTML files with an .html extension, like resume.html (rather than resume.docx or resume.txt).
How HTML Tags Work
HTML tags tell the browser what to do and also provide important clues for search engine spiders about the contents of the web page. Without tags, an HTML page would look like plain text and would not provide any information to the search engines.
The HTML structure tags work in pairs, with one opening the page, or a section of it, and the other closing the page or section. Most (not all) tags start and end an effect - like making words bold
or italicized. Some tags
just are an effect, but we'll get to that later.
HTML tags are
set apart from the regular text using the angle brackets
< left angle bracket (above the comma on standard keyboards)
angle bracket (above the period on standard keyboards)
Most tags work in pairs, starting and ending a page, section, or effect (more below). Opening
tags and closing tags look very similar, except that the closing
tag has a forward slash / in front of the tag name, like this-
<HTML tag>impacted text or page section</HTML tag>
Tags are usually "nested" on a page. Like parenthesis in algebra,
tags are closed in the opposite order in which they were opened, like this -
More page content
Basic Page Structure and Required Elements
Each HTML page has an HTML file that makes it visible to the browser.
file must have some basic structure tags. Follow the
order and the punctuation of these tags EXACTLY to ensure that
your HTML file can be seen by every browser. Except for the <title> tag contents, the structure tags are invisible in a browser. They do provide information for search engines, however, which is very important to the visibility and effectiveness of the page.
<html> <== the first tag at the top of the page, with </html> the last tag in the file, based on the "nested tags" rules
<head> <== housekeeping for the HTML file,
opening the HTML file's head.
<title>Resume - Mary Jane Smith, experienced optical engineer
in Northern California</title>
The title tag is VERY important! But, very strangely, it is optional. Your page will display in a browser without a title tag, but that is a very bad idea!
Use the title
tag for marketing, to improve "find-ability"
(SEO or "search engine optimization"), and to identify your resume if someone makes it a "favorite"
or sets a browser "bookmark" on your page, but don't exceed 100 characters and spaces in your title tag.
</head> <== closes the head (top, administrative) section of the HTML
Everything above this line is the "head" of your
HTML file. Only the <TITLE> text will be seen by
visitors to your Web page.
<body> <== where everything (except your META tags) goes...
The contents of your page's <body> are what is visible in the main browser window. This is
where you put your resume's text using the HTML tags described
the last tag in your webpage file.
your HTML file to your Web server so that the whole world
can see it as a personal resume web page. Talk to your ISP's technical
support people to see how to do that on their Web server, if you
plan to use your Internet access provider as your Web host. Or,
if you plan to have your Web site hosted by AOL, they will
have an easy method to upload your HTML files.
The HTML Tags that Control Appearance of Text Elements
How appearance tags work:
- The appearance tags work in pairs and nested like all the other HTML tags.
<starting tag>effected text or page section </closing tag>
- Appearance tags are often nested to combine effects.
<starting tag1><starting tag2>effected text or page section</closing tag2></closing tag1>
Add emphasis to words, clauses, sentences, or page sections using bold and/or italicized text -
This word is <strong>bold</strong>. ==>
word is bold.
This word is <em>italicized</em>
This word is italicized.
These words are <strong><em>bold and italicized</em></strong>.
These words are bold and italicized.
Font tags control the font face, size, and color of the text.
font, size, and color using the Font tags. All 3 may be specified
in the same <font> tag. See below.
Font size ranges from 1 (teeny, tiny) to 7 (gigantic). Most
web pages are built using font size 2 or 3.
<font size="4">Large text</font>
<font size="2" face="Times New Roman,
Times, serif">Times text</font> ==>
<font size="2" face="Verdana, Helvetica, sans serif">Verdana
text </font> ==>
By default, the browser will assume that the page background is white and the letters are black, so if those are the colors you are using (strongly recommended!), no color codes are needed. However, font color can add emphasis and drama to a web page.
Specify color using hexadecimal codes (6-position numbers), preceded by a
pound sign (#). See this list matching the color
to the appropriate code in Wikipedia - web colors.
Pick out the color you like, and the "Hex Code" for that color is there. The Hex Code for white is #FFFFFF. The Hex Code for black is #000000 (those are six zeros).
<font size="2" face="Verdana, Helvetica, Sans Serif"
color="#ff0000"><strong>Bold, Red Verdana Text, size 2</strong></font>
Bold, Red Verdana Text, size 2
Don't go crazy trying to match a specific color. Colors are notoriously
unreliable on the web because of the differences in computers,
monitors, and browsers. Pick a color that looks good on your computer's
Because the text is displayed by the visitor's computer, you should
use common fonts found on most computers. If you pick an exotic
font that is not available on the visitor's computer, the browser's
default font will be what is seen by the visitor. Multiple fonts
are usually listed so that the effect can be somewhat consistent
depending on the computer being used (PC, Mac, etc.). That's why you see "Verdana, Helvetica, Sans Serif" listed..
Adding White Space
To add a
single blank line, as between paragraphs, use a Paragraph tag
You can also start and end a paragraph with a pair of Paragraph
tags, in the conventional HTML style with the <p> at the beginning of the paragraph. End the paragraph with a </p>.
To end one
line and start another one, use a Break tag - <br />
Note: Break tags don't have a start and end. All that is used is just the <br />
For multiple blank lines, use multiple Break tags (not multiple
Paragraph tags) - <br /><br /><br /><br /><== about 2.5 or 3 blank lines depending on the browser.
To Get Started:
To get started, open up a plain text browser (like Notepad on a PC), and type in the Structure tags (top of this page), one on each line. Save your file, and then add your resume, using the Appearance Tags to enhance the look of the page and to draw attention to important elements.
Do what good
web developers do -- view your HTML file in more than one browser
before you upload it to the host computer. Look at it in a Mozilla FireFox browser as well as Microsoft Internet Explorer. If possible,
check it out in AOL, too, to make sure it looks OK. See Viewing
Your HTML file for more information.
Your Privacy and Choosing a Job Site
for more information.)
© Copyright, 1998 - 2012, Susan P. Joyce. All rights reserved.
About the author...
Online job search expert Susan P. Joyce has been observing the online job search world and teaching online job search skills since 1995. Susan is a two-time layoff "graduate" who has worked in human resources at Harvard University and in a compensation consulting firm. In 1998, her company, NETability, Inc. purchased Job-Hunt.org, and Susan has been editor and publisher of Job-Hunt since then. Follow Susan on Twitter at @jobhuntorg and on Google+
Return to Job-Hunt