Sports Reference Blog

Baseball-Reference.com Relaunches with a New Responsive Template

Posted by sean on February 22, 2017

Update: A March 9th update on where the redesign stands

First off, change is hard. I know that. We've moved a few things and some things have changed, but please be assured that we had very good reasons and have tried to make the redesigned site more useful than it was before. It's not perfect, but neither was B-R last month. Please keep an open mind for a day, and if you still hate it, please let us know.

If you follow me on twitter, you know that this work has been a long time coming. Starting in January of 2015, Adam Wodon, Adam Darowski, and I started throwing around ideas for a more mobile-friendly version of our sites. Our mobile experience could have been charitably described as limited and functional. With over two-thirdsĀ of our visits coming from handheld devices, we clearly needed to up our game there.

This led to a complete review of how we present data on desktop and how we can make that usable on a small screen. It's not easy and after months of design, user testing and work, we have an approach that we believe will serve both desktop and mobile users better than they are now. If you use our other sites, this is not a surprise as all of those sites were re-launched last summer and into the early fall. That left the baseball site and its 17 years of code that needed some changing, rewriting, upgrading and general improvement. It's taken awhile, but the entire Sports Reference team has pulled together to get this out before the games start this spring.

We had a number of primary goals in mind when starting the redesign.

  1. Dramatically better mobile experience.
  2. Improve internal navigation for each page's sub-pages. Each player, team and league now have a clearly set out single navigation bar in the middle their page, that also floats at the top of the page when the page is scrolled (on desktop). The previous site had 2-3 areas per page that were nav-related with no coherent vision. It's very clear now where all of the navigation is.
  3. Create a consistent appearance and interaction across all of the sites.
  4. Improve the usability and look of our desktop pages, while also keeping all of the functionality you rely upon.

Other items that will change.

  1. We've updated our logos to be a bit less web 2.0.
  2. We rewrote all of our javascript to not use a framework, which should improve load times (an imperative on mobile).
  3. We've implemented a site-wide template system, which, after an initial incorporation, should increase the speed we can get work done on the sites.
  4. We have shuttered our page sponsorship system. All existing sponsors will be maintained for at least two years and probably more.
  5. We have shuttered our player and team Elo raters. The quality of the ratings was such that we just couldn't justify keeping them live.

Baseball-Reference.com is now in a fully functional responsive site Baseball-Reference.com.

Here are the Old and New Mobile appearance as shown on the hockey site (since I'm too tired to put baseball screenshots in here):

Screenshot 2016-06-03 11.15.23Screenshot 2016-06-03 11.15.59

Old and New Desktop Appearance

Screenshot 2016-06-03 11.16.56

Screenshot 2016-06-03 11.16.15

None of this would have been possible without our entire team. These redesigns have been a two-year process (which sad to say my trust was shaken at times)--a year to create the design and then a year to roll it out across all of the sites. I can scarcely believe that it's done.

I developed the baseball site for 15 years before passing day-to-day to Hans Van Slooten (@cantpitch) two years ago and, to be honest, I basically handed him a ticking bomb and asked him to not make too much of a mess of it. I had cut a lot of corners and some days we still can't quite figure out how things get updated or why they break (that's our next project). Doing this update has been like changing your oil, painting your car, and rotating the tires all while driving 85 down the interstate. He's done a marvelous job.

Adam Wodon (@CHN_AdamWodon) put the initial design into css and html and also blazed the trail putting the new design onto hockey-reference.com. Mike Kania (@zempf) implemented the design on PFR and CFB, while David Corby (no twitter account he's told me about) updated our NBA and CBB sites. All three took pieces of the baseball site and helped us get this up and running prior to the start of spring training games.

Mike Lynch (@SportInfo247) was our primary tester and generated at least 50 pages of notes for us to work through prior to launching the site. He saved us from deploying countless bugs and if you do send an angry e-mail, he'll be the one reading it, so please be nice about it. Jonah Gardner (@JonahGardner) runs our social media accounts, so he has been helping users online and has been introducing users to the new sites.

Also thanks to Adam Darowski (@baseballtwit) and John Hartwell (@HartwellStudio). Adam worked with us as a User Experience/Design consultant and took our comments and expectations and put it into a usable design. John has been our graphic designer for many years now and provided us with the updated logos on the sites.

One final word of THANKS, as always, for your patronage of Sports Reference. I can scarcely believe I've been able to do this for 17 years, all thanks to your support. I'm excited, relieved, and nervous to be sending this update out on our flagship site, but I hope you'll enjoy it. If we've done our job, by the timeĀ the season starts you probably won't remember what the site was like before this relaunch.

103 Responses to “Baseball-Reference.com Relaunches with a New Responsive Template”

  1. mg pharmacy rx levitra Says:

    Viagra rx sex ed no prescription men canada pharmacy mg pharmacy

  2. mg pharmacy rx levitra Says:

    Cure rx mg pharmacy exercise dysfunction erectile vardenafil http://mgpharmacyrx.com

  3. mg pharmacy rx cialis Says:

    Rx pharmacy ed pharmacy men mg viagra viagra sex

Leave a Reply

HTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>