The Daily Mail: anti-traditional web page design based on user experience

Author: spoon killer/product observer

Focus on local design, mobile Internet, user experience, and design innovation, and study how to use the design method to link "technology-business-media ". There are design columns, TEDx speakers, author of several design and non-design books in Lei Feng and yingwen. Sina Weibo: Li Yizhou DESIGN

[Core tips] from The perspective of design and user experience, why The Daily Mail quickly surpasses The New York Times and becomes The most popular newspaper network media in The world.

A few days ago, I received a call from a reporter and friend of global entrepreneur, saying whether I could tell you why The Daily Mail (Daily Mail) from The perspective of design and user experience) it will quickly surpass the New York Times and become the most popular online newspaper media in the world. We can see from its official website that they now have 40 million independent IP addresses per month. More interestingly, 2/3 of the traffic does not come from the UK where newspapers are published. In this case, we need to be summarized into a model. It seems that successful people have practiced some kind of experience, and the burst website must follow some market and design principles, the website design of The Daily Mail can be described as "simple.

 

Screenshots of the home page at on January 1, March 19, 2013

On zhihu and Quora on the Q & A website, many people have already discussed why the Daily Mail is so successful? Because I really don't like to read the article, it's almost like rolling the mouse to the end, a rough look at a few of the shortest comments, the more convincing include:

There are no advertisements on the homepage, allowing users to focus on content;

Capture the desired content, such as "sexual" and "Gossip ";

A big picture without high definition code, so that you can see enough at a time;

Waterfall stream, no refreshing tips, guiding users to stay for a long time;

In order to deeply feel the strong appeal of the Daily Mail, I used it for three days at a high frequency, I understand the content, user psychology, search engine optimization, web design, and the design team behind it. (The reason for my hasty speech in just three days is that I show myself the "intuition principle" of the product-the true appeal of the product does not require excessive "brain supplements", and the intuitive feeling is the core value)

Content

I divide news content into three categories:

Excellent (comments and articles worthy of repeated taste );

