Front-End Web Development Class Final Project

View both sites by clicking the links below:

FINAL SITE

TEST SITE

CPR-Test-site

Creative Property Resolutions website

GIT
Visual Studio Code
Dreamweaver
Adobe Photoshop – image adjustment for resolution, color and clarity
Adobe Illustrator – logo design
CSS
Javascript
HTML
Browser Developer Tools
Team communication using Slack
Deconstructed an html5 template from templated.co
- Designed and programmed a responsive logo using scalable svg
Used code from cssscript.com for the read more/read less function and modified to fit site design

Server-side includes using .shtml for easy implementation and upkeep of header, navigation menu, footer and scripts
Customized design
Mobile responsive, custom-designed logo added to header in place of logotype
Mobile Responsive menu with dropdown – code taken from snippet and reprogrammed to match current design and added search box to the nav menu
ADA Compliant (alt tags, raw text, etc.)
- Tested with ANDI, webaccessibility.com, and other tools on www.w3c.org/WAI/ER/tools/
Custom URL and hosting with external source
FAQs with Read More/Read Less functionality
Pop-up chat window, with custom image (non-functional)
- Added code to change to smaller icon for phones upon load or resize and used transparent icon from Shutterstock with edits
- Added a CSS shadow to the pop-up chat box and mobile icon for better visibility
- Utilized z-index code to ensure top position
Search box in navigation (non-functional)
Contact form (non-functional)
Use of bulleted and numbered lists
Utilized Flex display for alignment

Reference sites: