Project Description
This project is to create a website about yourself that wort
Project Description
This project is to create a website about yourself that worth 20% of your final grade. This project is to plan, design, and develop a static personal website presenting your professional skills and a portfolio of your school/work projects using front-end web applications only.
The purpose of this assignment is to create a professional online portfolio. This website can help you obtain a job and therefore should be professional in nature. This means presenting yourself in the best light possible and only including materials you would like a prospective employer to view. You may use materials developed elsewhere but review and update them if necessary.
This individual project will ensure that everyone is able to participate in the final group project. While some of you may already have personal websites, this project will require you to build a new site from scratch to meet the following criteria.
Minimum Requirements:
• Your website must include appropriate and understandable page titles for each page. These titles display at the top of the browser when users view your pages
• Must have a minimum of three sub-pages excluding the homepage. Additional pages MUST be subpages linked off the homepage
◦ Homepage: This page will include a brief introduction of the site, links to the other pages, pictures, etc.
▪ Name the Homepage file ‘index.html’
◦ About me page: this page tells about yourself and everything you want a prospective employer know about you.
◦ Other pages may include the followings:
▪ Project page: This page should include an organized set of your past/current projects.
▪ Future goals page: This page should include an outline of what you want to achieve in the future.
▪ Resume page; Create a resume for yourself and include that on this page.
• Use HTML5 and CSS3 only (use of templates is not allowed)
• Use external CSS files
• Pages must be professionally related and well organized and each page should have a clear navigation bar (links to all the pages in the website)
• All links must go to designated targets
• Other things to consider:
◦ Check your website for any misspellings or grammatical errors
◦ Your website should be attractive, easy to navigate, and pages should fit together properly.
◦ Check your website for accessibility. Your website must be accessible to hearing and visually impaired users. For example, use standard internet fonts and include alternate text for all images
◦ Your code must be correct, well-structured, free from clutters, and easy to read
◦ Use proper indentation and add comments where it helps with the readability of your code. If you copy codes from somewhere else, make sure you review and adjust it to your page. Avoid having any unnecessary lines of code that don’t do anything with your page.
◦ Avoid using multiple styling formats
◦ If information cannot be viewed due to a webpage error, it will be considered absent. Therefore, verify that the entire website works properly.
NOTES:
• You may decide to go with a one-page design format if you wish to. If so, you still need to cover all the requirements listed above.
• Your website for this project doesn’t have to be fully responsive, but it must be displayed with a reasonable proportion to a regular screen size.
Where to start?
• Before beginning to code, think about your content, plan out your entire website using wireframing, and start coding with your homepage (index.html).
• After you have planned out the number of webpages (four for example), create and save blank (empty) HTML files, one for each page
◦ Note: If your website is one-page format, you will only have one HTML file
• Use a good naming convention for all your files (short but meaningful names)
• Save all files into a folder labeled ‘Lastname_FirstName_Project1’
• IMPORTANT!!!!!!!! – All of the files (word, picture, text, video, etc) that support a webpage MUST be in the same folder as the HTML files. Therefore, if you want to use a picture on your website and the picture is on a different directory, it must be copied into the folder where all other HTML files are located.
◦ Do not change the relationship of the files to one another when your editing is complete
How to submit?
Organize all the files associated with your website, including the text files, images, video, etc, in one folder labeled as ‘Lastname_FirstName_Project1’, compress (zip) the folder and upload the zipped folder to your Canvas under this Project.
IMPORTANT: Please note that you should rename your folder in the right format before compressing it. Your submission will not be graded if it doesn’t follow the right format. Additional web pages may be organized in separate folders that are named properly, but your final submittal is one folder only (‘Lastname_FirstName_Project1’ folder) that includes all the subfolders and other associated files.
Project Assessment
This project has 100 points and takes 20% of your final grade. The evaluation will be based on the following criteria:
1 Appearance and Attractiveness 20 pt
2 Appropriate and Related Content 15 pt
3 User Friendliness 15 pt
4 Code Readability 15 pt
5 Code Correctness (valid HTML5 and CSS3) 20 pt
6 Accessibility 15 pt
Total Grade: 100 pt (20% of the Final Grade)