Use as a GENERAL reference only (minor changes have been made to the template)

Working on your resume

This page shows you the source code that you should have downloaded already. The purpose of this page is color code to help you understand the source code behind it. Do not copy this pages source code instead grab the source code from the template: Resume Template. The colors on this page are used to make it easier for you to read and understand.

Color used for HTML tag Text inside quotes (in html code) This text is ignored by the web browsers and is in place to provide comments for you to read when you look at the HTML source code. Change this text to your content, most of the other text you should leave as it is. class name for a MicroFormats Just guessing you may not change text in this color but you can if you want :)

Source code below:

<!DOCTYPE html>
<html lang="en">
<head>
<!-- The purpose of this document is to provide a template for you to follow.
Your resume will be two files, this one resume_template.html to help you to
define the CONTENT for your resume and resume.css to help you to define the
LOOK of your resume. I will try to put a comment tag pointing out the places
you should fill out with your own content. Most should seem obvious.
-->

<!-- **** you need to put in your own title below -->
 <title>Your Name (this will show up as the google link)</title>
   
<meta http-equiv="Content-Type" content="charset=utf-8" >

<!-- **** you need to in your own description in the content below -->   
   <meta name="description" content="This is what shows up as a google description so sell yourself!" >

<!-- **** you need to in your name in the content below -->
   <meta name="author" content="Your Name" >

<!-- **** the href below is the name of your style sheet that will define the
look for your resume. -->   
   <link rel="stylesheet" href="resume.css" type="text/css" />
</head>

<body id="resume" >

<main>

<!-- ************* Your personal information *************************** -->
<!-- **** change the id here and in the style sheet to your name -->
<section id="hcard-Robert-Erickson" class="vcard" >

<!-- **** the photo is changed in the CSS file -->
   <p id="myImage"><!-- **** the photo is changed in the CSS file --> </p>

<!-- **** put in your name and your url -->
   <h1 id="name" ><a class="url fn" href="http://www.uvm.edu/~rerickso" >Robert Erickson</a></h1>


<!-- **** in all the following span tags put in your address info -->   
   <p class="adr" >
<span class="street-address" >331 Votey</span>,
<span class="locality" >Burlington</span>,
<span class="region" >Vermont</span>,
<span class="postal-code" >05405</span>
<span class="country-name" >USA</span>
   </p>

<p class="email" >
<span class="type" >Email: </span>
      
<!-- **** notice you need to put your address in twice, once for the link and
once to display -->      
<span class="value" ><a class="email" href="mailto:robert.erickson@uvm.edu" >robert.erickson@uvm.edu</a></span>
</p>

<!-- **** type in your contact numbers, delete extra, copy if you need more -->
<p class="tel" >
<span class="type" >Cell: </span>
<span class="value" >1.802.656.8137</span>
</p>

<p class="tel" >
<span class="type" >Work: </span>
<span class="value" >1-802-656-8137</span>
</p>
</section>
<!--
the main code above was modified from the generator found below.
This <a href="http://microformats.org/wiki/hcard" >hCard</a> created with the <a href="http://microformats.org/code/hcard/creator" >hCard creator</a>.
*********** end of personal information ********************************** -->


<!-- This section is for work that you do that is directly related to your
career. Internships, projects etc. if you do not have any GET some, till then
just comment this section out ********************* -->
<section id="profExperience" >
<h2>Professional Experience</h2>

<!-- **** notice the comments for a job, to have more than one copy from Begin
job to end of job and replace the text as needed. They list the most recent first

change the id coName to the name of the   company HERE and in the
STYLE SHEET if you want to style it.

use google maps, yahoo maps or anyone you like. its neat to click on it to
see the building.
-->

<!-- Begin job -->
<ol>
   <li class="job" id="coName" >
      <span class="dates" >1991 - present</span>
      <a href="http://www.uvm.edu" class="company" >University of Vermont</a>,
