It is always a good idea to periodically change your website to keep it looking sleek, fresh, and modern so users can have the best possible experience when scrolling through your content. I’ve decided to take the past few days and change the look of my website until I was satisfied with the end result.

Here are the changes I made and the decision process behind them.

Before

After

The home screen got a very major overhaul. The clearest change is the accent color of the featured blog posts. Originally, the accent was black with a lowered opacity so the title of the blog post and the corresponding image can both be seen pretty well. The accent color got changed to blue because it feels more welcoming and may encourage more users to click on the featured posts and read them.

Header – Before
Header – After

The header got a much-needed redesign as well. The logo got changed from black to white for easier visibility (the logo redirects users to the home page, so if it cannot be seen, what’s the point?). The name of the site was removed from under the logo and replaced the word “Home” in the header. Since “Home” also redirects users to the homepage, I figured that placing the website name there would serve that function well and get rid of the unnecessary wording underneath the logo.

The “About Me” page was also changed to simply say “About.”

Lastly, instead of having all of my Interactive Media classes take up a space on the header as their own category, I decided to place them all in a drop down menu, all under the name “Interactive Media & Communications.”

Before

After

Believe it or not, this part of the homepage got the most alterations. The font color for the headings got changed to blue, while the typeface for both the headings and the text changed to Museo Sans. I’m a huge fan of Sans Serif typefaces and I believe Museo Sans matches closest with the style I was intending.

The biggest change you’ll see, however, is the decision to swap the background colors from white to black. There are three different background profiles in this screenshot: the header, the intro text, and the blog post text. In order to change the background color, I had to add additional CSS into my theme and figure out the codenames for each of the profiles because I needed to individually change their color to black. I tried to view the page source of my homepage on Google Chrome, but due to my lack of experience in code, I looked up WordPress forums and found specific forums relating to my theme which gave me all the answers I needed.

I like to have black backgrounds on as any pages as possible. I have Dark Mode enable on my MacBook Pro and my iPhone XR, and before Apple released Dark Mode for iOS, I inverted my phone’s colors specifically to have black backgrounds on my pages. As soon as I found out I can customize the CSS of my theme to enable black backgrounds, I knew I had to do it.

Currently, every part of my site has a black background except for all of the pages and the posts. I don’t think black backgrounds are absolutely necessary for the areas that contain all of my content, but if any of you reading this feels that they need the black background in order to keep consistency with the rest of the site, please comment below and I will take your feedback into consideration.

Bottom of home page – Before
Bottom of home page – After

The last major change I made to the homepage was adding a footer widget below the recent blog posts. This allows for extra flexibility for those who do not want to leave the homepage and go looking for my content. I added four extra areas in the widget below.

The first is a video that is playable straight from the widget. Currently, I have my recent animatic I made while learning Blender. I plan to replace that with a demo reel about my student film projects once that is completed.

I also added an archived blog post list, allowing you to search for blog posts by month. I thought it would be a neat addition for those who want to look through my older content.

To its right, I added some contact information, including my phone number and email address. This is the most necessary addition because it eliminates the hassle to try and search for my contact information using external sources.

Lastly, I added a translate option on the right side of the footer. I felt that the choice to automatically translate my text to a preferred language is not only beneficial to the user, but beneficial to me so my site can attract as many people as possible.

Those were all of the major design changes I made to my website. I appreciate any feedback on what you think of these changes. I want my website to look cleaner and have more functionality, and I believe I have achieved that.

Due to my decision to stick with the same theme, all of the other pages on the site were not changed nearly as much as the home page was. All of these pages do feature the black header and the footer widgets mentioned earlier.

Social media profiles (left to right: YouTube, Instagram, Facebook, LinkedIn)

Finally, I added my main social handles on the bottom right corner of my website (they’re on the bottom right corner of this page as well), so go ahead and give me a follow on those sites!

About the Author Gabe Walerysiak

My name is Gabriel Walerysiak, and I am a graduate student at Quinnipiac University in Hamden, Connecticut. I graduated with my Bachelor's Degree in Film, Television and Media Arts, with a minor in Mathematics in June 2020. I am currently pursuing a Master of Sciene in Interactive Media and Communications and will graduate with my master's degree in May 2021. I recently interned at GlucoseZone this past summer, where I edited and helped film a bunch of promotional content for their social media pages. I have a hobby of capturing and editing video-game footage for a YouTube channel that I started in the Seventh grade, and that channel is the primary reason I chose to major in Film, TV, and Media Arts. I am also a passionate runner, and even though I am no longer on a team, I run to keep in shape because I know how important that is in today's world. I am looking forward to be more fluent with technologically enhanced creative programs such as the Adobe suite, productivity tools such as Microsoft Office, and any other creative tools I can get my hands on to further improve my work as a creator.

1 comment

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: