How to design a news type portal site

　　The design secret of the News class website

Recently, a friend suggested that I write some analysis about the news Web site: What is the right news page design, what is wrong. He believes that today's online news user experience is very backward, boring, and only they do not do it, using AJAX or similar technology to be able to deliver the content of the perfect, and navigation done beautifully.

At first I was very sympathetic to his point of view. I think the web of news is bound by the fact that traditional newspapers and magazines used to be paper media, which are easily incorporated into the deep-rooted practices of the pages. As a result, users will find that this kind of web site feels familiar, but it restricts visual performance. At the same time, most of the news Web site's user experience design is very poor, often can be difficult to read small text.

From the "Internet design" began, I know this sentence has been repeated countless times, if the network compared to a medium, then the network is flowing, is complex, but also beautiful. And the power of the web is beyond the expectation of most people.

So let's take a look at these internationally renowned news websites to see their strengths and weaknesses.

　　Ultimately, the user experience at the mobile end

In fact, the main also has to be the experience of mobile end users. However, many news websites do not take such users into account. Of course, many news sites have been out of the iOS or Android version of the original application, but unfortunately the effect is not ideal, most of the users after downloading, using a few times on the basic abandoned to the sidelines.

What is the way we get information? Because it is too official, the content is too conventional, now users rarely take the initiative to browse news websites. They usually get information by clicking on the sharing of friends, relatives, and netizens. Get information through social networks, E-mail,rss feeds, and links to news feeds. Link-oriented is often a Web site, but not an application. Therefore, each news class site must pay attention to the mobile end of the user experience. There are too many people using mobile phones to browse the news.

So what's the problem? Why don't news websites improve?

The road is long and there are two stumbling blocks ahead to be cleared.

Bandwidth

News websites, which typically present a large amount of information on every page, means that reading requires a lot of bandwidth. There are usually 3-5 recent news stories to attract users ' attention, a bit of news photography and scrolling news, plus some javascript effects. This allows the mobile end user to download a large amount of data. Many mobile end users do not have free Wi-Fi, mobile phone bandwidth is limited, even if many Wi-Fi sites, tablets and smartphones browsing the web is very slow.

So the gaudy style has to change.

Not everyone's hardware has a fever.

Remember what I mentioned above? My friend thinks news websites should add a little Ajax effect so that they can achieve a better user experience. But I remember he used the IPAD,IPAD hardware is very good, quick. Recently, someone sent me a hipstreet Titan. Because it's so cheap, it's not as smooth as a high-end device.

Second, users who use low-end devices are far more users than those using high-end devices. Just like someone else sent me that flat, not only Wi-Fi slow, page reading is also slow, JS most dynamic effect. Sometimes it's so slow to turn the pages up and down. By the way, news websites are mostly full of rotational effects, which is a killer for low-end devices. However, some low-end devices can be resolved by changing the browser. I have to use opera, even after multiple optimizations, but the hardware is too restrictive, if your site is not very good compatible with low-end devices, then you will lose a large number of users.

　So what are the media giants doing?

It seems that most news-type websites are relying on native apps, with only a few pioneers trying to respond to design.

The Boston Globe

Select this site mainly because of its popularity, many design groups greatly admire the homepage of this site. Regardless of the large amount of information on the page, the overall design looks quite neat and orderly, links are large enough to facilitate touch percussion. The image is slightly smaller. The overall style looks like a newspaper, focusing on typography and orderly typography, and it's easy to navigate with my lousy tablet.

The Onion

On the layout method, it feels slightly like the Boston Globe: The three columns are narrowed into two columns and then a column. Anyway, this method is very useful, my tablet can be smooth browsing. I think this is the reason for the popularity of this website, fluent.

Time Magazine

News Class Website Classic response type three column layout, please see Time magazine website.

Breaking News

Completely abandoned the visual metaphor of the paper media, like the use of similar methods to submit information. Special care for RSS feed readers. The Web site's responsive design is worth learning for all news classes. What's really cool is that they take into account the users of the mobile end while taking into consideration the desktop users. On my 1600 x 900 monitor, the results are great.

　　How to design excellent news websites?

Must attach great importance to mobile users, after all, many mobile users are through external links to browse news sites. You can't just rely on native apps to provide a mobile-end user experience, because there are still a lot of temporary users who won't be able to install an app to browse a news-class site.

Simplified Web site, responsive layout.

Be aware of the optimization of iOS and Android platforms, taking into account different grades (especially low-end) devices.

In fact, I think that so much, once this is done, is innovation and progress.