大上的H5怎么樣快速制作

偉der誠品|2017-22

什么是H5

有個小伙伴在后臺留言說想要知道一些關于H5的知識，剛好又是周末留的言，所以也借這個機會把我所了解與認知的H5整理后分享給大家。

可能有些小伙伴還不知道H5是什么，百度的解釋是：H5（HTML5）就是把廣告做成一個場景，通過二維碼或者轉發鏈接，讓用戶更直觀的體驗互動，場景可以包括：圖片、視頻、音頻、地圖、導航、會議報名、產品鏈接等多個模塊，是一種新的移動媒體廣告模式.。

我對H5的定義其實很簡單，就是在線版的PPT，在我看來，H5的本質就是PPT，只不過展示與播放的方式不同罷了。

以上便是我對H5的定義，僅供參考，有不同意見歡迎補充。（點擊閱讀原文查看以前制作的一個案例）

H5的應用很廣，在很多地方我們都可以看到H5的應用比如婚禮以及活動的邀請函、會議通知、招聘招生廣告、回憶錄、電子相冊以及廣告等方方面面。

你可能在朋友圈已經看過了無數個H5，今天這篇文章就是教你怎么樣去制作一篇屬于你自己的H5。

首先簡述一下我所知道制作H5的兩種方法，一種便是通過在線的一些網站或者是APP來制作，另一種便是通過我們熟悉的PPT來制作好之后通過工具轉換成H5。

那么可以在線制作H5的網站或APP有哪些呢？其實這類工具現在有很多，比較老牌也比較出名的便是MAKA，其它的像秀米、易企秀、人人秀、IH5......等網站都可以制作H5。

接下來便給大家介紹一下如何使用在線網站制作H5。（用MAKA來給大家演示）

開始制作之前，大家一定要知道的是H5的制作其實很簡單，并沒有你想象中的那么難！

百度輸入MAKA之后找到MAKA的官網，如果要制作H5的話網站會要求你注冊一個賬號。按照提示注冊登錄之后就會看到下面的界面，然后點擊模板商城便可以開始制作了。

進入模板商城之后你會看到很多的模板，MAKA優點便是模板數量比較多，種類也比較多，你可以進入相應的分類找到你所需要制作的類型。

剛開始用MAKIA的時候很多模板都是免費的，現在可能知名度比較高了，收費模板多了起來。如果你只是學習與練手的話，選一些免費的就可以了。

選擇好模板之后直接點擊模板便可以預覽模板，預覽后如果覺得是你想要的，直接點擊立即使用就可以進入編輯界面了。（以上次做的一個H5來舉例）

上面的圖片便是簡單的關于操作界面的介紹，當然還有一些細節就沒有介紹，等你自己去發現。

看完介紹后要怎么樣操作呢？進入操作界面后點擊背景你便可以通過上傳自己的照片更換背景，點擊相應的文字你便可以更換文字的內容。更換完文字之后你便可以通過右側的操作框調整文字的屬性，像文字的大小，顏色，位置等。如下圖，圖片同理。

編輯好好文字和圖片后你便可以給圖片或文字添加動作，右側操作框中有很多的動畫預設，你可以直接選擇，特別簡單與方便。同時你還可以調整動畫的延遲和速度，這些需要你去實際操作一下便能夠很好的理解了。

當你將一頁一頁的模板的文字和圖片的內容更換完成后，點擊右上角的音樂便可以添加或更換背景音樂，當然也可以不要背景音樂，這些都是由你決定。

如果音樂庫里面沒有你想要的音樂，你還可以通過上傳音樂來添加背景音樂。

你在編輯時可以隨時點擊右上角的預覽去查看最終效果，通過預覽你可以更好的去調整動畫文字等。

當所有的文字，圖片和音樂都設置完成之后并且預覽無問題后，你便可以點擊保存了，回到我的作品頁面便可以看見你剛剛完成的作品，點擊預覽可以設置名字等。

點擊預覽后你還可以獲得作品的鏈接與二維碼，將鏈接和二維碼保存，以后你就可以通過二維碼或者鏈接向別人展示你的作品了。

想說的話

關于如何在線制作H5就給大家簡單介紹到這里了，補充一句，很多APP也可制作H5，像MAKA本身就有APP。至于使用PPT制作H5我會在以后的文章中去介紹，有需要的話你到時候可以看看。

最后還是想表達一個觀點：互聯網每天都有新的東西產生，我們需要有一顆好奇與求知的心。

千萬不要以為新事物一定就是很復雜，很難，很高大上。

其實現在很多的東西都特別的簡單，只是你把它想得太難了。就像今天所提的H5，我第一次看到的時候就覺得好高大上，但是后來了解怎么樣制作后，發現其實也不過如此。

限制你的并不是工具，而是你的認知！