สรุปเมตาฉลาก HTML, HTML5 head meta attribute finishing finishing finishing

Meta เป็นฉลากเสริมในพื้นที่ส่วนหัวของภาษา HTML บางทีคุณอาจคิดว่ารหัสเหล่านี้เป็นทางเลือก ในความเป็นจริงถ้าคุณสามารถสร้างเมตาแท็กที่ดีมันจะนำเอฟเฟกต์ที่ไม่คาดคิดมาให้คุณ ไดนามิกแบบไดนามิกเมื่อการแปลงเว็บเพจ

องค์ประกอบของเมตา: แท็กเมตามีสองแอตทริบิวต์

 <! -> <meta charset = 'utf-8'> <!-ชอบใช้เวอร์ชันล่าสุดของ IE และ Chrome-> <meta http-equiv = x- ua-commission content = ie = edge, chrome = 1/> < ! -Page Description-> <meta name = คำอธิบาย content = ไม่เกิน 150 อักขระ/<!-คีย์เวิร์ดหน้า-> <ชื่อ meta = keywords content =/> <!-web Author-> <meta name = upple content = name , [email protected]/> <!-Search Engine Capture-> <meta name content = index, follow/> <!-เพิ่ม viewport-> <meta name = viewport content = ittial-scale = 1, maximum-scale = 3, ระดับต่ำสุด = 1, scalable ผู้ใช้ = no> <! ----! --------'width = ความกว้างของอุปกรณ์จะทำให้ iPhone 5 เพิ่มลงในหน้าจอหลักและเปิดหน้า ด้วยโหมดเต็มหน้าจอ WebApp name = apple-mobile- เนื้อหาที่สามารถใช้งานได้ของเว็บ-แอป = ใช่/> <!-ไม่ว่าจะเปิดใช้งานโหมดเต็มหน้าจอ WebApp, ลบแถบเครื่องมือเริ่มต้นและแถบเมนูของ Apple-> <meta name = apple-itunes-app conts , affil iate -data = myaffiliateedata, app-ragument = myurl> <!-เพิ่มแบนเนอร์แอพอัจฉริยะ (iOS 6+ Safari)-> <meta name = Apple-Mobile-App-Style-style t = black/> <! -ตั้งค่าสีของแถบเครื่องมือ Apple-> <meta name = เนื้อหาการตรวจจับรูปแบบ = telphone = ไม่, email = no/> <!-ละเว้นการรับรู้ดิจิตอลในหน้าเป็นการโทรออกจากการระบุอีเมล-> <! -เปิดใช้งานโหมดความเร็วของเบราว์เซอร์ 360 (WebKit)-> <meta name = เนื้อหา renderer = webKit> <!-หลีกเลี่ยง IE ใช้โหมดความเข้ากันได้-> <meta http-equiv = x-uaa-compatible content = ie = edge> edge> edge> edge> edge> edge> edge> edge> edge <!-ไม่อนุญาตให้ Baidu transcoding-> <meta http-equiv = cache-control content = no-sizeapp /> <! <!-เบราว์เซอร์สมัยเก่าของ Microsoft-> ​​<meta name = mobileoptimized content = 320> <!-UC บังคับให้ใช้หน้าจอแนวตั้งที่บังคับ-> <meta name = เนื้อหาการเรียงหน้าจอ = ภาพบุคคล> <!-QQ บังคับหน้าจอแนวตั้ง-> < meta name = x5-orientation content = portrait> <!-UC ภาคบังคับเต็มหน้าจอ-> <meta name = เนื้อหาเต็มหน้าจอ = ใช่> <!-qq 强制全屏-> <meta name = x5-fullscreen content = true > <!-UC 应用模式-> <meta name = browsermode content = application> <! > <meta name = msapplication-tap-highlight = no> <! > <!-iPhone และ Itouch ค่าเริ่มต้น 57x57 พิกเซลต้องเป็น-> <link rel = Apple-Touch-Icon-procomposed ขนาด = 114x114 href =/apple-touch-icon-114x114 -pong/png/> <!-Retina Itouch, 114x114 พิกเซลไม่ แต่แนะนำ--> <link rel = apple-touch-icon-precomposed size = 144x144 href =/apple-touch-icon-144x144-precomposposed.png/> <!-Retina iPad， 144x144 像素， 可以没有， 但推荐有但推荐有-> <!-ไอคอน iOS end-> <!-หน้าจอเริ่มต้น iOS เริ่มต้น-> <link rel = Apple-Touch -Startup-Image Size = 768x1004 HREF =/SPLASH-SCREEN- 768x1004.png/> <! หน้าจอแนวตั้ง 1536x20088 (Retina)-> <link Roth = Apple-Touch-Startup-Image ขนาด = 1024x748 href =/default-portrait-1024x748.png/> <! -Startup-Image Size = 2048x1496 HREF =/Splash-Screen-2048x1496.png/> <!-iPad viagra 2048x1496 (Retina)-> <link rel = Apple-Touch- startup-Image Href =/splash-screen-320x480 png/> <!-iphone/ipod touch หน้าจอแนวตั้ง 320x480 (ความละเอียดมาตรฐาน)-> <link rel = apple-touch-startup-image ขนาด = 640x960 -screen -640x960.png/> <! 640x960 (Retina)-> <link r = apple-touch-startup-image ขนาด = 640x1136 href =/splash-screen-640x113 6.png/> <! -iphone 5/iPod touch 5 หน้าจอแนวตั้ง 640x1136 (retina)-> <!-หน้าจอเริ่มต้น iOS end-> <!-อุปกรณ์ iOS end-> <meta name = msapplication-tilecolor content =#000000 /<!-สติกเกอร์แม่เหล็ก 8 windows-> <meta name = msapplication-tileimage เนื้อหา = icon.png /> <!-ไอคอนสติ๊กเกอร์แม่เหล็ก Windows 8-> <link rel = application/rss +xml <!-เพิ่มการสมัครสมาชิก RSS-> <link rel = Icon ทางลัดประเภท = image/ico href =/favicon.ico/> <! -Add Favicon icon-> <!-Sns Social Label เริ่มต้น-> <!-อ้างถึง Weibo api-> <meta property = og: type content = type/> <meta property = OG: เนื้อหา url = url address/> <meta property = og: title content = title/> <meta property = og: image content = image/<meta property = OG: เนื้อหา descripting = คำอธิบาย/<! > </head>

