That friend who keeps talking to you about “H5 marketing”, you don’t need to see him anymore!

I have been working in the marketing field for many years and have seen my friends’ circle flourishing every day. I have discovered that most marketing practitioners still have a very superficial understanding of HTML5 and are inevitably deceived. So I wrote down some of my thoughts, hoping it would be of some help:

▼ What exactly is this “H5 marketing” they are talking about?

If you ask your friend who talks a lot about "H5 marketing" to you, he will definitely not be able to explain it clearly.

In fact, I searched Wikipedia, Google, Quora and foreign marketing professional websites, but I didn't find this word at all. So what is the H5 marketing that has been hyped up in China? Let us try to restore the truth.

Something like this:

Tencent Video V Vision Conference Invitation Letter

What they call "H5 marketing" is actually mobile web page production. Or to put it more vividly, it is the production of mobile marketing web pages with certain interactive effects. What do these companies that are “best at H5 marketing” do? You tell them your general idea, and then they can quickly make it for you using templates or customized or semi-custom methods. Of course, the quality varies. Whether the effect is good or bad still has to be borne by the demander.

"H5 marketing" is really too popular, just like the era when everyone was building websites. It also brought popularity to front-end engineers who had been kept at the bottom of the box for many years.

I have seen some technical experts in the industry come out to explain the concept of HTML5 to everyone: the full name is HyperText Markup Language (HTML), the fifth major revision of Hypertext Markup Language. Ask everyone to stop calling it H5, because the term H5 is not used abroad either. It should be called HTML5. It may look very professional, but from a digital marketing perspective, it is actually inaccurate.

The vague general term "H5" currently used in the marketing world has long gone beyond the scope of the HTML5 standard. In technical terms, it is actually a combination of HTML5 + CSS3 + JavaScript, specifically a mobile marketing web page that includes certain special effects.

In my personal opinion, I don't object to everyone calling this type of mobile marketing web page H5. After all, using HTML5 to summarize it doesn't seem more appropriate, and it's not as simple and convenient as H5.

But truly professional marketing practitioners should avoid the term "H5 marketing" (except for charlatans). If you think about it carefully, is the so-called "H5 marketing" just about making a few pages in a cool way?

We see that everyone is competing in creativity, copywriting, graphic and interactive design, and technical implementation, but the actual work of marketing involving user insights, target setting, promotion strategies , landing page optimization, and effect evaluation is often overlooked. The more “H5” is done, the more we forget that marketing must start with consumers.

Consumers’ expectations for brand marketing activities: The brand must provide me with useful, necessary, and interesting information and interactive participation. The ultimate brand should be able to create a unique participation experience.

So how do consumers participate? Is it enough to just have a few pages of cool brand display? Of course not. How to create brand value among consumers? In addition to H5 production, other tasks are also necessary.

You see, the so-called "H5 marketing" is just a subset of mobile marketing, or in other words, HTML5 is the best content carrier for mobile marketing.

Furthermore, HTML5+CSS3+JavaScript can realize almost all web animation functions. They have their own division of labor: HTML5 is responsible for marking the elements in the web page (titles, paragraphs, tables, etc.), CSS3 is responsible for the style and layout of the web page, and JavaScript is responsible for increasing the interactivity of HTML5 web pages. Theoretically, this golden duo can realize all Web-based dynamic effects and make a cartoon or a movie, provided that your script and production level are good enough!

Even in terms of cool production and creativity, foreign countries are actually several light years ahead of the domestic first-line production teams.

Here are a few cases I found, let’s take a look:

Click on the image to open all cases. Since the server is overseas, the opening speed will be slower, but it is definitely worth waiting patiently

Winter's on its way

A World of Belonging on Airbnb

IN PIECES

Here are a few questions worth thinking about:

▼ Why do you want to do HTML5?

"It's the holiday season, the hotspot has come, everyone is browsing..."

“Because my boss asked me to do it.”

“These days, if you don’t make a few H5s and send a few GIFs, you’d be embarrassed to say you’re doing digital marketing.”

"It's not good if the budget is spent too much and has no effect, but it's also not good if the money is not spent at all. The marketing department needs something to do, so why not make a few H5s? After all, everyone can see them after they are made."

…

Just because of this? Of course not.

Because on the mobile side, mainstream browsers and webview-supported apps (especially WeChat) provide the best support for HTML5, and there is no better way to carry creative content on the mobile side. After two years of development from 2014 to 2015 and the involvement of a large amount of capital, the templates and tool platforms provided by YiQixiu, MAKA, TuZhan, Interactive Master, etc. have helped reduce the initial custom development costs from hundreds of thousands to single digits. If there are no complex customization requirements, zero-code development can basically be achieved.

