我还应该在head标签中包含哪些内容,以支持尽可能多的浏览器,HTML5,搜索引擎,社交网站等
<title>My Site</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="description" content="My Site is cool">
<meta name="viewport" content="width=device-width">
<meta property="og:title" content="My Site"/>
<meta property="og:type" content="website"/>
<meta property="og:image" content="assests/icon_big.png"/>
<meta property="og:url" content="http://url.com"/>
<meta property="og:site_name" content="My Site"/>
<meta property="og:description" content="My Site is cool"/>
<link rel="shortcut icon" href="assests/favicon.ico" />
<link rel="apple-touch-icon" href="base_url();?>assests/icon.png"/>
<link rel="icon" href="assests/icon.png"/>
答案 0 :(得分:11)
Taken from Paul Irish的手机HTML5 Boilerplate:
<!-- Mobile viewport optimization h5bp.com/ad -->
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">
<meta name="viewport" content="width=device-width">
<!-- Home screen icon Mathias Bynens mathiasbynens.be/notes/touch-icons -->
<!-- For third generation iPad Retina Display -->
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="img/touch/apple-touch-icon-144x144-precomposed.png" />
<!-- For iPhone 4 with high-resolution Retina display: -->
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="img/touch/apple-touch-icon-114x114-precomposed.png" />
<!-- For first-generation iPad: -->
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="img/touch/apple-touch-icon-72x72-precomposed.png" />
<!-- For non-Retina iPhone, iPod Touch, and Android 2.1+ devices: -->
<link rel="apple-touch-icon-precomposed" href="img/touch/apple-touch-icon-57x57-precomposed.png" />
<!-- For nokia devices: -->
<link rel="shortcut icon" href="img/touch/apple-touch-icon.png" />
<!-- iOS web app, delete if not needed. https://github.com/h5bp/mobile-boilerplate/issues/94 -->
<!-- <meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black"> -->
<!-- The script prevents links from opening in mobile safari. https://gist.github.com/1042026 -->
<!-- <script>(function(a,b,c){if(c in b&&b[c]){var d,e=a.location,f=/^(a|html)$/i;a.addEventListener("click",function(a){d=a.target;while(!f.test(d.nodeName))d=d.parentNode;"href"in d&&(d.href.indexOf("http")||~d.href.indexOf(e.host))&&(a.preventDefault(),e.href=d.href)},!1)}})(document,window.navigator,"standalone")</script> -->
<!-- Mobile IE allows us to activate ClearType technology for smoothing fonts for easy reading -->
<meta http-equiv="cleartype" content="on">
<meta name="geo.placename" content="United States" />
<meta name="geo.position" content="x;x" />
<meta name="geo.region" content="usa" />
<meta name="ICBM" content="x,x" />
答案 1 :(得分:9)
<强> SEO 强>
<meta name='keywords' content='your, tags'>
<meta name='description' content='150 words'>
<meta name='subject' content='your website's subject'>
<meta name='copyright' content='company name'>
<meta name='language' content='ES'>
<meta name='robots' content='index,follow'>
<meta name='abstract' content=''>
<meta name='topic' content=''>
<meta name='summary' content=''>
<meta name='Classification' content='Business'>
<强>作者强>
<meta name='author' content='name, email@hotmail.com'>
<meta name='designer' content=''>
<meta name='reply-to' content='email@hotmail.com'>
<meta name='owner' content=''>
都柏林核心元数据
<meta name="dc.language" CONTENT="UK">
<meta name="dc.source" CONTENT="http://www.your-domain.com/">
<meta name="dc.relation" CONTENT="http://www.second-domain.com/">
<meta name="dc.title" CONTENT="a title">
<meta name="dc.keywords" CONTENT="more keywords">
<meta name="dc.subject" CONTENT="the subject">
<meta name="dc.description" CONTENT="A description of the content">
移动强>
<meta name='HandheldFriendly' content='True'>
<meta name='MobileOptimized' content='480'>
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width, height=device-height, minimal-ui">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="theme-color" content="#000">
<meta name="apple-mobile-web-app-title" content="title">
<link rel="icon" sizes="192x192" href="img/brand/icon_192.png">
<link rel="apple-touch-icon" href="img/brand/icon_192.png">
声明所有权
<meta name='y_key' content='XXXXXXXXXX'> <!-- Yahoo Site Explorer -->
<meta name='verify-v1' content='XXXXXXXXX'> <!-- Google -->
停用缓存
<meta http-equiv='Expires' content='0'>
<meta http-equiv='Pragma' content='no-cache'>
<meta http-equiv='Cache-Control' content='no-cache'>
<强> IE 强>
<meta http-equiv='imagetoolbar' content='no'>
<meta http-equiv="X-UA-Compatible" content="IE=edge>
打开图表
<meta property="og:title" content="My Site"/>
<meta property="og:type" content="website"/>
<meta property="og:image" content="assests/icon_big.png"/>
<meta property="og:url" content="http://url.com"/>
<meta property="og:site_name" content="My Site"/>
<meta property="og:description" content="My Site is cool"/>
Twitter卡
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@flickr" />
<meta name="twitter:title" content="Small Island Developing States Photo Submission" />
<meta name="twitter:description" content="View the album on Flickr." />
<meta name="twitter:image" content="https://farm6.staticflickr.com/5510/14338202952_93595258ff_z.jpg" />
<强>其它强>
<meta charset='UTF-8'>
<meta name='pageKey' content='guest-home'>
<meta itemprop='name' content='jQTouch'>
<meta name='revised' content='Sunday, July 18th, 2010, 5:15 pm'>
<meta name='search_date' content='2010-09-27'>
<meta name='ResourceLoaderDynamicStyles' content=''>
<meta name='medium' content='blog'>
<meta name='syndication-source' content='https://mashable.com/2008/12/24/free-brand-monitoring-tools/'>
<meta name='original-source' content='https://mashable.com/2008/12/24/free-brand-monitoring-tools/'>
<meta name='url' content='http://www.websiteaddrress.com'>
<meta name='identifier-URL' content='http://www.websiteaddress.com'>
<meta name='directory' content='submission'>
<meta name='pagename' content='jQuery Tools, Tutorials and Resources - O'Reilly Media'>
<meta name='category' content=''>
<meta name='coverage' content='Worldwide'>
<meta name='distribution' content='Global'>
<meta name='rating' content='General'>
<meta name='revisit-after' content='7 days'>
<meta name='subtitle' content='This is my subtitle'>
<meta name='target' content='all'>
答案 2 :(得分:-1)
<!DOCTYPE html>
<html lang="en" dir="ltr"><head><meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Title</title>
<meta name="description" content="Description">
<link href="favicon.ico" rel="icon" type="image/x-icon">
<script src="init.js"></script>
</head>
保持简短和甜蜜。如果您需要为开放图表添加社交标签,那就没问题了。