Nebula Coffee Company website

The Nebula Coffee Company website demonstrates my ability to create a responsive website from HTML and CSS without a CMS. This artifact is targeted at potential clients who need a simple, responsive website but don’t need many of the features found in a CMS. It is responsive and renders well across all platforms, demonstrating my ability to deliver the desired results.

Nebula Coffee Company - desktop homepage

The client for this artifact was Nebula Coffee Company. They requested a website with four pages: Home, About, Menu, and Contact. They asked for a hero image and three menu items on the Home page, a carousel on the About page, appropriate photos for the Menu page, and a form on the Contact page. They provided a Style Guide with the logo, color palette, and typography. The concept for the site content was to expand on the client’s name and include items that fit the “outer space” theme. Everything came together to present a cohesive brand image. The site has everything the client requested and is responsive. The color contrast complies with WCAG AAA standards, the Navbar has a contrast ratio of 10.46:1, the Footer has a contrast ratio of 13.93:1, and the body text has a ratio of 21:1 (WebAIM).

Nebula Coffee Company website homepage as viewed in landscape mode on an iPad

The message is that Nebula Coffee Company offers a wide variety of offerings, all with an outer-space theme. They are a fun place to get great coffee and coffee-adjacent items.

The use of grid layouts made the design effective by maintaining relationships between the various items, regardless of the platform being used to view the site. The use of the color palette and typography created a visual hierarchy.

Nebula Coffee Company website homepage as viewed in portrait mode on an iPad
Nebula Coffee Company website homepage as viewed on an iPhone



Of the two websites I coded for GRA-310 Digital Graphic Design for Web, this one is by far the best example of the quality work I produce. I went to great pains to ensure that the site was responsive and that every part flowed in the proper order, whether viewed on desktop, mobile, or tablet. This site demonstrates that I can create a fully functional website without using a CMS.

It needs some revisions. The menu is extensive and somewhat overwhelming. It is currently broken up into only three categories: Hot Coffee Drinks, Hot or Iced Teas, and Cosmic Pastries & Light Bites. The Hot Coffee Drinks section includes Milk Alternatives. The Hot or Iced Teas section includes Hot Beverages, Cold Beverages, Specialty Drinks, Boba Teas, and Sweetener Options. Yet Cosmic Pastries & Light Bites offers a wide range of food under that single category. To improve the site, I’d break the three categories into six beverage types and milk and sweetener alternatives, and categorize the food items into Breakfast, Lunch, and Dessert. These changes will reduce viewers’ cognitive load and make it easier for them to find things.

Leave a Reply

Your email address will not be published. Required fields are marked *