dingogap / html-portfolio

Advanced CSS Portfolio

Description

My Portfolio webpage showcases websites I've built using HTML, CSS, Javascript, Bootstrap, Ajax and Liquid. These websites are hosted in the Treepl CMS platform.

I'll add more websites to the portfolio as they are built to replace the Place Holder items that I've included for effect.

My Portfolio Website Link

Click the link to visit the deployed website: Peter Medbury's Portfolio

Site Structure

My Portfolio is a landing page. It contains:

1. Header - containing Branding and a NavBar
2. Main Content Area
   1. A Hero Section with a background image and a Subtitle
   2. Content Area showing:
      1. Information About Me (lorem ipsum text)
      2. The Websites I've Built
      3. My Resume (lorem ipsum text)
      4. My Contact Details
3. Footer with © Statement

Navigation

Clicking a NavBar Element scrolls the webpage to the appropriate article in the Main Content area. The first three Portfolio Examples are links to live sites I've put together over the years.

Responsive Features

Media Queries and CSS allow the webapge to adjust to deivces of different sizes. The webpage works on devices ranging from a desktop/laptop through phones & tablets (both portrait and landscape).

Changelog

The development history is recorded in the Changelog.

Resources Used

1. Bootcamp Materials - Lesson Material fro Week 1 & Week 2
2. Prior knowlege and experience
3. MDM Web Docs for informatipn about HTML and CSS
4. CSS Tricks - A complete guide to Flexbox
5. Flexbox Froggy
6. MDM Web Docs - Guidelines for styling CSS Code
7. W3Schools Semantic Elements