OutBound Website
Final Project - Web Development Course
I created this site from scratch for my Final Honors Project for CIS 300 Web Development and Design.
It uses HTML5, CSS3, and JavaScript (ES5).
About OutBound
I had started OutBound my junior year of high school as an online resource to help LGBTQ students leaving the closet by connecting them with personalized mentors.
At the time I had created the site using Squarespace, so my project was to rewrite the site on my own.
Design / Programming Approach
This project is my first time ever creating a website! Nevertheless, I tried to follow best practices.
In particular, I tried to follow Object Oriented CSS and the BEM naming style. I used this style guide focused on "sane" and "maintainable" CSS.
I also aimed to make a responsive site and follow HTML5 best practices.
Issues
No backend
Backend server support was outside the scope of this project, so the registration forms currently don't actually do anything after submission.
Sometimes awkward UI
Because the point of this project was to learn, I focused on doing things from scratch rather than just copying code from others. So, some things like the responsive mobile menu are fairly awkward to use.
Still slow to load
Even with taking steps like compressing images and enabling GZIP compression, this site is still relatively slow to load.
What I learned
While I've authored sites before, this was my first time ever coding a functional web site.
- HTML5 elements and best practices
- Object oriented CSS and BEM naming style
- Responsive web development
- JavaScript and jQuery
- Speed optimization / compression
- Git