Job-Hunt Sponsors
Find Jobs in all states Jobs across your state - not available elsewhere on the Web. Only here. CareerCast.com The Site for Executives Reach the real retained executive recruiters RiteSite.com Jobs with Friends CareerCloud's new social referral tool will get you hired faster friends.careercloud.com Job-Hunt's Sponsors are carefully chosen. Does your company or site qualify?

Home « Online Job Search Guide « Resumes « Sample Resumes « Internet Resumes

On this page: The steps for converting your ASCII resume into a Personal Resume Webpage.

Personal Resume Webpage -- Basic HTML

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.

Job Listings
what

job title, keywords
where

city, state, zip

jobs by

This resume 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 like you.

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.

Note: On 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:

HTML "tags" 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

Searching for 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 -

MJ-Smith-optical-engineer-resume.html

Save your 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)

>right angle bracket (above the period on standard keyboards)

<HTML tag>

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 -

<tag1>
<tag2>
Page content
</tag2>
<tag2>
More page content
</tag2>
</tag1>

Basic Page Structure and Required Elements

Each HTML page has an HTML file that makes it visible to the browser.

Every HTML 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 the closing </html> the last tag in the file at the bottom of the page, 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 file.

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 below.
< /body>

</html> <== the last tag in your webpage file.

Upload 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 bold. ==>

This word is bold.

This word is italicized ==>

This word is italicized.

These words are bold and italicized. ==>

These words are bold and italicized.

Font tags control the font face, size, and color of the text.

Change the font, size, and color using the Font tags. All 3 may be specified in the same tag. See below.

Font size ranges from 1 (teeny, tiny) to 7 (gigantic). Most web pages are built using font size 2 or 3.

Large text ==>

Large text

Times text ==>

Times text

Verdana text  ==>

Verdana text

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).

Bold, Red Verdana Text, size 2 ==>

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 monitor.

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  at the beginning of the paragraph. End the paragraph with a .

To end one line and start another one, use a Break tag -  

Note: Break tags don't have a start and end. All that is used is just the  

For multiple blank lines, use multiple Break tags (not multiple Paragraph tags) -     <== 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.

For Best Results:

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.

(See Protecting Your Privacy and Choosing a Job Site for more information.)

About the author...