목차
이번에는 흔히 사용되는 <메타> 코드에 대해 정리해보겠습니다. <메타> 코드 사용 시 주의사항은 무엇인가요? " >이번에는 흔히 사용되는 <메타> 코드에 대해 정리해보겠습니다. <메타> 코드 사용 시 주의사항은 무엇인가요?
SEO 최적화" >SEO 최적화
Mobile devices" >Mobile devices
网页相关" >网页相关
웹 프론트엔드 H5 튜토리얼 일반적으로 사용되는 코드 요약

일반적으로 사용되는 코드 요약

Jun 04, 2018 am 11:36 AM
meta 정돈하다 요약

이번에는 흔히 사용되는 <메타> 코드에 대해 정리해보겠습니다. <메타> 코드 사용 시 주의사항은 무엇인가요?

필수 속성

Attributes Value Description
content http-equiv 또는 이름으로 정의된 일부 텍스트 속성 관련 메타 정보

선택적 속성

Attribute Value Description
http-equiv content- 유형 / 만료 / 새로 고침 / set-cookie 은 콘텐츠 속성을 HTTP 헤더에 연결합니다.
name 작성자/설명/키워드/생성기/개정/기타 콘텐츠 속성을 이름에 연결합니다.
content some text 은 콘텐츠 속성 값을 번역하는 데 사용되는 형식을 정의합니다.

SEO 최적화

참조 문서

  • 페이지 키워드, 각 웹 페이지에는 웹 페이지의 콘텐츠를 설명하는 고유한 키워드 세트가 있어야 합니다.
    사람들이 검색할 가능성이 있는 설명적이고 대표적인 키워드와 문구를 사용하고, 페이지에 제공되는 정보를 정확하게 설명하세요. 너무 짧은 콘텐츠를 표시하면 검색 엔진이 관련성이 있다고 간주하지 않을 수 있습니다. 또한 태그는 874자를 초과할 수 없습니다.

<span style="font-size: 14px;"><meta name="keywords" content="your tags" /></span>
로그인 후 복사
  • 페이지 설명, 각 웹페이지에는 웹페이지의 콘텐츠를 정확하게 반영하는 150자 이하의 설명 태그가 있어야 합니다.

<span style="font-size: 14px;"><meta name="description" content="150 words" /></span>
로그인 후 복사
  • 검색 엔진 색인 방법, robotsterms는 쉼표(,)로 구분된 값 집합이며 일반적으로 none, noindex, nofollow, all, index 및 follow 값입니다. nofollow 및 noindex 속성 값을 올바르게 사용했는지 확인하세요.

<span style="font-size: 14px;"><meta name="robots" content="index,follow" /><!--<br/>    all:文件将被检索,且页面上的链接可以被查询;<br/>    none:文件将不被检索,且页面上的链接不可以被查询;<br/>    index:文件将被检索;<br/>    follow:页面上的链接可以被查询;<br/>    noindex:文件将不被检索;<br/>    nofollow:页面上的链接不可以被查询。<br/> --></span>
로그인 후 복사
  • 페이지 리디렉션 및 새로 고침: 콘텐츠의 숫자는 시간(초), 즉 새로 고치는 데 걸리는 시간을 나타냅니다. URL을 추가하면 지정된 웹 페이지로 리디렉션됩니다(검색 엔진은 이를 자동으로 감지할 수 있으며, 엔진에 의해 오해의 소지가 있는 것으로 간주되어 처벌되기 쉽습니다).

<span style="font-size: 14px;"><meta http-equiv="refresh" content="0;url=" /></span>
로그인 후 복사
  • Others

<span style="font-size: 14px;"><meta name="author" content="author name" /> <!-- 定义网页作者 --><meta name="google" content="index,follow" /><meta name="googlebot" content="index,follow" /><meta name="verify" content="index,follow" /></span>
로그인 후 복사

Mobile devices

  • viewport: 모바일 브라우저의 디스플레이를 최적화할 수 있습니다. 웹 사이트가 응답하지 않으면 초기 크기 조정을 사용하지 않거나 크기 조정을 비활성화하십시오.
    대부분의 4.7~5인치 기기의 뷰포트 너비는 360px로 설정되어 있으며, 5.5인치 기기는 400px로 설정되어 있으며, iphone6 ​​​​plus는 414px로 설정되어 있습니다.

