Building a Website for Things to Do Around Washington D.C.
I couldn’t find a good guide for what to do in Washington D.C., so I made my own.
Before I get into how I built this website, I want to first give some context on what led to my taking up on this endeavor. The journey started in March 2023, when for my final project in my INFO 2300: Intermediate Web Programming & Design class, we were tasked with creating a site that displayed a filterable & sortable list of items. I was stumped on what to create my website about. I knew many people created Spotify album catalogs, but I wanted mine to be unique and one that I can get actual use out of. My mind wandered to my summer internship which was located in Washington D.C.. I knew I’d be working during the week but was curious to research things to do on the weekend. After researching for some time, couldn’t find one that fulfilled my needs and interests. Then it dawned on me, let me make my final project about things to do in and around Washington D.C.. The idea was born.
When creating websites, there is a specific guideline to follow. You don’t automatically start coding your idea. To build a website that is aesthetic, does its job, and pleases the users, you need to be an effective designer too. Here’s a quick rundown of the proper order to build an effective website:
- Internalize your target audience
- Your audience should be specific but not narrow. Document your audience’s goals for using this catalog website. Consider their wants, needs, problems, and factors that influence their behaviors.
2. Design your website to address the goals of your audience(s)
- Sketching out your website before coding it allows you to personify the audience and create a site that truly speaks to them. You want to design a site that solves their goals in the most effective & efficient way possible. By sketching out your designs first, you can make quick changes before starting to code.
3. Start coding your site one page at a time
- Coding multiple pages at once can be confusing and lead to errors in the code and functions not turning out how you expected.
For my website on things to do in/around Washington D.C., I designed it for those unfamiliar with the Washington D.C. area (aka me). My website was also going to include a section for users who know the area (aka my beautiful girlfriend Lauren), that can login and add/edit the entries in the catalog. I wrote out the goals, desires, factors that influence behaviors, etc. for both of my audiences to truly interalize their thoughts.
After that I began designing my site by sketching out preliminary wireframes. Sketches do not need to be complex (I am a terrible artist). They just need to visual your thinking so you can see what your site will hopefully look life. Here is my sketch for the Admin View page:
After these steps, you can FINALLY start coding your site. I coded all of my pages in HTML and styled them with CSS. You can also include JavaScript to add animations and dynamic features to your website. I also utilized SQL to handle the database, and PHP to handle the server side.
I ran into numerous problems while creating my site. Some were easily fixable and required only a look-over of my code or a quick Google search. Others, however, were much more complicated to resolve and required me to change around multiple parts of my code. However, running into bugs while coding is a normal part of the development cycle. When you run into issues, I encourage you to persevere and work to debug slowly but steadily. It also greatly helps to take breaks from coding to let your eyes and mind rest.
After two months of coding, I was proud of my minimum viable product (MVP) and submitted it. Here are a few screenshots of my website:
I enjoy reflecting on past experiences, projects, and people. It gives me time to see what I did well and what I can improve on the future. I hope this article has given you some motivation to be a self-starter and create something if it doesn’t exist or not up to your standards. You can learn a whole lot in the process.
