Commonly used meta tags on Mobile front-end and frequently used meta tags on Mobile front-end

Commonly used meta tags on Mobile front-end and frequently used meta tags on Mobile front-end
Commonly Used Mobile front-end meta tags

Common meta tags of Mobile front-end head

 

Original article: http://caibaojian.com/mobile-meta.html//code from http://caibaojian.com/mobile-meta.html <! DOCTYPE html> <! -- Use HTML5 doctype, case insensitive --> 
<Meta name = "wap-font-scale" content = "no">
<! -- Page description --> <meta name = "description" content = "up to 150 characters"/> <! -- Page Keyword --> <meta name = "keywords" content = ""/> <! -- Webpage author --> <meta name = "author" content = "name, email@gmail.com"/> <! -- Search engine capture --> <meta name = "robots" content = "index, follow"/> <! -- Add viewport --> <meta name = "viewport" content = "initial-scale = 1, maximum-scale = 3, minimum-scale = 1, user-scalable = no "> <! -- 'Width = device-width' causes the Black edge to appear when the iPhone 5 is added to the home screen and the page is opened in full screen WebApp mode. http://bigc.at/ios-webapp-viewport-meta.orz --> <! -- IOS device begin --> <meta name = "apple-mobile-web-app-title" content = "title"> <! -- Title after being added to the home screen (added for iOS 6) --> <meta name = "apple-mobile-web-app-capable" content = "yes"/> <! -- Whether to enable full-screen WebApp mode and delete the default toolbar and menu bar of apple --> <meta name = "apple-itunes-app" content = "app-id = myAppStoreID, affiliate-data = myAffiliateData, app-argument = myURL "> <! -- Add Smart App advertisement bar Smart App Banner (iOS 6 + Safari) --> <meta name = "apple-mobile-web-app-status-bar-style" content = "black"/> <! -- Set the color of the apple toolbar --> <meta name = "format-detection" content = "telphone = no, email = no"/> <! -- Ignore the number recognition on the page as the phone number, and ignore the email recognition --> <! -- Enable the speed mode of the 360 browser (webkit) --> <meta name = "renderer" content = "webkit"> <! -- Avoid IE using compatibility mode --> <meta http-equiv = "X-UA-Compatible" content = "IE = edge"> <! -- Disable Baidu transcoding --> <meta http-equiv = "Cache-Control" content = "no-siteapp"/> <! -- Optimized for handheld devices, mainly for some old browsers that do not recognize viewport, such as BlackBerry --> <meta name = "HandheldFriendly" content = "true"> <! -- Microsoft's old-fashioned browser --> <meta name = "MobileOptimized" content = "320"> <! -- Uc force portrait --> <meta name = "screen-orientation" content = "portrait"> <! -- QQ Forced vertical screen --> <meta name = "x5-orientation" content = "portrait"> <! -- UC force full screen --> <meta name = "full-screen" content = "yes"> <! -- QQ forced full screen --> <meta name = "x5-fullscreen" content = "true"> <! -- UC application mode --> <meta name = "browsermode" content = "application"> <! -- QQ application mode --> <meta name = "x5-page-mode" content = "app"> <! -- Windows phone click "NONE" --> <meta name = "msapplication-tap-highlight" content = "no"> <! -- IOS icon begin --> <link rel = "apple-touch-icon-precomposed" href = "/apple-touch-icon-57x57-precomposed.png"/> <! -- IPhone and iTouch, 57x57 pixels by default, must have --> <link rel = "apple-touch-icon-precomposed" sizes = "114x114" href = "/apple-touch-icon-114x114-precomposed.png"/> <! -- Retina iPhone and Retina iTouch, 114x114 pixels, no, but it is recommended to have --> <link rel = "apple-touch-icon-precomposed" sizes = "144x144" href = "/apple-touch-icon-144x144-precomposed.png"/> <! -- Retina iPad, 144x144 pixels, which can be none, but --> <! -- IOS icon end --> <! -- IOS boot screen begin --> <link rel = "apple-touch-startup-image" sizes = "768x1004" href = "/splash-screen-768x1004.png"/> <! -- IPad portrait screen 768x1004 (standard resolution) --> <link rel = "apple-touch-startup-image" sizes = "1536x2008" href = "/splash-screen-1536x2008.png"/> <! -- IPad portrait screen 1536x2008 (Retina) --> <link rel = "apple-touch-startup-image" sizes = "1024x748" href = "/Default-Portrait-1024x748.png"/> <! -- IPad horizontal screen 1024x748 (standard resolution) --> <link rel = "apple-touch-startup-image" sizes = "2048x1496" href = "/splash-screen-2048x1496.png"/> <! -- IPad landscape screen 2048x1496 (Retina) --> <link rel = "apple-touch-startup-image" href = "/splash-screen-320x480.png"/> <! -- IPhone/iPod Touch portrait screen 320x480 (standard resolution) --> <link rel = "apple-touch-startup-image" sizes = "640x960" href = "/splash-screen-640x960.png"/> <! -- IPhone/iPod Touch portrait screen 640x960 (Retina) --> <link rel = "apple-touch-startup-image" sizes = "640x1136" href = "/splash-screen-640x1136.png"/> <! -- IPhone 5/iPod Touch 5 portrait screen 640x1136 (Retina) --> <! -- IOS startup screen end --> <! -- IOS device end --> <meta name = "msapplication-TileColor" content = "#000"/> <! -- Windows 8 tile color --> <meta name = "msapplication-TileImage" content = "icon.png"/> <! -- Windows 8 tile icon --> <link rel = "alternate" type = "application/rss + xml" title = "RSS" href = "/rss. xml"/> <! -- Add an RSS subscription --> <link rel = "shortcut icon" type = "image/ico" href = "/favicon. ico"/> <! -- Add favicon icon --> <! -- Sns social tag begin --> <! -- Refer to Weibo API --> <meta property = "og: type" content = "type"/> <meta property = "og: url "content =" URL address "/> <meta property =" og: title "content =" title "/> <meta property =" og: image "content =" image "/> <meta property =" og: description "content =" description "/> <! -- Sns social tag end --> <title> title </title>