แอตทริบิวต์เมตาที่ใช้กันทั่วไปบางส่วนได้รับด้านบนและความเข้าใจของเมตานั้นได้รับด้านล่าง

Meta เป็นฉลากเสริมในพื้นที่ส่วนหัวของภาษา HTML บางทีคุณอาจคิดว่ารหัสเหล่านี้เป็นทางเลือก ในความเป็นจริงถ้าคุณสามารถสร้างเมตาแท็กที่ดีมันจะนำเอฟเฟกต์ที่ไม่คาดคิดมาให้คุณ ไดนามิกแบบไดนามิกเมื่อการแปลงเว็บเพจ

องค์ประกอบของเมตา: แท็กเมตามีสองแอตทริบิวต์

แอตทริบิวต์ชื่อส่วนใหญ่ใช้เพื่ออธิบายหน้าเว็บ

รูปแบบแอตทริบิวต์ชื่อไวยากรณ์ของฉลากเมตาคือ:

 <meta name = parameter content = ค่าพารามิเตอร์เฉพาะ>

แอตทริบิวต์ชื่อส่วนใหญ่มีพารามิเตอร์ต่อไปนี้:

หมายเหตุ: คำหลักใช้เพื่อบอกคำหลักของเครื่องมือค้นหาสำหรับหน้าเว็บของคุณ

ตัวอย่าง:

 <meta name = keywordScontent = Meta Summary, HTML Meta, Meta Attribute, Meta Jump>

B. คำอธิบาย (คำอธิบายเนื้อหาเว็บไซต์)

หมายเหตุ: คำอธิบายใช้เพื่อบอกเนื้อหาหลักของเว็บไซต์ของคุณสำหรับเครื่องมือค้นหา

ตัวอย่าง:

 <meta name = descriptioncontent = บล็อก haorooms, Meta สรุปของ HTML, Meta เป็นฉลากเสริมในพื้นที่ HTML Language Head -

หมายเหตุ: หุ่นยนต์ใช้เพื่อบอกหน้าหุ่นยนต์ค้นหาเพื่อดัชนีและหน้าใดไม่จำเป็นต้องใช้ดัชนี

พารามิเตอร์เนื้อหาทั้งหมดไม่มีดัชนี noindex ติดตาม, nofollow ค่าเริ่มต้นคือทั้งหมด

ตัวอย่าง:

 <meta name = RobotsContent = None>

พารามิเตอร์เฉพาะมีดังนี้:

พารามิเตอร์ข้อมูลคือทั้งหมด: ไฟล์จะถูกเรียกคืนและลิงก์ในหน้าสามารถสอบถามได้