<span style="font-size: 14px;"><meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no"/><!-- `width=device-width` 会导致 iPhone 5 添加到主屏后以 WebApp 全屏模式打开页面时出现黑边  --></span>
로그인 후 복사
  1. width: 너비(숫자/장치 너비)(범위: 200~10,000, 기본값은 980픽셀)

  2. height: 높이(숫자/장치 높이)(범위: 223 ~ 10,000)

  3. initial-scale: 초기 스케일링(범위: >0 ~ 10)

  4. minimum-scale:允许用户缩放到的最小比例

  5. maximum-scale:允许用户缩放到的最大比例

  6. user-scalable:用户是否可以手动缩 (no,yes)

  7. minimal-ui:可以在页面加载时最小化上下状态栏。(已弃用)

注意,很多人使用initial-scale=1到非响应式网站上,这会让网站以100%宽度渲染,用户需要手动移动页面或者缩放。如果和initial-scale=1同时使用user-scalable=no或maximum-scale=1,则用户将不能放大/缩小网页来看到全部的内容。

  • WebApp全屏模式:伪装app,离线应用。

<span style="font-size: 14px;"><meta name="apple-mobile-web-app-capable" content="yes" /> <!-- 启用 WebApp 全屏模式 --></span>
로그인 후 복사
  • 隐藏状态栏/设置状态栏颜色:只有在开启WebApp全屏模式时才生效。content的值为default | black | black-translucent 。

<span style="font-size: 14px;"><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" /></span>
로그인 후 복사
  • 添加到主屏后的标题

<span style="font-size: 14px;"><meta name="apple-mobile-web-app-title" content="标题"></span>
로그인 후 복사
  • 忽略数字自动识别为电话号码

<span style="font-size: 14px;"><meta content="telephone=no" name="format-detection" /> </span>
로그인 후 복사
  • 忽略识别邮箱

<span style="font-size: 14px;"><meta content="email=no" name="format-detection" /></span>
로그인 후 복사
  • 添加智能 App 广告条 Smart App Banner:告诉浏览器这个网站对应的app,并在页面上显示下载banner

<span style="font-size: 14px;"><meta name="apple-itunes-app" content="app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL"> </span>
로그인 후 복사
  • 其他 参考文档

<span style="font-size: 14px;"><!-- 针对手持设备优化,主要是针对一些老的不识别viewport的浏览器,比如黑莓 --><meta name="HandheldFriendly" content="true"><!-- 微软的老式浏览器 --><meta name="MobileOptimized" content="320"><!-- uc强制竖屏 --><meta name="screen-orientation" content="portrait"><!-- QQ强制竖屏 --><meta name="x5-orientation" content="portrait"><!-- UC强制全屏 --><meta name="full-screen" content="yes"><!-- QQ强制全屏 --><meta name="x5-fullscreen" content="true"><!-- UC应用模式 --><meta name="browsermode" content="application"><!-- QQ应用模式 --><meta name="x5-page-mode" content="app"><!-- windows phone 点击无高光 --><meta name="msapplication-tap-highlight" content="no"></span>
로그인 후 복사

网页相关

  • 申明编码

<span style="font-size: 14px;"><meta charset=&#39;utf-8&#39; /></span>
로그인 후 복사
  • 优先使用 IE 最新版本和 Chrome

<span style="font-size: 14px;"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /><!-- 关于X-UA-Compatible --><meta http-equiv="X-UA-Compatible" content="IE=6" ><!-- 使用IE6 --><meta http-equiv="X-UA-Compatible" content="IE=7" ><!-- 使用IE7 --><meta http-equiv="X-UA-Compatible" content="IE=8" ><!-- 使用IE8 --></span>
로그인 후 복사
  • 浏览器内核控制:国内浏览器很多都是双内核(webkit和Trident),webkit内核高速浏览,IE内核兼容网页和旧版网站。而添加meta标签的网站可以控制浏览器选择何种内核渲染。参考文档

<span style="font-size: 14px;"> <meta name="renderer" content="webkit|ie-comp|ie-stand"></span>
로그인 후 복사

国内双核浏览器默认内核模式如下:
1. 搜狗高速浏览器、QQ浏览器:IE内核(兼容模式)
2. 360极速浏览器、遨游浏览器:Webkit内核(极速模式)

  • 禁止浏览器从本地计算机的缓存中访问页面内容:这样设定,访问者将无法脱机浏览。

<span style="font-size: 14px;"><meta http-equiv="Pragma" content="no-cache"></span>
로그인 후 복사
  • Windows 8

<span style="font-size: 14px;"><meta name="msapplication-TileColor" content="#000"/> <!-- Windows 8 磁贴颜色 --><meta name="msapplication-TileImage" content="icon.png"/> <!-- Windows 8 磁贴图标 --></span>
로그인 후 복사
  • 站点适配:主要用于PC-手机页的对应关系。

