Portfolio Project - Incorporate SEO & a11y

Primary Goals

To demonstrate understanding of Search Engine Optimization and Accessibility Standards by incorporating them into your Portfolio site.

Overview

In this project, you will continue to build a portfolio page to practice what you’ve learned about SEO and a11y. This should take about 90 minutes.

Context

A great portfolio page will be a valuable way to showcase your skills as you look for engineering work, both in the content and in the code.

Languages

• HTML
• CSS
• Git

Frameworks

• Bootstrap

Project Requirements

• [ ] As you go through the topic outline, commit your code in git and push to GitHub after each bolded section. You should write clear + informative commit messages in command form (“Add line about technical skills”) for each commit.

Part 1 - Incorporate SEO into your portfolio webpage

Open latest version of Portfolio Project

• [ ] Using the command line, practice pulling the latest version from your remote git repo.
• [ ] Open your portfolio project in your text editor application using your command line.

Semantic HTML Tags

• [ ] Replace as many non-semantic elements as you can with semantic ones.
• [ ] Headers are semantic and content is suitable for SEO.
• [ ] (Remember to make a git commit after each set of code changes!)

Metadata

• [ ] Include open graph metadata
• [ ] Include at least 2 additional types of social meta tags
• [ ] Include a viewport meta tag
• [ ] Add Google Analytics to your site

Links

• [ ] Include links to at least your LinkedIn and GitHub pages.

Part 2 - Incorporate a11y into your portfolio webpage

• [ ] Images have alternative text
• [ ] Include at least 2 aria attributes in a relevant way
• [ ] Website meets WebAIM color and contrast standards.
• [ ] Passes axe accessibility tests
• [ ] Can be navigated easily using a screen reader

Extensions

• Spend what remains of your 90 minutes to make improvements to your portfolio site, and be sure to push your changes up to GitHub.