พารามิเตอร์ข้อมูลคือไม่มี: ไฟล์จะไม่ถูกเรียกคืนและลิงก์ในหน้าไม่สามารถสอบถามได้

พารามิเตอร์ข้อมูลคือดัชนี: ไฟล์จะถูกเรียกคืน;

พารามิเตอร์ข้อมูลจะติดตาม: ลิงก์ในหน้าสามารถสอบถามได้

พารามิเตอร์ข้อมูลคือ NONDEX: ไฟล์จะไม่ถูกเรียกคืน แต่ลิงก์ในหน้าสามารถสอบถามได้

พารามิเตอร์ข้อมูลคือ Nofollow: ไฟล์จะถูกดึงออกมา แต่ลิงก์ในหน้าไม่สามารถสอบถามได้

หมายเหตุ: ผู้เขียนบนหน้าเว็บ

ตัวอย่าง:

 <meta name = utherContent = root, [email protected]>

 <meta name = generatorContent = พารามิเตอร์ข้อมูล/>

พารามิเตอร์ข้อมูลของฉลาก Meta แสดงถึงการผลิตซอฟต์แวร์ที่ใช้ในเว็บไซต์

 <meta name = CopyrightContent = พารามิเตอร์ข้อมูล>

พารามิเตอร์ข้อมูลลิขสิทธิ์ของแท็กเมตาแสดงข้อมูลลิขสิทธิ์ของเว็บไซต์

 <meta name = revisit-aftercontent = 7 วัน>

Revisit-หลังจากเป็นตัวแทนของเว็บไซต์สำหรับการเยี่ยมชมอีกครั้ง

HTTP-Equiv ตามชื่อของมันมีความหมายเทียบเท่ากับส่วนหัวไฟล์ของ HTTP

รูปแบบแอตทริบิวต์ http-equiv ของ meta tag คือ:

 <meta http-equiv = พารามิเตอร์เนื้อหา = ค่าตัวแปรพารามิเตอร์>;

แอตทริบิวต์ HTTP-Equiv ส่วนใหญ่มีพารามิเตอร์ต่อไปนี้:

หมายเหตุ: สามารถใช้เพื่อกำหนดเวลาหมดอายุของหน้าเว็บ เมื่อหน้าเว็บหมดอายุจะต้องมีการถ่ายทอดใหม่บนเซิร์ฟเวอร์

การใช้งาน:

 <meta http-equiv = expirescontent = วันศุกร์, 12jan200118: 18: 18gmt>

หมายเหตุ: ต้องใช้รูปแบบเวลาของ GMT

หมายเหตุ: ห้ามมิให้เยี่ยมชมเนื้อหาหน้าเว็บจากแคชของคอมพิวเตอร์ในท้องถิ่น

การใช้งาน:

 <meta http-equiv = pragmacontent = no-cache>

หมายเหตุ: ด้วยวิธีนี้ผู้เข้าชมจะไม่สามารถเรียกดูได้

หมายเหตุ: รีเฟรชโดยอัตโนมัติและชี้ไปที่หน้าใหม่โดยอัตโนมัติ

การใช้งาน:

 <meta http-equiv = refreshcontent = 2;

หมายเหตุ: 2 ของพวกเขาหมายถึงการรีเฟรชอัตโนมัติไปยังเว็บไซต์ URL หลังจากพักเป็นเวลา 2 วินาที

คำอธิบาย: หากเว็บเพจหมดอายุคุกกี้ของร้านจะถูกลบ

การใช้งาน:

 <meta http-equiv = set-cookiecontent = ค่าคุกกี้ = xxx;

หมายเหตุ: ต้องใช้รูปแบบเวลาของ GMT

หมายเหตุ: หน้าบังคับแสดงในหน้าอิสระในหน้าต่างปัจจุบัน

การใช้งาน:

 <meta http-equiv = window-targetContent = _top>

หมายเหตุ: มันถูกใช้เพื่อป้องกันไม่ให้ผู้อื่นโทรหาหน้าในกรอบ

หมายเหตุ: ตั้งค่าชุดอักขระที่ใช้โดยหน้า

การใช้งาน:

 <meta http-equiv = content-typecontent = text/html;

ข้อมูลเฉพาะมีดังนี้:

เมื่อพารามิเตอร์ข้อมูลของ charset ของฉลาก meta เช่น GB2312 หมายความว่ารหัสที่ใช้โดยเว็บไซต์เป็นภาษาจีนที่ง่ายขึ้น