<span style="font-size: 14px;"><meta name="mobile-agent"content="format=[wml|xhtml|html5]; url=url"><!--<br/>[wml|xhtml|html5]根据手机页的协议语言,选择其中一种;<br/>url="url" 后者代表当前PC页所对应的手机页URL,两者必须是一一对应关系。<br/> --></span>
로그인 후 복사
  • 转码申明:用百度打开网页可能会对其进行转码(比如贴广告),避免转码可添加如下meta

<span style="font-size: 14px;"><meta http-equiv="Cache-Control" content="no-siteapp" /></span>
로그인 후 복사

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

H5+Canvas使用案例详解

怎样使用javascript Date Format方法

위 내용은 일반적으로 사용되는 코드 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

인기 기사

R.E.P.O. 에너지 결정과 그들이하는 일 (노란색 크리스탈)
3 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. 최고의 그래픽 설정
3 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. 아무도들을 수없는 경우 오디오를 수정하는 방법
3 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25 : Myrise에서 모든 것을 잠금 해제하는 방법
4 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

저렴한 가격의 새로운 Meta Quest 3S VR 헤드셋이 FCC에 등장하여 출시 임박을 시사 저렴한 가격의 새로운 Meta Quest 3S VR 헤드셋이 FCC에 등장하여 출시 임박을 시사 Sep 04, 2024 am 06:51 AM

메타커넥트 2024 행사는 9월 25일부터 26일까지 진행되며, 이번 행사에서 회사는 새로운 저가형 가상현실 헤드셋을 선보일 것으로 예상된다. Meta Quest 3S라는 소문이 있는 이 VR 헤드셋은 FCC 목록에 등장한 것으로 보입니다. 이 제안

GPT4o 수준을 능가하는 최초의 오픈 소스 모델! Llama 3.1 유출: 4,050억 개의 매개변수, 다운로드 링크 및 모델 카드 사용 가능 GPT4o 수준을 능가하는 최초의 오픈 소스 모델! Llama 3.1 유출: 4,050억 개의 매개변수, 다운로드 링크 및 모델 카드 사용 가능 Jul 23, 2024 pm 08:51 PM

GPU를 준비하세요! Llama3.1이 드디어 등장했지만, 출처는 Meta 공식이 아닙니다. 오늘 레딧에서는 라마의 대형 모델 새 버전 유출 소식이 입소문을 냈습니다. 기본 모델 외에도 벤치마크 결과인 8B, 70B, 최대 매개변수인 405B도 포함되어 있습니다. 아래 그림은 Llama3.1의 각 버전과 OpenAIGPT-4o, Llama38B/70B의 비교 결과를 보여줍니다. 여러 벤치마크에서 70B 버전조차 GPT-4o를 능가하는 것을 볼 수 있습니다. 이미지 출처: https://x.com/mattshumer_/status/1815444612414087294 분명히 8B 및 70 버전 3.1입니다.

새로 출시된 Llama 3를 빠르게 체험할 수 있는 6가지 방법! 새로 출시된 Llama 3를 빠르게 체험할 수 있는 6가지 방법! Apr 19, 2024 pm 12:16 PM

어제 밤 Meta는 Llama38B 및 70B 모델을 출시했습니다. Llama3 명령 조정 모델은 대화/채팅 사용 사례에 맞게 미세 조정 및 최적화되었으며 일반 벤치마크에서 기존의 많은 오픈 소스 채팅 모델보다 성능이 뛰어납니다. 예를 들어 Gemma7B 및 Mistral7B입니다. Llama+3 모델은 데이터와 규모를 개선하고 새로운 차원에 도달했습니다. 최근 Meta에서 출시한 2개의 맞춤형 24K GPU 클러스터에서 15T 이상의 데이터 토큰에 대해 교육을 받았습니다. 이 교육 데이터 세트는 Llama2보다 7배 더 크고 4배 더 많은 코드를 포함합니다. 이를 통해 Llama 모델의 기능을 현재 최고 수준으로 끌어올려 Llama2의 두 배인 8K 이상의 텍스트 길이를 지원합니다. 아래에

라마3가 갑자기 온다! 오픈 소스 커뮤니티가 다시 끓고 있습니다. GPT4 수준 모델에 대한 무료 액세스 시대가 도래했습니다. 라마3가 갑자기 온다! 오픈 소스 커뮤니티가 다시 끓고 있습니다. GPT4 수준 모델에 대한 무료 액세스 시대가 도래했습니다. Apr 19, 2024 pm 12:43 PM

