A Year of Showing My Work: Day 11

This evening I’ve been fooling around with the navigation for the Girl Develop It Dayton site. As of right now, it looks like this:

gdidayton.com mobile view

It’s a little awkward. The spacing is off and it takes up too much room on the page.

And while I think it could still be better, this is what I came up with to at least improve it.

new gdidayton.com mobile view

Putting the menu off to the right and the logo to the left allowed me to decrease the height of the navigation section, meaning the user can get to the content of the webpage that much faster. Plus we don’t have as much awkward white space anymore.

But now there’s another problem. Here’s what it looks like on an tablet screen:

new mobile view on tablet screen

Fortunately, with a few easy changes to the media query sizes, I was able to fix it so it looks a lot nicer.

updated mobile view on tablet screen