Professional (knowledge and information related to users' work and interests );

Bored (gossip, cute series, sensitive, funny, thrilling, thunder and other content that fills up the user's fragmentation time ).

For general users, there is no reading priority, and there is a need for all three types of content. The first two types are stress reading, this is because the subconscious must extract the "keyword bar" from the content of the mixed user's "cognitive model" for information architecture. In short, this is a brain process. For boring content, users are usually used to stimulate and replace unnecessary information in their brains. In short, this is an empty brain process. The main body of the Daily Mail is composed of the Light content of the Technology Section-"Light brain process", and various "heavy-mouth, high-definition and stimulating" heavy-empty brain processes, this creates a pleasant experience for users, with moderate stress and relaxation. This extreme experience can be analogous to "foot massage"-pain and happiness.

There is no advertisement on the first-level interface, while a large number of advertisements are added on the second-level interface. This is a simple strategy. For most of the information, ask the user to see the long title and big picture of the home page, as well as a huge amount of related information (the interface is designed to squeeze in overloaded and fast update information within the unit area ), the process of using the brain and putting the brain into use has been met. If the user is attracted by the image content, he can go to the secondary page to browse a large number of HD images (usually 5-10 images). Due to the visual attraction of the images, the user does not care much about the advertisement interference.

The special "femail" female content module "is said to have made great contributions to content contribution and user attraction. I did not see the direct data of the Daily Mail, so I could not determine the traffic of this content module. However, logically, the overall content of the Daily Mail is at least oriented to "female" and "new needs" until now, therefore, users of each content module can browse the content to a certain extent. The femail module has the lowest taste, mainly based on the direct needs of female users, such as makeup, shopping, diet, and maternal and child. I don't think this is the main source of website clicks, but this module can directly reverse traffic for its partners. It is understandable to make vigorous promotions.

 

Pink-themed femail Module

User reading psychology

User psychology is always inseparable from website design and content. Here are just a few interesting points.

Depth of article content

Taking the New York Times as an example, the media field has always been a start. The depth of professional content and social ethics are definitely top standards in the industry, and its website and mobile design are the top standards in the industry, it is also to carry out the quality to the end, even the gap between the font and content arrangement is extremely elegant, its "temperament" and "quality" do not need to be repeated. Domestic media, such as Chinese entrepreneurs, are equally well-known in the industry. The content depth is even better than that of the first financial weekly, but the sales volume cannot be compared. An even more extreme example: Can you say that the content of male clothes is very deep? Similarly, the traffic of The New York Times has been relentlessly surpassed by the Daily Mail.

That is to say, readers are under pressure to read high-quality content. Professional readers only account for a small portion of the population. A large number of readers need services that can quickly obtain fresh information. "fresh pleasure" and "objective presentation" are the key words. As the second largest newspaper in the UK, the Daily Mail is preparing a new online content team in several cities around the world to allow it to quickly provide users with first-hand information. Although there are a lot of news and content in the Daily Mail, it is always a bottom line to use pictures to speak and maintain a basic objective stance (editors are not obviously left-to-right. Editors do not pretend to be profound in order to reduce the reading pressure on the content.

 

The New York Times Chrome applications are well-designed with high content quality

About user comments

The New York Times does not allow comments on the network end. It can only be used for social sharing. The implication is that my views do not need to be evaluated by you. There are a variety of comment areas in the Daily Mail article, allowing users to perform "TOP" and "kick" operations. The implication is: you are welcome to speak out, maybe the content is more interesting than our text. The sharing function is not described in detail. This is the standard for online media. However, you can log on to the official Facebook account of the Daily Mail, its activity is still scary-the original "sputation" is the brain-building activity that the people really like and participate in.

 

In the comments area of the Daily Mail, I often see the climax

For a similar example, we can refer to "Douban ". Friends who often play Douban have such experience. For a fun post, the main post is definitely just a fuse and a slot object, and the really fun stuff must be hidden in the comments below. UGC is not only a contribution to the focus issue, but also a source of scattered reply information, and this will be a trend. Self-growing content is operated through effective algorithms and appropriate actions, it may bring unexpected user groups to the website.

 

Douban's Hot post replies are close to 20 thousand, and they are still refreshing

The title must be long.

Let's look back at portals such as Sina and Sohu. Due to fragmented partitioning, many content requirements must be reduced to 8-10 characters, so that we often cannot match the title and content, how can I click it to continue browsing? The Daily Mail requires only one title: long, must be long, and key information can be captured when users do not browse specific content. Such information is effective.

In fact, this is also due to the different syntax composition and reading habits of Chinese and English. Chinese is highly generalization and metaphor, And we are used to making things around. English is simple and rude. You must hit the Burst Point directly. The title may use several adjectives for the same thing. Let's recall the speech of Qiao bangzhu-unparalleled, superb, incredible, and unprecedented words used repeatedly.

 

Title + subtitle + image, the information is already in place. To see more bikini charts, please go to the secondary page

Search Engine Optimization

This factor is generally ignored by non-technical personnel. As a designer, I am not a professional in this field. I can just give it a try. But in fact, from the perspective of website operations and data, SEO is definitely a core point worth attention. Although Google constantly adjusts its algorithms, many SEO methods have not been applied in the past, but some key methods are still important in general.

Or long title.

Long titles contain the most information and keywords. I will not explain why they are good for SEO. We only need to know that such long titles, based on the design principles, are very cheap from content to SEO.

Still clear without code big picture

If we need to find a point of view, we can go to the New York Times, and want to joke with Obama, we can go to Google +, we have a lot of options, and we have almost no stickiness to the entrance. Just as we don't care where we are going to charge our cell phones, but where the discount is more attractive, there is no portal advantage in this regard.

But if we want to see the big picture of gossip, the Daily Mail is almost our only and best choice. This is what we just need. According to the data they disclose, 60% of the traffic is not even from platforms such as Google and Facebook, but directly accessed by users. This is quite amazing, that is to say, the Daily Mail is the same as Facebook. Because it is mainly for independent access, it is almost impossible to sell Google's face, and the user's viscosity is very high. Similarly, when we search for images using key keywords on Google, a large amount of results are directed to the Daily Mail, which also brings a wealth of traffic to the website.

Webpage Design

Finally, we can say that the design, in my opinion, not only does the Daily Mail not violate the design principles, but it also conforms to many recent design trends.

No primary or secondary Webpage Design

In traditional web design, we often mention the concept of "F", that is, the title bar, the left navigation bar, and the display location of the first screen need to be specially designed, or even accurate to pixels. For the Daily Mail, the primary and secondary content of such web pages is vague, because the entire page is a refreshing ultra-long information stream. You can scroll down to about 30 screens. This new waterfall-based layout is actually guiding users to switch their reading habits from the "title-content page" mode to the "Parallel information block" mode. Each information module exists independently. You do not have to enter the secondary page to view details.

 

A typical "Parallel information module" Design

This information design style is most typical of Microsoft's Metro UI design. Although not yet mature at the operating system level, the advantages in content presentation are already obvious. However, a real-time update function can be added at the system level, which is not widely used on websites.

Another noteworthy trend, called parallax scrolling (parallax rolling), is a new information presentation method using html5 technology, I believe it will also be frequently used in more and more strong content network media.

 

The Spotify homepage, which uses parallax scrolling, provides users with a rich sensory experience.

Using primary and secondary content arrangement, users are guided to form a webpage location dependency and highly exchanged content between primary and secondary pages.

This is more difficult to understand. We carefully observe the design of the main interface of the Daily Mail. Each subject consists of A (subject content), B (Auxiliary content), and C (related content, the ratio on the homepage is--7.

 

Content Distribution on the Daily Mail Homepage

This proportion is exaggerated on secondary pages. In addition to a large number of secondary HD images, a single page also contains links to over 200 class C-related content, ensuring that users can, as long as you are distracted, you can return to a level-1 page of a content through the link on the right to form a circular reading situation for the user in "level-1 page-level-1 page. I think this is a very core content guiding mode and design innovation in the Daily Mail. Although the webpage aesthetic, especially the secondary interface, is messy, it is very effective. Web designers need to consider not only aesthetic, but also the availability of pages.

At this point, you have to mention the navigation. In my opinion, of product iterations and the conversion rate of user requirements are extremely high in the industry. Especially in the navigation product, we achieved the second advantage in the market in just a short time, and gradually replaced more static text links with "custom text sidebar ".

Of course, there will also be an algorithm problem here. For example, users often browse some exciting videos. If you place such titles and big charts on the user's homepage in navigation, it may make users feel embarrassed and angry, how to expose content appropriately also requires careful consideration.

 

Although it is still inevitable to stimulate text and image information, the personalized guidance of navigation has been well done

All for easy clicks

Take only a few pieces of data to explain: the average size of the image in the Daily Mail exceeds 636pix, the title length is greater than 20 characters, and the "little story" next to the content of a subject exceeds 260 characters, all images are free of charge.

All of this ensures that when a reader arrives at the website, the reader will go back to the home page without stopping the website and discover more interesting content. The average stay time of website users exceeds 10 minutes.

Design team behind

The design team of the Daily Mail is Brand42 from London. Their customers are major global brands and traditional media that need to be transformed. The overall design of the Daily Mail web page won the Best Design Award in 2012.

 

Brand42 customers

I can say a lot about this company:

1. They also follow the standard design procedures of general design companies. They provide design and consulting services for current websites, mobile terminals, and brands, similar to domestic Brand Design Companies transformed from graphic design.

 

Visual Design and the overall tone Design of different content blocks are also a feature they designed for the Daily Mail.

It's just their name-42. In Douglas Adams's Galaxy roaming guide, supercomputer's answer to the ultimate question about life, the universe, and everything is exactly the number "42 ". With such a vision and pursuit, it is no wonder that they can make such a unique design.

 

According to a very playful Company, the entire environment is retro + easy + nonsense

2. The importance of quantitative research in design. As a design researcher, I often have a headache in explaining design value to clients and other professional colleagues. Because many aspects of design rely heavily on intuition, sensibility, and long-term work experience, it is impossible to use mathematical models for quantitative analysis. However, webpage design is slightly different. Because we can obtain a large amount of information from users, we can analyze user behavior from the data perspective through technologies such as eye tracking and webpage hot zone capturing. Fortunately, I communicated with many design studios during my study tour in London. Although I didn't talk about quantitative analysis directly with Brand42 designers, I also learned some integration methods of technology and interaction. It is hard to imagine that Brand42 has done a lot of eye movement experiments and AB test in the design process of the Daily Mail. Although the final presentation form is "messy", the layout is also accurate to pixels.

Chinese counterparts may sneer at my saying: "Which internet company does not pay attention to data ?". Indeed, the logic of the Daily Mail is "design-Driven Data", that is, first determining the user logic. What content and design are fascinating, then code and data are used for iteration and improvement. Here, design innovation, content and reasonable presentation are always the core. A large number of websites in China are first throwing a prototype, buying traffic to run user data, then relying on data for webpage adjustment, and placing advertising spaces according to operation. The final result is: the website has no design, no aesthetics, and a large amount of convergence (How much is the difference between the data you bought and the data you bought from other families ?)

Summary

People tend to have a mindset inertia: Modeling successful people. Therefore, after Facebook's success, there were a lot of articles and books designed by Zuckerberg and Facebook. It is even worse for the old man-in-law.

In fact, the success of Internet products depends heavily on specific opportunities in specific time and space. Just like today's Daily Mail, I don't think it is worth the effort of web designers and Internet analysts to go to the book, I will write it here. You just need to repost or batch it. Under the attack of AOL, Google, Twitter, Tumblr, and Facebook, I don't think its traffic will continue to rise, the restrictions on its content and the singleton of profit methods are all detrimental to its subsequent development. On the other hand, Facebook and other social platforms have only a very small operating content. They have a huge space for social relations, UGC, and third-party applications, this is beyond the incomparable "Media attributes" of the Daily Mail.

What I expect more is that after Google Reader is closed, page will further streamline and integrate Google's product line; Facebook will continue to adjust its interaction details and the variations in the social attributes of users' time series; as the pulse of the times, Twitter has emerged as a new profit model for better content algorithms and big data operations.

Unless otherwise stated, geek observation is an original report of geek Park. For more information, see the original article.

Address: http://www.geekpark.net/read/view/175379