FANDOM


Mobile-Modernization-Header

We've done a lot of work this year to improve the mobile experience. First we worked on a lot of backend changes so the mobile site would load faster and perform better. Most recently we've been rolling out more changes to the mobile web design to enhance the experience.

Why we've changed mobile web

You may be wondering, why make changes to mobile web? Put simply, if pages look more visually engaging and of a higher design quality, we’re more likely to see return visitors to communities. Not only that, but better-looking pages attract higher quality ads—and the higher quality our ads are, the fewer of them we need. Just like how we were able to slash desktop advertisements by 30% in 2017, we believe that a better mobile design will allow us to have fewer mobile ads and a better performing page.

So what's changed on mobile?

We've seen a lot of success with Mobile Modernization this year. Here's what we've accomplished so far:

  • Performance improvements. Backend changes have already led to a 51% decrease in the amount of time it takes for you to begin interacting with the page, down from 7 seconds to 3.5 seconds.
  • Font changes. In March, the mobile web font was changed to Rubik for wiki pages. This is the FANDOM brand font, and the change brought consistency between mobile web and the FANDOM app.
  • Article top restyling. In July, we updated the global navigation on mobile web and desktop. We also updated the look of the top of the mobile page so that the global and local navigations worked together more effectively and brought the community name to the forefront.

This month, we also made a number of important design changes:

  • Portable infobox restyling. We restyled the look of portable infoboxes so they stand out more, making it clear that they're a quick info section about a subject.
  • Search screen update. We enhanced the search screen to add trending FANDOM articles as suggestions for further reading, bringing more unity between the different content types.
  • Mobile editing. For now, we removed the Edit button on mobile. This feature did not see much use in the grand scheme, and the mobile editing experience is not where we want it to be. We hope to re-add the mobile Edit button at a later date, once we can provide a better way to edit on mobile.
  • Footer updates. The global footer was updated with a new theme, and "other languages" have been added across the site so users can navigate from content in one language to another.
  • Galleries. We are displaying multiple images in a gallery by default instead of just the first one, so you are more likely to immediately see the image that you are looking for.

In the near future, tapping on an image will open up a brand new lightbox that will allow you to easily navigate to the image of your choice in the gallery. We'll also be making an update to how tables are presented so they’re as legible as they can be on mobile web.

The success of Mobile Modernization

We're thrilled with the success of Mobile Modernization. There will always be desktop and mobile changes, but what we've accomplished here and the updates soon to come are the culmination of the Modernization project we started almost a year and a half ago.

Now it's time to turn toward a new development project. In the next few weeks we'll be talking to you about a new product development journey we're embarking on, and we're excited to talk with you about that even more. This will include exciting developments for both desktop and mobile.

In the meantime, if you have any questions about everything that's been done in Mobile Modernization, let us know in the comments!



BrandonRhea

Brandon Rhea FANDOM Staff

Brandon Rhea is Product Marketing Manager at FANDOM. He's a huge fan of Star Wars, Star Trek, Game of Thrones, and Marvel. He's a Gryffindor whose Patronus is a cat.
Want to stay up to date on the latest feature releases and news from FANDOM?
Click here to follow the FANDOM staff blog.

Interested in learning more about community management on FANDOM?
Click here to view our community management blog.