<a href="http://maps.google.com/maps?q=+colchester+ave%2C+Burlington%2C+VT+05401%2C+United+States&l=explore&utm_campaign=en&utm_medium=ha&utm_source=en-ha-na-us-gns-lt&utm_term=searchbox&submit.x=116&submit.y=23&submit=Explore+this+place"
class="location" >Burlington, VT</a>

   <span class="jobtitle" >Senior Lecturer.</span>
   
   <p class="description" >Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
   </li><!-- end of this job -->
   
   
   <!-- past other jobs here, descending by dates -->
   
   
   
   <!-- list web sites and projects here -->
   <li class="job" id="workExamples" ><span class="dates" >1995 - present</span>
      Websites and Projects
<ul class="websites" >
<li><a href="http://www.yoursite.com" >name of site</a> short description</li>
<li><a href="http://www.yoursite.com" >name of site</a> short description</li>
</ul>
   </li>
   <!-- end web sites and projects -->
   
</ol>      
</section> <!-- end of your Experience-->

<!-- Skill set section *********************************************
list your skills as they will relate to the job you are applying for
-->

<section id="skills" >
<h2>Skills</h2>
<ol>
   <li>html</li>
   <li>css</li>
   <li>etc</li>
</ol>


<!-- Education section *********************************************
only list college education (high school education is not needed.
Always list most recent first

change the id to the abbrevation for the school.
-->

<section id="education" >
<h2>Education</h2>
<ol>
   <li class="school" id="uvm" >
      <span class="dates" >2008 - 2012</span>
         <a href="http://www.uvm.edu" class="institution" >University of Vermont</a>,
         <a href="http://maps.google.com/maps?q=+colchester+ave%2C+Burlington%2C+VT+05401%2C+United+States&l=explore&utm_campaign=en&utm_medium=ha&utm_source=en-ha-na-us-gns-lt&utm_term=searchbox&submit.x=116&submit.y=23&submit=Explore+this+place"
class="location" >Burlington, VT</a>
         
   <span class="MajorDegree" >Your Major</span>
   <span class="MinorDegree" >Minor</span>
   <span class="gpa" >Cumulative GPA 4.0 (4.0)</span>

   <!-- List the most important courses for your major that you have taken (or will take). This gives you some common ground when interviewing and something to talk about. list the NAME not the number. If there is a link for your course put it in but be sure the link will always
be available. -->
<h3 class="subtitle" >Course of Study </h3>
<ul class="courses major" >
   <li><a href="http://giraffe.uvm.edu/rg-bin/rg_section_data.cgi?200801+10783" >MS Office Beyond the Basics</a></li>
<li>Database Design</li>
   <li>Digital Revolution</li>
   <li>Human Factors</li>
   <li>Software Design</li>
</ul>


<ul class="courses minor" >               
   <li>Elements of Drawing</li>
   <li>Archery</li>
   <li>Marksmenship</li>
</ul>
</li> <!-- end school -->

<!-- add another school here if you attended more than one. Same as with experince
just copy and paste the code changing the relevant info. -->




</ol>
</section> <!-- end education -->


<!-- Work History ***************************************************
This is just what you have been doing to make money, if it is related to your profession then it belongs up above in professional exerience.

Your work history goes here with the most recent first. However, if the work is related to your major then it belongs above in Professional Experience, if they were just jobs to help pay your way, list them here as Work Experience. this is the same as professional
experience only the work is not related to your career but shows that you can work -->

<section id="experience" >
<h2>Work Experience</h2>
<!-- Begin job -->

<ol>
   <li class="job" >
      <span class="dates" >beginning year - present</span>
      <a href="http://www.uvm.edu" class="company" >Company</a>,
<a href="http://maps.google.com/" class="location" >City, State</a>

   <span class="jobtitle" >Job Title</span>
   
   <p class="description" >Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
   </li><!-- end of this job -->
   
   <!-- past other jobs here descending by dates -->
   
   
</ol>      
</section> <!-- end of your Experience-->

<!-- Interests section *************************************************
You have to have something that interests you. This is to let everyone know that you have a life beyond working. -->
<section id="interests" >
<h2>Interests</h2>
   <ol><li class="int" >what else do you like that makes you a well rounded person?</li></ol>
</section> <!-- ends interests -->

</main>
</body>
</html>