Personal Homepage Submisison
Overview
Modify your personal home page index.html that serves as your main landing page for both your school website and GitHub Pages. This page should be professional, represent you well, and serve as a gateway to your coursework and professional profiles. You should go through the first HTML tutorials before doing this.
Requirements
HTML Semantic Elements
In addition to the boilerplate HTML code all pages should use in addition:
Header (<header></header>)
<h1></h1>
Your H1 should be the name of your website.
Main (<main></main>)
<h2></h2>
Your H2 should be the name of your page
Footer (<footer></footer>)
Your footer should contain navigation links with a divider seperating each link
Example: GitHub ~ GitHub.io ~ ITIS 3135 ~ LinkedIn
-
Links:
- GitHub
This should link to your GitHub Profile
Example: github.com/alexandernc0043- GitHub.io
This should link to your GitHub Pages
Example: alexandernc0043.github.ioThis should link to your LinkedIn Profile
Example: https://www.linkedin.com/in/alexander-prechtel-b4a0a9283/- ITIS 3135
This should link to your ITIS 3135 Page
Example: ./itis3135/ImportantThis link should be relative not absolute.
Confused? See Frequency Asked Questions!
For the external links GitHub, GitHub.io, LinkedIn you may want to consider using target="_blank" in your anchor elements as these will open these links in new tabs instead of the current one.
See this resource for more details.
Title (<title></title>)
Your title should be a combination of your heading 1, heading 2, and a divider of your choice.
For example if my heading 1 is Alexander Prechtel and my heading 2 is Home my title should be Alexander Prechtel | Home.
Cascading Style Sheets (CSS)
You need to use an embedded stylesheet inside your <head></head> element. To add embedded styles you need to use the <style></style> element.
Styling Requirements
Update atleast these elements, using at minimum; <body>, <h1>, and <h2> selectors.
- Fonts
(pick at least two, and differentiate between normal text and headings - generally headings can be more stylized than normal text)
- Colors
(hint: coolors.co - save the URL for reference as it includes your colors.) - at least a background color and font color
- Margins
(auto 0, and max-width to something between 600-1000, and width to 80-95%)
Validation
Ensure your personal homepage includes the Accumulus Validator. See this assignement
Content Guidelines
- Professional tone: This page should be suitable for anyone to view
- Personal focus: This is YOUR page, not a course-specific page
- No ITIS3135 content: Course-specific material belongs in the
itis3135/folder - Clean design: Should look different from your course pages
Important Notes
- Context matters: “Home page” can refer to different pages depending on context
- index.html: Default filename web servers look for
- Test thoroughly: Check links work, validate HTML, test in private browsing
- Ask questions: When in doubt, ask for clarification (On NinerLink)
Quality Standards
- All links must be functional and public
- No HTML validation errors (USE ACCUMULUS)
- Professional appearance and content
- Easy navigation between sections
Submission
Submit ONE link to your UNCC website home page.