Project Description:
Description:
We are asked to use HTML, CSS, and JavaScript to create our own digital resume. We have 30 requirements that we must complete, each worth 1 point. We should have our name, contact information: email address, highlights: list at least 3 highlights, education: list your current school first, then your elementary school and the year you graduated, achievements: list at least 2 achievements, and extracurriculars: list at least 3 extracurricular activities that you want to share. We also should have a portrait, skill table, contact form, and three hyperlinks on the bottom of the page leading to our school, ePortfolio, and hobbies page.
Step-by-Step:
First, we write the HTML code for the structure of our page. The code and page looks as follows:
Here is my HTML code.
This is the page without styling.
Second, we added CSS code to style our page.
Page 1
Page 2
Page 3
Before styling.
With styling.
Third, we made a hobbies.html page with 3 of our hobbies. We also linked our CSS file to this page. An image is shown below.
Fourth, we added a skills table with at least three skills. It should be styled to have a border, background color, breathing room for the data, and text alignment.
Fifth, we added a contact form with a text field for name, email address, and message, and added javascript to address when "Send" was clicked. If all text fields were entered, the alert would say, "
The contact form.
My Javascript code.
The alert if all text fields are entered properly.
Reflections:
S: I think one of my strengths was the CSS styling.
O: I think I could've added more rows to the skills table, and I also could've wrote a bit more for my highlights and achievements.
U: I learned how to apply CSS, HTML, and JS to make a website.
L: A few limitations I encountered were putting my portrait on the same line as my heading, aligning the dates for all my highlights, achievements, and educations, and making a Javascript function that would give different responses for all cases on my table (All text fields were blank, a specific two were blank, only one specific one was blank).
WISCR:
Two letters of WISCR that apply are the I and the C. I was an insightful and critical thinker by facing and overcoming and limitations i encountered during this project, such as placing my portrait on the same line as my heading. I was a clear communicator by asking for help when necessary, and also giving help when asked.