Websites adopting designs originally made for desktop screens often look cluttered on tablets and mobile. As smartphone and tablet use increases, leading content providers are moving towards web designs that look best on smaller screens.

Today, even the earliest content portals in the Middle East are getting on board with the global trend. Egypt's Masrawy, a pioneering content platform launched by LINKonLINE in 1999, launched its newest beta version two weeks ago to reveal a daring new horiztonal design tailored for tablets and mobile.

“We realized that even though the majority of the Egyptian web users still use bigger screens like desktops, and laptops they by far prefer tablet and mobile navigation experience,” says Karim Abd El Kader, Assistant Brand Manager at LINKonLINE.

Masrawy is one of the first portals published by LINKonline, the biggest digital publishing platform in Egypt, if not the Arab region. This newest iteration is hardly its first since its original launch 14 years ago; the site tends to iterate its interface every other year, says Abd Al Kader. Today, LINKonLINE publishes 12 websites, employs 70 people and reaches one third of the Egyptian audience on the internet, he says.

Their new design inverts the typical vertical scrolling characteristic of webpages in favor of a distinctly horizontal navgiation, on which readers can use the arrow keys or click on arrows on the screen to reveal more content to the right or left.

It might not feel immediately intuitive on the web, especially to users coming online for the first time (which there are still plenty of in the Arab world), but the design didn't come out of the blue; LINKonLINE queried focus groups, surveyed clients and users, and assessed heat maps to determine the new navigation. 

“We were driven by our will to create something new and innovative and delve into the future of the internet, which is tablets,” says Abd El Kader.

Masrway's move towards horizontal scrolling also echoes the design on USAToday, one of the biggest online and offline daily newspapers in the U.S., which pioneered horizontal navigation back in September 2012, on its 30th anniversary. The site's navigation, which features clickable arrows on either side that allow the reader to pan through content horizontally, was described as being "very very influenced by iPad design." 

Masrawy’s target is to reduce visual clutter, organize content layout, and make an entire article readable without the need to scroll. “It's all in your 100% of attention area, and it's where you expect to read it, find it and use it,” says Abd El Kader. It's also simply "what our users want,” he says.

Enhanced ad products

With much of the region's ad spend today going towards Facebook and Google ads, Masrawy hopes that its new design will help it carve out a share of the local market. “We want to compete with Facebook and Google, so we came up with new innovative ad products,” says Abd El Kader.

Improving the site's ads has been a main goal while revamping its design; the old Masrawy design featured several small ads that were almost lost within the content, while the new ads are large and easy to see, making the site sleeker while offering the client more exposure as well. Some pages even have a well-designed full-page ad which you can view and then close to enjoy content without being disrupted more with ads.

Although, as mentioned, Masrawy has been iterating its design every other year since 1999, this latest overhaul has been the most dramatic change. Initially, despite their user testing, the site's team didn't expect it to boost traffic right away. Yet according to their metrics, it's been good for business.

“Since the launch of the beta version, our bounce rate decreased 27%, page visits increased 140%, and the average visit duration increased 55%,” says Abd El Kader.

Pioneering a completely horizontal navigation in the Middle East might be considered by some to be risky and daring. It certainly takes getting used to; in the early days of Wamda, we had horizontal scrolling that failed to be well-understood by our users due to a lack of signposting or clear buttons. More user testing lead to our current design, a return to vertical scrolling, but moves like Masrawy's beg the question: do readers really want a webpage that echoes their tablet navigation? 

Implementing horizontal scrolling isn't a design revolution, but, in Masrawy's case, it's enough of a big change by an established market leader that it could influence other brands in the region. In the next couple months, we'll either witness the success of the new design or its failure. If it succeeds, will it become a model to follow for other media platforms?