Looking at other content carrier forms: traditional video TVC has the disadvantages of long production cycle, inconvenient modification, and lack of interactivity; while more cutting-edge interactive video, virtual reality and augmented reality VR/AR technology are not yet popular, have high costs, long production cycles, and there are not many best practices in the industry. At present, an H5 can be completed in an average of 3-5 days. Even if customization is required, it can usually be completed in about 1-2 weeks.

It can be predicted that H5 (HTML5+CSS3+JavaScript) will continue to occupy a mainstream position in the mobile marketing battlefield for a long time to come.

▼ What is the current spread of HTML5?

1. Pioneering interactive form and technical implementation

For example, the invitation letter of MAKA in 2014, Tesla from Yunlai, and Egret Engine's surrounding nervous cats,

W’s several Dianping cases and various interaction cases with Kris Wu this year.

The driving forces behind many of the cool h5 cases we have seen are mostly from these teams with top production levels in the industry. The logic behind it is simple: This is my ability, so of course I want to let everyone see it. In other words, this is also a marketing process for the HTML5 production team, except that what is being marketed is the HTML5 creativity or interactive technology itself.

The public is happy to spread new things like this. The early teams that actively innovated and created such cases really enjoyed a lot of communication dividends. Friends in the marketing industry are also keen to spread and learn from such cases. Their general reaction to these cases is: "So H5 can be done this way! It can also be done this way?!"

These teams have made great contributions to the acceptance of HTML5 as a mobile content presentation format by a large number of enterprises and ordinary consumers. But the other side of the coin also misleads junior marketing practitioners, making it easy for them to get caught up in the interactive technology presentation itself and ignore the essence of communicating with consumers.

.Participants: Creative and technical companies in the HTML5 industry

.Features: Generally have more innovative visual and interactive forms.

2. Creative-driven production + large-scale forwarding

Many cases of bandwagoning come from this category, where people become unfortunate victims without even realizing it. These cases generally come from competition among peers and "creative reference and borrowing", as well as self-satisfaction in the advertising circle.

Today, will you make a stranger call to connect to Kris Wu? Okay, tomorrow I will make one and say goodnight to Fan Bingbing.

Why does this phenomenon occur? We know that large brands spend a large amount of budget every year on brand maintenance, generating various creative content and activities to communicate and interact with consumers. Therefore, they will have "long-term cooperation" with a large number of creative agencies and individuals, and will have various interactive KPI requirements.

This should have been a very meaningful thing, but due to the lack of outstanding creative talents, the uneven quality of talents, the different judging criteria, and the unreasonable KPI orientation, it has become a competition of following trends and competing for creativity.

Of course, since a large number of homogeneous creative ideas will not lead to active dissemination effects, it doesn’t matter. You can still “buy big sizes” and “advertise” since you have a budget anyway.

This type of H5 work often relies on creative teams for promotion and dissemination, and often tends to deviate from the essence of business. It focuses on the creativity itself and leaves consumers behind. For businesses, it results in a waste of marketing resources, and for consumers, they are forced to accept a large amount of information interference.

. Participants: Traditional large brands and advertising agencies

.Features: chasing hot spots, large-scale production and investment, and creativity-driven

3. Very few can resonate with the target users and form self-propagation

For example:

This is an H5-based Campaign created by "51 talk" on Children's Day this year. Let's take a look:

Children's Day

This low-budget production is not cool and the design is not exquisite enough. But it quickly occupied the circle of friends on this year's Children's Day, triggering collective memories of the post-80s generation and forming a good reputation and resonance.

Let’s first look at 51 Talk’s main business: 51Talk is an online English training brand, and its main business is online one-on-one training services taught by real foreign teachers. Therefore, the creativity of this H5 is well combined with English learning.

Let’s look at the target audience selection:

Born in the 80s. They include white-collar workers who have just entered the workplace for 2-3 years, as well as elites who have worked for 7-10 years and are in the rising stage of their careers. This age group has a large overlap with 51Talk's potential users. Therefore, the creative point of this H5 is to trigger the nostalgic memories of the post-80s generation: starting from the junior high school English textbook, it not only mobilizes memories of the past, but also interacts in a new form, which is ready to explode on the special occasion of Children's Day.

Tim, head of Social Marketing at 51talk, described the entire production process:

"We were three people in total, and we worked on the creative process on and off for more than a week. Then we bought the book, flipped through it twice, cut it up, and prepared the brief. We did the creative part ourselves, and the production cost about 30,000 yuan, and we spent 60,000 to 70,000 yuan on the large size."

Let’s calculate the cost of this online marketing campaign:

Creativity: 20,000 yuan (estimated based on the labor cost of 3 people per week)

Produced by: 3W

Medium: 6-7W

The cost of this marketing campaign based on mobile social platform (forgive me for not being able to say it is H5 marketing) is 120,000 yuan.