라마3가 왔습니다! 방금 Meta의 공식 웹사이트가 업데이트되어 공식적으로 Llama의 380억 및 700억 매개변수 버전이 발표되었습니다. 그리고 출시 이후에는 오픈 소스 SOTA입니다. Meta 공식 데이터에 따르면 Llama38B 및 70B 버전은 각각의 매개변수 규모에서 모든 상대를 능가합니다. 8B 모델은 MMLU, GPQA 및 HumanEval과 같은 많은 벤치마크에서 Gemma7B 및 Mistral7BInstruct보다 성능이 뛰어납니다. 70B 모델은 인기 비공개 소스 프라이드치킨 Claude3Sonnet을 능가하고 Google의 GeminiPro1.5와 함께 왔다 갔다 했습니다. Huggingface 링크가 나오자마자 오픈소스 커뮤니티는 다시 열광했습니다. 눈이 예리한 시각장애인 학생들도 즉시 발견했습니다.

최강모델 라마 3.1 405B 정식 출시, 주커버그: 오픈소스가 새로운 시대를 선도하다 최강모델 라마 3.1 405B 정식 출시, 주커버그: 오픈소스가 새로운 시대를 선도하다 Jul 24, 2024 pm 08:23 PM

이제 오랫동안 기다려온 Llama 3.1이 공식 출시되었습니다! 메타는 “오픈소스가 새로운 시대를 선도한다”는 목소리를 공식적으로 내놨다. 메타는 공식 블로그를 통해 “지금까지 오픈소스 대형 언어 모델은 기능이나 성능 면에서 대부분 폐쇄형 모델에 뒤처져 있었다. 이제 오픈소스가 이끄는 새로운 시대를 열고 있다”며 “MetaLlama3.1405B를 공개 출시했다”고 밝혔다. , 우리는 그것이 세계에서 가장 크고 가장 강력한 오픈 소스 기본 모델이라고 믿습니다. 현재까지 모든 Llama 버전의 총 다운로드는 3억 회를 초과했으며 Meta 창립자이자 CEO인 Zuckerberg도 이제 막 시작했습니다. 기사. 긴 기사 "OpenSourceAIisthePathForward",

META은 무슨 뜻인가요? META은 무슨 뜻인가요? Mar 05, 2024 pm 12:18 PM

META는 일반적으로 Metaverse라는 가상 세계 또는 플랫폼을 나타냅니다. 메타버스는 현실 세계를 반영하거나 초월하고, 현실 세계와 상호작용할 수 있는 디지털 기술을 이용해 인간이 구축한 가상 세계로, 새로운 사회 시스템을 갖춘 디지털 생활 공간이다.

2024년에는 메타가 '오리온'이라는 혁신적인 AR 안경 프로토타입을 출시할 것으로 예상된다. 2024년에는 메타가 '오리온'이라는 혁신적인 AR 안경 프로토타입을 출시할 것으로 예상된다. Jan 04, 2024 pm 09:35 PM

24일 뉴스에 따르면 소셜미디어 업계에서 막강한 영향력을 갖고 있는 기술기업 메타가 차세대 컴퓨팅 플랫폼으로 꼽히는 기술인 증강현실(AR) 글래스에 큰 기대를 걸고 있다. 최근 메타의 기술 이사인 Andrew Bosworth는 인터뷰에서 회사가 2024년에 코드명 "Orion"이라는 고급 AR 안경 프로토타입을 출시할 것으로 예상된다고 밝혔습니다. 메타는 오랫동안 AR 기술에 다른 분야 못지않게 투자해 왔으며, 아이폰에 버금가는 획기적인 제품을 만들기 위해 수십억 달러에 달하는 막대한 투자를 해왔습니다. 지난해 오리온 안경 양산 계획 종료를 발표했지만,

분석가는 소문난 Meta Quest 3S VR 헤드셋의 출시 가격에 대해 논의합니다. 분석가는 소문난 Meta Quest 3S VR 헤드셋의 출시 가격에 대해 논의합니다. Aug 27, 2024 pm 09:35 PM

Meta의 Quest 3 최초 출시(Amazon에서 현재 $499.99)로부터 1년 이상이 지났습니다. 그 이후로 Apple은 훨씬 더 비싼 Vision Pro를 출시했으며 Byte Dance는 이제 중국에서 Pico 4 Ultra를 공개했습니다. 그러나

See all articles