เมื่อพารามิเตอร์ข้อมูลของฉลากเมตาเช่น BIG5 หมายความว่ารหัสที่ใช้โดยเว็บไซต์เป็นภาษาจีนแบบดั้งเดิม

เมื่อพารามิเตอร์ข้อมูลของฉลาก Meta เช่น ISO-20122-JP หมายความว่าเว็บไซต์ถูกใช้ในภาษาญี่ปุ่น

เมื่อพารามิเตอร์ข้อมูลของแท็กเมตาเป็นเช่น KS_C_5601 หมายความว่าเว็บไซต์ถูกใช้เป็นภาษาเกาหลี

เมื่อพารามิเตอร์ข้อมูลของ charset ของ meta tag คือ ISO-8859-1 หมายความว่าการเข้ารหัสของเว็บไซต์เป็นภาษาอังกฤษ

เมื่อพารามิเตอร์ข้อมูลของแท็กเมตาคือ UTF-8 มันแสดงถึงการเข้ารหัสภาษาของโลก

การใช้งาน:

 <meta http-equiv = content-languagecontent = zh-cn/>

แคชควบคุมระบุกลไกแคชของคำขอและการตอบสนองที่จะติดตาม ตั้งค่าการควบคุมแคชในข้อความคำขอหรือข้อความตอบกลับไม่ได้แก้ไขกระบวนการแคชในระหว่างกระบวนการประมวลผลข้อความอื่น คำแนะนำแคชในระหว่างการร้องขอรวมถึงไม่มีแคชไม่มีร้านค้า, อายุสูงสุด, แม็กซ์-สตลี

ly-if-cached, คำแนะนำในการตอบสนอง ได้แก่ สาธารณะ, ส่วนตัว, ไม่มีแคช, ไม่มีร้านค้า, ไม่เปลี่ยนรูปแบบ, ต้องทำการตรวจสอบการปรับเปลี่ยน, พร็อกซีรีเวชั่น, Max-age ความหมายของคำแนะนำในแต่ละข้อความมีดังนี้

การตอบสนองการบ่งชี้สาธารณะสามารถแคชได้โดยพื้นที่แคชใด ๆ

ส่วนตัวระบุว่าข้อความตอบกลับทั้งหมดหรือบางส่วนของผู้ใช้รายเดียวไม่สามารถแชร์ได้โดยแคช สิ่งนี้ช่วยให้เซิร์ฟเวอร์สามารถอธิบายข้อความตอบกลับเมื่อส่วนของการตอบกลับของผู้ใช้ข้อความตอบกลับนี้ไม่ถูกต้องสำหรับคำขอของผู้ใช้รายอื่น

ไม่มีแคชระบุว่าไม่สามารถแคชคำขอหรือข้อความตอบกลับได้

ไม่มีร้านค้าเพื่อป้องกันข้อมูลสำคัญจากการเผยแพร่โดยไม่ได้ตั้งใจ การส่งข้อความคำขอจะทำให้ข้อความคำขอและการตอบกลับไม่ใช้แคช

Max-Age บ่งชี้ว่าลูกค้าสามารถได้รับการตอบกลับว่าระยะเวลาการอยู่รอดไม่เกินเวลาที่กำหนด (เป็นวินาที)

ขั้นต่ำระยะต่ำระบุว่าลูกค้าสามารถรับเวลาตอบสนองได้น้อยกว่าเวลาปัจจุบันรวมถึงการตอบสนองเวลาที่ระบุ

Max-Stale ระบุว่าลูกค้าสามารถรับข้อความตอบกลับเกินระยะเวลาหมดเวลา หากระบุค่าของข้อความ Max-Stale ลูกค้าสามารถรับข้อความตอบกลับภายในค่าที่ระบุของหมดเวลา

 <meta http-equiv = imagetoolbarcontent = false/>

ระบุว่าแถบเครื่องมือรูปภาพจะปรากฏขึ้นหรือไม่มันจะไม่แสดงเป็นตัวแทนเท็จหรือไม่มันจะแสดงเป็นตัวแทนที่แท้จริง

 <meta http-equiv = content-script-typecontent = text/javascript>

ข้อมูลจำเพาะของเว็บ W3C ระบุประเภทของสคริปต์ในหน้า

ระบุวิธีการเปิดเริ่มต้นสำหรับลิงก์ทั้งหมดในหน้า:

ตัวอย่างเช่น:

 <เป้าหมายฐาน = _self>

ป้ายกำกับทั้งหมดในหน้าระบุจะเปิดหน้านี้!