When I first began designing my website I don’t think I really knew what I wanted to do with it. I was trying to reflect on the work I do, especially social media/internet writing, but I had no idea how to go about it. I felt like I had to tell people what I did…I didn’t know how to “show” it.

As I read more and more about emotional and responsive design throughout the semester it began to make more sense to me. Ea conference with Dr. Wolff proved to be immensely helpful. I am very thankful for all of the help and guidance he has given me as I designed my website. I remember one of the most important things that he taught me through our initial conference was to focus on my work and not myself. In the early stages of my website my home page was just a huge instagramed picture of myself and an “about” page that read more like a biography than a writer’s statement. It was not very emotional. It also didn’t use the grid-based approach because I didn’t understand how to use it and therefore neglected it altogether.

During that conference Dr. Wolff explained the grid-based approach to me once again in a way that made more sense than the book did. I learned how to break my website into little pieces using boxes/containers and began to brainstorm different ideas for how to display my work. The idea of showing feature articles on my homepage came up and I decided to take down my photograph. It’s not important for users to see me on this website, it is my work that they should be focused on.

The first attempt at showing off my feature articles was using three of them in separate containers. This sounded like a good idea, but turned out to be a disaster. The website always looked very cluttered. I fixed it when I added padding…but the website was very “fragile”. It seemed like every time I changed the slightest thing with it the padding would get lost or messed up and everything would display wrong with text outside of containers or containers overlapping, etc. I was never very happy with this style, but I didn’t really know anything else to do.

When Dr. Wolff showed our class how to use slideshows it turned out to be the solution to my problem. With the slideshow I was able to  completely eliminate all of the cluttered boxes and to just use the slideshow to feature screenshots of my article. This was a very beneficial way for me to show people my work directly without having to tell them about it. I was able to use the remaining grid space for my Twitter widget. Twitter is a big part of the work that I do and I am an avid tweeter. When people search me on Google Twitter is one of the first things to show up. By adding Twitter on nearly all of my pages people will be able to find my website more easily.

The only real thing to focus on/problem I was having after the slideshow was the font. My original fonts were just default/basic fonts that were boring and unemotional. I needed to find lesser known or custom fonts. I loved using Google Fonts because they were so easy to install which was helpful for someone new and inexperienced in coding like myself. I sometimes had trouble choosing fonts that gave my website a personality, yet were easy to read. My initial choice was called Englebert. It looked good on Google, but on my website when I used it with big bodies of text it was difficult to read and on smaller devices like iPads and cellphones it clumped together. I needed to try something new.

englebert-font-difficult-to-read

Photograph shows Englebert font at different sizes. The smaller the font, the harder it becomes to read.

My next choice was Josefin + Slab. This font was more simple, yet elegant. I tested it at different sizes and it seemed to be fairly easy to read from a number of font sizes. I liked this one because while it was personal and gave off a “handwritten” feel, it was still easy to read.

josefin+slab-is-easy-to-read

I wanted the headers to stand out from the other text so I kept them orange and used another font – Bubblegum Sans. I liked this font because I thought it was fun and playful and helped to give the website even more personality and keep it from being too serious or boring.

 

homepage-shows-orange-bubblegum-text

Overall I think I’ve come along way with my website and I am pleased with the progress I have made. If I had more time or skills I would like to try to have my own handwriting serve for the basis of the font to make it even more personal. I also would’ve liked to do more with social media pages. I tried in the very early stages but had trouble getting the buttons to all work and look good together, so I ended up scraping the idea and focusing on other ideas instead.

Advertisements