For this project you will be designing and creating a website to communicate the essence of "you" to put on display for the world wide-web and most importantly future employers or clients.
Part 1: The Design
The portfolio you are designing is about you! You are trying to showcase you and your talents. Your website can have multiple pages or one page but it must be responsive.
- A Logo
- About Information
- A paragraph about you, your passions, your goals, etc...
- Any work experience you have
- Any school information
- Any achievements, awards, certificates, etc...
- Don't be afraid to show a little personality
- Gallery/Collection of your work images, projects, recordings, etc
- Contact Information
- Phone, email, carrier pigeon... how will someone get in touch with you?
- Mobile and Desktop website design
- Adobe Illustrator or Canva (only paid canva can export svgs) to create the logo
- Adobe Illustrator, Photoshop, InDesign, Gimp, or Canva to design the website
- Canvas Discussion to get feedback and submit your assignment
Part 2: The Code
Attempt to recreate your design with HTML and CSS. Plan out the HTML container you will need to make your design transition from mobile to desktop.
- Setup for the files
- Add a favicon to your website
- Your site must look good on multiple screen widths
- Your site must be deployed using GitHub pages (instructions in second part of file setup)
- After deploying add a link to your website to the Portfolio Websites discussion post in Canvas
For the portfolio it is recommended to use the mobile first model. What this means is you will code and style your website in mobile format first. When you get to the point of CSS coding make your browser window as narrow as possible before adding any CSS. Once your website looks great a narrow size, make the screen wider. Once your CSS no longer looks good, add a media query for that screen size.
Hint: If you use the inspector tool while resizing the screen size, it will tell you the pixel width.