일반적으로 사용되는 HTML 메타태그 속성(웹사이트 호환성 및 최적화를 위해 필요)_HTML/Xhtml_웹페이지 제작

원본 주소: http://segmentfault.com/blog/ciaocc/1190000002407912
저자: ciaocc
저작권은 ciaocc에 있습니다.

요약

 태그는 HTML 문서에 대한 메타데이터를 제공합니다. 메타데이터는 페이지에 표시되지 않지만 기계에서 읽을 수 있습니다. 브라우저(콘텐츠가 표시되거나 페이지가 다시 로드되는 방식), 검색 엔진(키워드) 또는 기타 웹 서비스에서 사용할 수 있습니다. —— W3School

필수 속성

属性	值	描述
content	some text	定义与http-equiv或name属性相关的元信息

선택 속성

属性	值	描述
http-equiv	content-type / expire / refresh / set-cookie	把content属性关联到HTTP头部。
name	author / description / keywords / generator / revised / others	把 content 属性关联到一个名称。
content	some text	定义用于翻译 content 属性值的格式。

SEO 최적화

참조 문서

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

코드 복사

코드는 다음과 같습니다.

페이지 설명 , 각 웹페이지에는 내용을 정확하게 반영하는 150자 이하의 설명 태그가 있어야 합니다. 웹페이지.

코드 복사

코드는 다음과 같습니다.

검색 엔진 색인 방법인 robotsterms는 쉼표(,)로 구분된 값 집합이며 일반적으로 none, noindex, nofollow, all, index 및 follow 값을 사용합니다. nofollow 및 noindex 속성 값을 올바르게 사용했는지 확인하세요.

코드 복사

코드는 다음과 같습니다.

페이지 리디렉션 및 새로 고침: 콘텐츠의 숫자는 시간(초), 즉 새로 고치는 데 걸리는 시간을 나타냅니다. URL을 추가하면 지정된 웹 페이지로 리디렉션됩니다. (검색 엔진은 이를 자동으로 감지할 수 있으며, 엔진에서 이를 오해의 소지가 있는 것으로 간주하여 처벌하기 쉽습니다.)

코드 복사

코드는 다음과 같습니다.

기타

코드 복사

코드는 다음과 같습니다.

모바일 장치

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

코드 복사

코드는 다음과 같습니다.

1.width: 너비(숫자/장치 너비)(범위 200~10,000, 기본값은 980픽셀)

2.height: 높이(숫자/장치 높이)(범위 223~10,000)3.initial-scale: 초기 배율 비율(범위 >0 ~ 10)

4.minimum-scale: 사용자가 확대/축소할 수 있는 최소 배율
5.maximum-scale: 사용자는 다음의 최대 비율로 확대/축소할 수 있습니다. (더 이상 사용되지 않음)
많은 사람들이 비반응형 웹사이트에서initial-scale=1을 사용하는데, 이로 인해 웹사이트가 100% 너비로 렌더링되고 사용자가 수동으로 페이지를 이동하거나 확대/축소해야 합니다. user-scalable=no 또는 maximum-scale=1을initial-scale=1과 함께 사용하면 사용자는 전체 내용을 보기 위해 웹 페이지를 확대/축소할 수 없습니다.


WebApp 전체 화면 모드: Disguise 앱, 오프라인 애플리케이션.

코드 복사

코드는 다음과 같습니다.

상태 표시줄 숨기기/상태 표시줄 색상 설정: WebApp 전체 화면 모드가 켜져 있는 경우에만 적용됩니다. 콘텐츠의 값은 기본값 | 검정-반투명입니다.

코드 복사코드는 다음과 같습니다.

홈 화면에 제목이 추가되었습니다

코드 복사코드는 다음과 같습니다.

자동으로 전화번호로 인식되는 숫자 무시

코드 복사코드

인식 이메일 무시

코드 복사코드는 다음과 같습니다.

스마트 앱 배너 추가 스마트 앱 배너: 브라우저에 이 웹사이트에 해당하는 앱을 알려주고 해당 페이지에 다운로드 배너를 표시합니다(아래 그림 참조). 참고문서

코드 복사코드는 다음과 같습니다.

기타참고문서

XML/HTML 코드

클립보드에 콘텐츠 복사

2. <메타 이름="HandheldFriendly" 콘텐츠="참">
4. <메타 이름="MobileOptimized" 콘텐츠="320">
6. <메타 이름="화면- 방향" 내용="인물">
8. <메타 이름="x5- 방향" 내용="인물">
10. <메타 이름="full- 화면" 콘텐츠="예">
11. <-- QQ 강제 전체화면 -->
12. <메타 이름="x5- 전체 화면" 콘텐츠="참">
14. <메타 이름="browsermode" 콘텐츠="응용 프로그램">
16. <메타 이름="x5- 페이지 모드" 콘텐츠="앱">
18. <메타 이름="msapplication- 탭 강조 표시" 콘텐츠="아니요">

웹 관련

선언 인코딩

코드 복사

코드는 다음과 같습니다.

최신 버전의 IE와 Chrome을 우선적으로 사용하세요

코드 복사

코드는 다음과 같습니다.

< ;! -- Windows 8 타일 아이콘 -->

사이트적응 : 주로 PC-모바일 페이지 대응에 사용됩니다.

코드 복사

코드는 다음과 같습니다.

트랜스코딩 설명: Baidu로 웹페이지를 열면 웹페이지가 트랜스코딩될 수 있습니다(예: 광고 게시). 트랜스코딩을 방지하려면 다음 메타를 추가하세요

코드 복사

코드는 다음과 같습니다.

기타 참고문서

HTML 메타 태그 전체 목록
W3C 메타 태그
HTML5의 메타태그
MDN 메타 태그