12 fonctionnalités majeures de HTML5 adaptées au développement d'applications mobiles_compétences du didacticiel HTML5

L'émergence du développement mobile HTML5 a déplacé la concurrence sur les plates-formes mobiles des plates-formes système vers les navigateurs : IE, Chrome, FireFox, Safari du côté mobile, ou les navigateurs émergents, qui peuvent parvenir à une meilleure compréhension du HTML5 du côté mobile ? il pourra occuper davantage de marchés dans le futur domaine des applications mobiles.

Des méthodes d'utilisation et d'installation plus flexibles et plus pratiques deviendront l'une des garanties pour HT]L5 de briller sur la plate-forme mobile.

Voici les principales fonctionnalités de HTML5 adaptées au développement d'applications mobiles :

1. La mise en cache hors ligne constitue la base du développement HTML5 d'applications mobiles
HTML5 Web L'API de stockage peut être considérée comme une version améliorée des cookies. Elle n'est pas limitée par la taille des données et offre une meilleure flexibilité et architecture. Elle peut écrire des données dans la ROM locale et restaurer les données lorsque le navigateur est fermé et rouvert. . pour réduire le trafic réseau.
En même temps, cette fonction peut être considérée comme un « enregistrement d'opération » en arrière-plan dans une autre direction sans occuper aucune ressource en arrière-plan, réduisant ainsi la pression sur le matériel de l'appareil et augmentant la fluidité du fonctionnement.
Les applications en ligne prennent en charge le téléchargement du cache hors ligne lors de son utilisation, ou ne téléchargent pas le cache hors ligne, tandis que les applications hors ligne doivent télécharger le cache hors ligne avant de pouvoir être utilisées ;
Pour le dire au sens figuré, les cookies stockent les numéros de téléphone et les menus. Si vous voulez manger quelque chose, vous devez commander des plats à emporter. Le temps que vous devez attendre pour l'obtenir dépend des conditions de circulation. La mise en cache hors ligne signifie stocker directement la nourriture. le réfrigérateur, et vous pouvez le manger si vous le souhaitez. Vous pouvez le manger immédiatement (bien sûr, si vous souhaitez manger les derniers plats, vous pouvez également appeler pour faire une réservation).
Les concepteurs doivent savoir quand autoriser les utilisateurs à télécharger le cache hors ligne (notez la différence entre les applications en ligne et hors ligne).


2. L'audio et la vidéo sont librement intégrés et les formes multimédias sont plus flexibles
La méthode de développement native est relativement gênante pour le traitement de contenu multimédia où le texte, l'audio et la vidéo sont mélangés et doivent être séparés. Le texte, les images, l'audio et la vidéo analysent les URL correspondantes et les traitent de différentes manières.
HTML5 n'a aucune restriction à cet égard et peut être entièrement configuré pour le traitement.
Les concepteurs doivent savoir que ce serait une chose merveilleuse si le texte et le multimédia pouvaient être mélangés dans la présentation des informations des actualités, de Weibo et des applications sociales sans avoir à intégrer spécifiquement une vue Web. Au moins, cela peut désormais être implémenté de manière native. . J'ai toujours du mal à me lever.


3. Géolocalisation, partagez votre position à tout moment et n'importe où
Faites jouer pleinement les avantages des appareils mobiles en matière de positionnement et favorisez le développement d'applications LBS.
Le GPS, le wifi, les téléphones mobiles et d'autres méthodes peuvent être utilisés de manière globale pour rendre le positionnement plus précis et plus flexible.
Le positionnement géographique rend le positionnement et la navigation non exclusifs aux logiciels de navigation, et les cartes n'ont pas besoin de télécharger de très gros packages de cartes. Cela peut être résolu via la mise en cache, ce qui rend le téléchargement plus flexible où vous le souhaitez.
Les concepteurs doivent savoir qu'il existe de plus en plus d'applications intégrant des fonctions LBS. C'est également l'un des plus grands avantages des appareils mobiles par rapport aux ordinateurs de bureau. HTML5 peut encore étendre cet avantage. . Utilisez-le dans votre application !


4. Dessin sur toile, améliorez les capacités de dessin des plates-formes mobiles
Utilisez l'API Canvas pour dessiner facilement des cartes thermiques et collecter des données sur l'expérience utilisateur.
Prend en charge l'édition générale telle que le déplacement, la rotation, la mise à l'échelle, etc. des images
Canvas – prend en charge les fonctions de dessin 2D
Canvas 3D – prend en charge les fonctions de dessin 3D
SVG – prend en charge les graphiques vectoriels
Les concepteurs doivent savez-vous que les images Déplacer, faire pivoter et mettre à l'échelle ? C'est juste un petit cas à dessiner par vous-même, pensez-y !


