COM271—Task 1 (Part 2)
HTML Resume
Given 9/11 | Due 9/18
Syllabus | Table of Pages | Assignments | References and Useful Links
Notes on Writing a Resume (used with this assignment)
Overview: Complete task 1 by making a simple resume using only HTML.
I. Preliminary
This exercise builds an online resume. You may attempt to adopt an existing resume (your own), or you may make up all of the information for a fictitious you.
- If you use your own information, be cautious. Do not publish to the WWW any information that could be used for identity theft; that is, don't display information that is not already widely available. Certainly, social security or financial information should never make it to the web. I'd also leave out my home phone, and for this exercise I'd also stay away from a home address. (I have a Kingston PO Box for an official mailing address, and use my work phone and work email on my web site).
- If you make up information, don't get carried away with your own cleverness. Use realistic mock information. You might also include in a conspicuous place a note to the effect that "This exercise uses fictitional data: any resemblance to any person is strictly unintentional," or something like that.
For guidance on creating your own resume,see "Notes on Writing a Resume".
Lorem Ipset
Developers sometimes need to build a page that they know will contain text, but in advance of getting copy from a text writer, they need to provide a filler text. Lorem Ipsum, from www.lipsum.com, can be used as filler, giving you a few words or a few paragraphs of "latin text." Here's a justified paragraph that I generated in less than a second, and then just copied and pasted:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vel enim tellus, eget sagittis tortor. Aliquam imperdiet dignissim enim, vitae varius nibh ullamcorper a. Donec feugiat molestie magna et pellentesque. Suspendisse quis odio purus, quis iaculis nulla. Suspendisse sagittis pellentesque massa, eu lobortis dui euismod pulvinar. Curabitur consequat, diam quis rutrum convallis, leo quam tincidunt felis, a tempor urna nulla dapibus felis. Fusce pellentesque diam in dolor cursus tempor et id nisl. Pellentesque accumsan est at diam commodo pulvinar. Duis sit amet lorem nunc, eget dictum nisl. Morbi suscipit aliquam felis non tincidunt. Praesent in nisl at justo lobortis rutrum nec vitae ante. In vel lectus enim.
The text is actually drawn from Cicero, written in 45 B.C. Visit lipsum.com to learn more.
Preparation
Attend class and take notes. Print online notes pages for weeks 1 and 2: read, and prepare questions for class about any material you do not understand as you read it.
Create an Online Resume
- In task 1, part 1 of this assignment, you created a page for your resume, which I suggested that you file as "html_resume.html". Open this page in your work area (double-click on its icon in the Local File list under the Files panel in Dreamweaver). You should have already entered a blank table that will be used to contain your resume. If not, go back to part 1 and do this now.
- In the left column of the contents table (where your resume is going), enter headings. Use a header tag (<h3>, for example) or boldface (<strong>) to make it more distinctive. Consider using html bgcolor attributes for the left-side cells to further distinguish them (but don't get too garish here!). Experiment with html attributes align and valign to position these labels (read the notes first to learn about these). Avoid using multiple non-black spaces ( ) or the block quote element (<blockquote>) to create indentations; also avoid using empty paragraphs (<p></p>) to space down. Keep these entries as simple as possible, limiting any presentation effects to those you can achieve through strict html elements and attributes.
Remember that the purpose of this exercise is not to make an online resume; rather, it is to get practice and to become familiar with basic html elements and attributes. When we use CSS for styling, in the next task, you can begin to think more seriously about the resume itself.
If you create style effects by invoking Dreamweaver's properties window, they will appear on your page as a style sheet. Look for this (<style...>...style rules...</style>) in the head section of your page. Remove these. Again, all presentation (color, background colors, cell padding, borders) is limited to html elements and attributes only, for this exercise: they can be there, but only if created with html tags or attributes.
- In the right-side columns of your resume, enter whatever information is appropriate. For example, on the row for education, you should at least have a line about the high school you graduated from (name, year, location, and perhaps on a separate line (hint: use <br />) a mention of graduating with honors or getting your varsity letter in track), and a line about being in URI (year entered, year you will graduate, major, etc.). Consider organizing this information in a table (year, school/location, graduation date). Yes, that would be a table within a table within a table: talk about nesting html tables! (Remember? See Tables for layout...) (Go ahead. This sort of nesting of information that is itself properly tabular is okay.)
- Don't worry at this point too much about final appearance of this page. It is likely to be stark and not particularly attractive. That's the point! That's the nature of html, which is great for scientists to share documents, but otherwise a bit limited.
- When you have roughed out your resume, again make sure that you have not accidentally created some Dreamweaver-generated style sheets at the top of the page (remove these). Double check to see that your links between home page and resume page still work.
- As a final check, also open this page in a second browser. That is, if you have been using IE to verify that your page is being posted on the server, as a last step in the development process, also check it on Firefox.
Everything on the server? Looking good (well, looking adequate?). Time to move on: Take off the mittens and let's start to flex our designer fingers by bringing in some CSS, our next task.
How Will This Assignment be Graded?
This assignment is worth 5% of your final grade. Points will be awarded for:
- Use of appropriate html attributes to provide space, readable type, and organizational clarity to the resume (5)
- Use of typography or nested tables to create attractive, readable information for each major section of the resume (e.g., education) (3)
- All styling (e.g., (2)