New Wesleying: Redesign 2013

New Wesleying YAH!

We’ve wanted to redesign Wesleying for a while and finally got around to it this Winter break. Here it is! The new site is live! Rejoice! It’s 2013!

Our aim was to have a user-friendly, sleeker design with better-organized content. It’s still a work in progress, but a step toward having a more mobile, social, and visual site.

There’s now a navigation bar to make it easier to separate between featured and event posts; it’s also where you’ll find our submission forms and a revamped “links” page. The sidebar is cleaner and still features the weekly-ish poll, shoutbox, and popular posts list. We’ve added a social media widget so you can follow Wesleying all over the interwebz. Most noticeably, the newest featured posts are highlighted at the top of the page so you can view them more easily.

We expect to roll out some minor changes in the next few weeks, but this is basically the new site. Enjoy it, embrace it, explore it, and as Wesleying’s resident computer beauty expert Evan Carmi ’13 has stated, “Change is hard. Suck it up!”

If you have any questions, thoughts, or constructive criticism, feel free to send them to staff[at]wesleying[dot]org. It’s an ongoing process and we appreciate your opinions.

If you’re interested in the geekery behind the redesign, read more after the jump. 

Technical Details

When we started this redesign, we knew we wanted to have a faster, modern site. In other words, HTML5, CSS3, Javascript, and a responsive design. To make things easier we started with a responsive theme, Twenty Twelve by the WordPress creators, and created our theme, wesleying2013, as a child theme.

We added Font Awesome, a sweet vector icon font to our site, which allows us to use icons to add a more intuitive feel to the User Interface.

Feel free to increase or decrease the font size in your browser. Since these icons are all vectors, they don’t suffer from pixelation. Awesome. FontAwesome!

A globe icon from FontAwesome.

A few other nice UI features include infinite scroll via AJAX, and a hook on the featured posts links in the header. If the featured post you are clicking on already exists on your current page (say you’e on the homepage and it’s the third post down), then you will scroll to that post on the current page instead of going to the detailed view for the post. Also, the links page has show/hide buttons so you won’t be overwhelmed with 400 links. Kudos to Will Durney ’14 for help with the JavaScript.

All the code is on Github, so feel free peak around. If you got some great ideas, send us an email or submit a pull request!

Designed by Evan Carmi ’13, Web Designer for the New York Times and Wesleying.

8 thoughts on “New Wesleying: Redesign 2013

  1. Nathan Shane

    While I do appreciate the new features at the top, the original layout for wesleying was simpler and nicer to look at. I think part of it might be the new font?

Comments are closed.