This website was developed to satisfy the requirements of Day 3 of the 30 Days of 30 Sites challenge - Tourist Attraction.
As Fall was clearly on my mind and I was already in the early stages of creating a blog post for some of the most popular fall attractions in Southwest Ohio, I decided this was the perfect topic for this website design. After all, fall is actually one of the biggest events in Ohio. Believe it or not, people come from all over the country to celebrate events like Oktoberfest Zinzinnati.
UI/UX Design
I began by creating the user interface design in Adobe InDesign. While I have access to Adobe XD, I have found that InDesign is much easier and quicker to use, especially when I only intend to create a single page of content. I decided very early on that I was not going to create individual pages for each attraction / event. Instead, I am going to link back to the completed blog post once it has been published.
Website Design - HTML / CSS / Bootstrap 4
Once I had an idea of the overall design of the page, I created the HTML and CSS in Codepen. The layout is very simple. So, I decided using Bootstrap 4 was the quickest and easiest way to get the results that I wanted. Normally, I prefer to write my CSS from scratch instead of using external libraries and frameworks. However, in this instance, I think it was well worth the time saved.
It's worth noting that I do not have any of the 'Details' buttons linking to anything, nor do the links at the top of the page work. As I said, the details buttons will link to the blog post once I have published it. The other links are there simply for demonstration purposes. I may create those pages at a later date, but for now they will remain unclickable.
As you can see, the pen above is fully responsive, so it looks great at pretty much any size, but if you want, you can always view it in full-page mode.