A Fisherman's Life Website

Final project for CGS 1831 Web Foundations/Essentials

  • Home
  • A Fisherman's Life Website

The Problem

Most fishing charter and boat rental websites for businesses located in the Tampa Bay area are not aesthetically–pleasing, are cumbersome to navigate around, and inefficiently place elements to the point where the user can get confused. Not only were these sites an eyesore, they were also frustrating to use. Developing a refined fictional charter and rental website illustrates how companies can improve their layout and increase traffic. Read more about about the problem and its solution on my business website.

The Solution

After researching UX issues related to web development, my strategy was to improve the layout of the navigation, section, and image elements such that users can quickly understand who the company is, why their services are pertinent, and what actions they can take to purchase services. To accomplish this, I designed a more intuitive UI that allowed for easier navigation.

My Role

This individual project enabled me to craft my web development skills by:

  • Understanding how design influences decisions in development
  • Learning the fundamentals of markdown and styling languages
  • Creating an enjoyable user experience
  • Applying website and accessibility best practices

Tech Stack & Project Progress

This project is built on HTML, CSS, vanilla JavaScript, and jQuery. Although only HTML and CSS were taught in this class (and required for the project), I wanted to add more functionality to the UI; thus, I learned the fundamentals of JavaScript and how to import libraries on my own time to enhance the unique look and feel of the site. Fonts are provided by Google Fonts. Security is maintained through Netlify. To comply with tech stack updates, I fix issues and inspect the codebase for vulnerabilities every three weeks.

Project Info

  • Affiliation St. Petersburg College
  • Development May 2022 - July 2022 (7 weeks)
  • Languages HTML5, CSS3, JavaScript
  • Libraries jQuery, Google Fonts
  • APIs Netlify API

View Website & Code