Web

KNIGHTCRIER.ORG

Our site was in desperate need of an extreme makeover.

Here’s what it looked like before:

I remember Connor, Jojo, and I briefly discussing in our editors group chat about how we wanted to make some changes with the layout of the site.

But that was as far as we got in regards to changes—just talk, no action.

I started playing around with fonts one day and as I clicking random buttons, I started messing around with other things. I changed up some of the widgets and experimented with different designs.

I asked my advisor, Connor, and Jojo if they had any suggestions on what I should try out. To be honest, they didn’t give me anything to work with, so I stopped asking them for suggestions and went to work.

I knew that everyone wanted to get rid of one thing: the boxy widgets. We wanted our site to look less like a website and more like a newspaper.

I started by working on the banner. Similar to The New York Times or The Washington Post, we wanted it to be minimal. In our original banner, the photo of our school was too blurry and clashed with the text. My advisor wanted to keep our slogan and location in it, so I kept it there but in small font and in grey. It wasn’t award-winning graphic design, but it was what we wanted.

For a while, I kind of started to hate the banner, but I told myself to fix the rest of the site before I make any changes to the banner.

I referenced 10 different websites that shared the same platform as us. For the news section, I wanted to have a featured article and then make the rest just the headlines and the first few lines of the lede. Making them all show the images would erase the focus and I wanted people to see the headlines.

Moving on to the next section, I wanted to make it the opinion section and put a black background on it, so it would stand out. I had to break up the white background and add some contrast. This time, I kept the pictures there because I already made the news section have more words, and there had to be a balance.

Recently, two staff writers started a podcast. I made it so you could listen to it directly on the site. This also helped break up some of the sections.

Below the podcast, I created 3 columns: Our poll and Twitter feed, People in the Pods section, and Features section. I wanted to do something different for this section and highlight more articles in one area.

I then created the Sports section and made it similar to the Opinion but added a blue background to make it pop (and because Navy and Columbia blue are our school colors). I’ll admit, I would like to do something different, but my options are limited. I still plan on changing it a bit in the future.

As for the Student Life section, I kept that simple and made it a single pop-up. Like the Sports section, I do plan on changing this one eventually.

Below the Student Life section, I included three other sections: Knights in the Castle, North Penn Television Links, and Entertainment. I put them in 3 columns.

For the Alumni Spotlight section, I kept it simple but removed the lede, so it was just the headline, author’s name, and date it was published.

Those were the main things I did with the widgets. I also changed both of the navigation bars. I made the top one black and I moved some of the categories around. I also made the social media icons black to add contrast and match the theme. Anything that was once grey or blue is now black, including the text and footer. We had an Email Updates widget, which I no longer kept, and I moved it to the navigation bar.

Here’s the final product:

While I do plan on making some more changes in the future, I finished doing the bulk of the makeover. I’m absolutely proud of how it looks and of myself for dedicating multiple days worth of hard work. Our site is now organized and professional-looking.