Redesigned travel website
In the spring of 2020, I built and redesigned an outdated travel guide site for my Front-End Web Development II class at FHSU. called This outdated site called AssateagueIsland.com had several issues including an inconsistent color scheme, lack of responsiveness, brand identity, and usability, as well as an overload of content. Thus, I built and redesigned a modern version called Assateague Island Guide. This new website featured a consistent color scheme, user-friendly navigation menu, relevant content, and responsive design.
During the design phase, I created a site wireframe to visualize the site's layout and main content. I like to sketch my initial wireframes on paper to brainstorm and play around with different layouts. It's not fancy, but it's a good first step. After the wireframe, I designed a professional site logo that incorporated the site's color scheme.
For the development phase, I coded this site with HTML5, JavaScript, and jQuery. I added a contentEditable HTML element to the hero images' text. This allows users to change the text when they click or tap on the paragraph element. I used CSS3 to design the site. I built a simple jQuery plugin, which changes the contact form's background and text colors. I used a JavaScript library called Lightbox to make the site images interactive when users click or tap on the images.
To optimize the site for SEO, I added relevant meta description tags that relate to keywords used on each page. I optimized the site images to ensure the site performance was high. I tested the site with Lighthouse. Each page scored high for site performance, accessibility, and SEO.