Finally, take a look at the overall effect:

The original goal of this online campaign was 500,000 PVs. The page views in the week before and after Children's Day were 3.5 million, the PV up to now is 5.5 million, the unique visit UV is 2.9 million, and the registration volume is 6,000.

This is just the direct effect in numbers; the impact on enhancing brand value has not yet been taken into account or estimated.

This type of case generally pursues practical results. Simply put, if you have a clearer idea of ​​the goal and do enough homework, you will naturally be able to accomplish great things with little money. Of course, solid basic skills such as understanding target users, industry and one's own business are indispensable.

. Participants: Most are medium-sized enterprises and Internet companies that pursue practical results.

. Features: Starting from the user, low cost and reasonable investment, marketing personnel understand the industry, closely integrate with products and services, and do it themselves.

Yes, understanding of the industry and business, insight into users, formulation of marketing strategies, creativity and production, event planning and communication strategies. Every link is indispensable. H5 production is really just one part of the process. Do you still call this kind of marketing campaign based on mobile social platforms "H5 marketing"?

▼ What is the use of HTML5 in enterprises?

HTML5 is indeed the natural carrier of mobile content.

I recently had a chat with Chen Pengfei, the founder of Yunlai, and I strongly agreed with a point of view: the popularization of HTML5 must go through three stages: easy to use, useful, and commonly used. At present, we are only at the stage of generally realizing that it can be used, but in many cases we are relatively blind and have not used it well enough.

So in what situations do you need to use HTML5?

Mobile scenarios: website building, invitation letters/event registration, daily content, press conferences, recruitment , forums and summits, product introductions... It can be said that everything based on mobile social business scenarios! Whatever web sites can do in the PC era, HTML5 can also do on mobile devices. Building a website is just the first step. The key is how to better integrate with user scenarios in your business processes and user contact points.

Now that the main storyline of the content has been designed, how to design the communication and interaction with users? How to collect data, how to make good use of this data, improve products and services from the perspective of user experience, and how to form transactions?

These can all be based on HTML5, but are not limited to HTML5. There is still a lot that can be done. There is currently too much hype in the industry about HTML5 technology itself, but when looking at the entire mobile social marketing industry, what can be done based on HTML5 is just getting started.

Some people in the industry liken it to “the last mile of creative content marketing”, but I would rather call it “the best coat for content marketing in the mobile era.”

▼ HTML5 will continue to shine in the mobile era

Nowadays, everyone has at least one smartphone, and mobile traffic has surpassed PC traffic. In a broad sense, H5 represents the sum of the new generation of HTML5, CSS3 and JavaScript technologies.

As for the advantages of HTML5 in the mobile era, there are many analytical articles in the industry comparing it with Flash, so I will not go into details.

To sum up: it is nothing more than cross-platform (adaptable and compatible with a variety of mobile devices with screen sizes and resolutions), responsive design (can be modified in real time), and cross-operating system (not restricted by operating system and browser).

We know that PCs rely on browsers to browse online information, so we have super portals such as Google and Baidu. But when we browse online information on mobile devices, the apps we use in various scenarios are the media. WeChat, Weibo, Tmall , JD.com, news clients. All apps that support Web view can perfectly use HTML5 technology. In principle, the user scenarios of HTML5 technology on mobile devices can be infinite. Any app we use now can potentially be developed using HTML5.

The presentation of HTML5 does not necessarily rely on the browser. When creating content with HTML5, in addition to the great environment that is supported by current mainstream browsers, it can also be browsed in a non-browser form, breaking through the limitations of the browser.

After two years of hype and popularity, HTML5 will continue to shine in the digital marketing or mobile marketing world, in the mobile Internet era where there is no super traffic entrance and behaviors are triggered by scenario demands.

When writing this article, I also partially referred to the answer of Ma Jian, the technical partner of Egret Engine on Zhihu, which gave a very detailed account of the technical development of Flash and HTML5. The original post is here, and I recommend everyone to read it:

Is the future the era of HTML5 or Flash?

I have said so much, just to tell you:

1. In fact, there is no such thing as "H5 marketing" in the world. What the marketing industry now calls H5 refers to the collection of HTML5, CSS3 and JavaScript, or more precisely, mobile marketing web pages that include certain dynamic effects. The so-called "H5 marketing" is just a subset of mobile marketing.

2. To run a successful mobile marketing campaign, every link is essential, including understanding of the industry and business, insight into users, formulation of marketing strategies, creative content and production, event planning and execution, communication strategies and media channels. H5 production is really just one part of the process.

3. HTML5 is indeed the natural carrier of mobile content. At present, its use in the marketing industry is still at a very superficial stage. It is nothing more than cross-platform, responsive design, cross-operating system, and the interactive features of the web page itself. There is still great value to be tapped and explored in the future.