5. pour les plateformes mobiles
Les éléments du formulaire html5 et les claviers correspondants qui apparaissent dans le navigateur :
Clavier à fonction de saisie
Texte normal, contenu de saisie, clavier standard
Numéro de téléphone, clavier numérique
Email Adresse e-mail Zone de texte avec @ et .clavier
url URL de la page web Clavier avec .com et .
La recherche est utilisée pour les moteurs de recherche, comme le champ de recherche affiché en haut du site Clavier standard <.>plage Plage de valeurs spécifique La méthode d'affichage typique du sélecteur de valeur dans le clavier est un curseur, un curseur ou une platine tournante
Seule une simple instruction est nécessaire pour terminer l'appel de différents styles de claviers, ce qui est simple et pratique.
Les concepteurs doivent le savoir, n'oubliez pas d'en informer vos collègues R&D lorsqu'ils l'utilisent !


6. Prise en charge d'interactions riches

Améliorez les capacités d'interaction : glisser-déposer, annuler les opérations historiques. , sélection de texte, etc. Transition - l'effet de mouvement du composant
Transformation - l'effet de déformation du composant
Animation - ajouter du mouvement et de la déformation au support d'animation
Les concepteurs doivent savoir que les méthodes d'interaction fournis par HTML5 sont très riches, que vous l'utilisiez ou non, c'est votre propre affaire !


7 Avantages de l'utilisation de HTML5

Développement et maintenance réduits. Coût ; Rend la page plus petite, réduisant ainsi les dépenses inutiles pour les utilisateurs ; De plus, de meilleures performances réduisent la consommation d'énergie
Pratique pour la mise à niveau, vous pouvez utiliser la dernière version immédiatement après l'avoir ouverte, éliminant ainsi le besoin de retélécharger la version ; mise à niveau Le problème avec ce package est que le cache hors ligne est mis à jour directement pendant l'utilisation.
Les concepteurs doivent savoir ce que veulent les utilisateurs et ce que HTML5 peut leur apporter.


8.Outil auxiliaire du concepteur visuel CSS3

CSS3支援了字體的嵌入、版面的排版，以及最令人印象深刻的動畫功能。
Selector – 更有彈性的選擇器
Webfonts – 嵌入式字體
Layout – 多樣化的排版選擇
Stlying radius gradient shadow – 圓角、漸變、陰影
Border background – 邊框的背景支援
使用CSS3來完成部分視覺工作，載入速度快，節省程式碼及圖片，也為使用者節約了頻寬。
設計師要知道，一個介面裡幾十張素材圖的方式已經太out啦，趕快讓CSS3幫你偷懶。
 
9.即時通訊
 
以往網站由於HTTP協定以及瀏覽器的設計，即時的互動性相當的受限，只能使用一些技巧來「模擬」即時的通訊效果，但HTML5提供了完善的即時通訊支援。
設計師要知道，應用程式中嵌入即時通訊、資訊內容進行即時提醒，HTML5可以幫你實現。
 
10.檔案以及硬體支援
 
不知道大家有沒有發現，在Gmail等新的網頁程式當中，已經可以透過拖曳的方式將檔案作為郵件附件?這是HTML5檔案的功能中的Drag'n Drop和File API。
設計師要知道，行動應用程式中對於資料傳輸的需求越來越大，傳統的路徑選擇方式太過於繁瑣，快來試試HTML5的拖曳上傳功能吧!
 
11.語意化
 
語意化的網路是可以讓電腦更理解網頁的內容，對於像是搜尋引擎的最佳化(SEO)或是推薦系統可以有很大的幫助。
設計師要知道，HTML5能讓搜尋更快速、更精準。
 
12.雙平台融合的app開發方式，提高工作效率
 
依照目前iPhone/Android 快速提升市佔率的情勢來看，未來若想要在先進的智慧型手機上撰寫應用程序，要不是選擇使用Objective-C CocoaTouch Framework 撰寫iPhone/iPad 應用程序，就是選擇Java Android Framework 撰寫Android 應用程序，如果想要同時支援兩種平台，勢必要維護兩套代碼，對於剛起步的小服務而言也算是個小有負擔的維運成本。
 
使用HTML5, CSS3 來撰寫Web-based 的應用程序，若要同時支援iPhone 及Android，幾乎只需要維護一份代碼(少部要應對clients 作修改)，而且未來若有其它行動裝置擁有支援HTML5 的瀏覽器，那同樣的WebApp 直接就多了一個支援平台。
 
Google 的系列服務使用了不少HTML5 中的cache、storage 及database 規格來做到離線存取程式的效果。因為比起桌面應用程序，行動裝置的網路連線更不穩定，而且有時在移動中並無網路可以使用，透過這些技術才能讓使用者即使在無網路環境下繼續使用你的webapp 。這說明html5主要服務對象還是給予web的應用，不會對全部app開發造成威脅，這樣有利於不同類型應用使用不同的開發方式，彈性更強。