メタタグ機能
METAタグは、HTMLタグHEAD領域のキータグであり、ドキュメント文字セット、言語、作成者などの基本情報と、キーワードやキーワードの設定を提供します。 Web ページのレベルなど。最大の機能は、検索エンジン最適化 (SEO) を実行できることです。
追記: indexエンジンロボットを検索して分類するのは簡単です。インターネットアプリケーションはそれに注意する必要があります。
大手ウェブサイトでどうやって書くの?
このタグを理解する前に、次のように、さまざまな主流 Web サイトでメタ設定を検索しました。
JD.com のホームページのメタ設定:
<meta charset="gbk"> <meta name="description" content="京东JD.COM-专业的综合网上购物商城,销售家电、数码通讯、电脑、家居百货、服装服饰、母婴、图书、食品等数万个品牌优质商品.便捷、诚信的服务,为您提供愉悦的网上购物体验!"> <meta name="Keywords" content="网上购物,网上商城,手机,笔记本,电脑,MP3,CD,VCD,DV,相机,数码,配件,手表,存储卡,京东">
Taobao のホームページのメタ設定:
<meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="renderer" content="webkit"> <meta name="spm-id" content="a21bo"> <meta name="description" content="淘宝网 - 亚洲最大、最安全的网上交易平台,提供各类服饰、美容、家居、数码、话费/点卡充值… 8亿优质特价商品,同时提供担保交易(先收货后付款)、先行赔付、假一赔三、七天无理由退换货、数码免费维修等安全交易保障服务,让你全面安心享受网上购物乐趣!"> <meta name="keyword" content="">
youkuホームページのメタ設定:
<meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=Edge"> <meta name="title" content="优酷-中国领先视频网站,提供视频播放,视频发布,视频搜索 - 优酷视频" /> <meta name="keywords" content="视频,视频分享,视频搜索,视频播放,优酷视频" /> <meta name="description" content="视频服务平台,提供视频播放,视频发布,视频搜索,视频分享" />
Douyuホームページのメタ設定:
メタタグ機能
METAタグは、HTMLタグのHEAD領域にあるキータグで、ドキュメントの文字セット、言語、作成者などの情報、およびキーワードや Web ページのレベルの設定などは、検索エンジン最適化 (SEO) に最も役立ちます。
追記: 検索エンジンのロボットが検索して分類するのに便利なので、インターネット アプリケーションはこれに注意を払う必要があります。
大手ウェブサイトでどうやって書くの?
このタグを理解する前に、次のように、さまざまな主流 Web サイトでメタ設定を検索しました。
JD.com のホームページのメタ設定:
<meta charset="gbk"> <meta name="description" content="京东JD.COM-专业的综合网上购物商城,销售家电、数码通讯、电脑、家居百货、服装服饰、母婴、图书、食品等数万个品牌优质商品.便捷、诚信的服务,为您提供愉悦的网上购物体验!"> <meta name="Keywords" content="网上购物,网上商城,手机,笔记本,电脑,MP3,CD,VCD,DV,相机,数码,配件,手表,存储卡,京东">
Taobao のホームページのメタ設定:
<meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="renderer" content="webkit"> <meta name="spm-id" content="a21bo"> <meta name="description" content="淘宝网 - 亚洲最大、最安全的网上交易平台,提供各类服饰、美容、家居、数码、话费/点卡充值… 8亿优质特价商品,同时提供担保交易(先收货后付款)、先行赔付、假一赔三、七天无理由退换货、数码免费维修等安全交易保障服务,让你全面安心享受网上购物乐趣!"> <meta name="keyword" content="">
youkuホームページのメタ設定:
<meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=Edge"> <meta name="title" content="优酷-中国领先视频网站,提供视频播放,视频发布,视频搜索 - 优酷视频" /> <meta name="keywords" content="视频,视频分享,视频搜索,视频播放,优酷视频" /> <meta name="description" content="视频服务平台,提供视频播放,视频发布,视频搜索,视频分享" />
metaの詳しい説明
metaタグは、http-equivとnamevariableの2つの部分に分けることができます。
http-equiv
http-equiv は、http のファイル ヘッダーに相当し、ブラウザが Web ページのコンテンツを正しく表示できるようにするために、いくつかの有用な情報をブラウザに送り返すことができます。
値 | 説明 | 例 |
content-type | ページで使用される文字セットを設定します |
<meta http-equiv="content-Type" content="text/html; charset=utf-8"> GB2312を使用する場合、担当者が説明しますウェブサイトが採用しているエンコーディングは簡体字中国語です。 UTF-8 はウェブサイトで使用されているエンコーディングを意味します。 追記: html5 |
IE8 特殊タグを使用して、特定のバージョンの | IE ブラウザ をシミュレートする IE8 ブラウザを指定します。互換性の問題。 <meta http-equiv="X-UA-Compatible" content="IE=7">上記のコードは、ドキュメント標準が | DTD で宣言されているかどうかに関係なく、IE8/9 は IE7 エンジンを使用してページをレンダリングすることを IE ブラウザーに伝えます。 <meta http-equiv="X-UA-Compatible" content="IE=8">上記のコードは、IE8/9 が IE8 エンジンを使用してページをレンダリングすることを IE ブラウザーに伝えます。 <meta http-equiv="X-UA-Compatible" content="IE=edge">上記のコードは、IE ブラウザに、IE8/9 以降のバージョンがページのレンダリングに最も高いバージョンの IE を使用することを伝えます。 <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"> PS: Google がプラグインを追加しました: Google Chrome Frame (Google 埋め込みブラウザ) FrameworkGCF )、このプラグインはユーザーの IE ブラウザを変更しないままにできますが、ユーザーが Web を閲覧するとき、実際には Google Chrome ブラウザ コアを使用し、IE6、7、8 などの複数のバージョンの IE ブラウザをサポートします。 。 |
Web ページの有効期限を設定します。 | <meta http-equiv="expires"content="Fri,12Jan200118:18:18GMT"> |
|
は自動的に更新され、新しいページをポイントします。 | <meta http-equiv="Refresh" content="2;URL=https://www.baidu.com"> |
|
Web ページの有効期限が切れると、ローカル Cookie が自動的に | 削除されます。 <meta http-equiv="Set-Cookie"content="cookie value=xxx;expires=Friday,12-Jan-200118:18:18GMT;path=/"> |
|
windows-target | 强制页面在当前窗口中以独立页面显示,可以防止自己的网页被别人当作一个frame页调用 |
<meta http-equiv="Window-target" content="_top"> |
cache-control | 缓存机制 | <meta http-equiv="cache-control" content="no-cache"> Public:指示响应可被任何缓存区缓存。 Private:指示对于单个用户的整个或部分响应消息,不能被共享缓存处理。这允许服务器仅仅描述当用户的部分响应消息,此响应消息对于其他用户的请求无效。 no-cache:指示请求或响应消息不能缓存。 no-store:用于防止重要的信息被无意的发布。在请求消息中发送将使得请求和响应消息都不使用缓存。 max-age:指示客户机可以接收生存期不大于指定时间(以秒为单位)的响应。 min-fresh:指示客户机可以接收响应时间小于当前时间加上指定时间的响应。 max-stale:指示客户机可以接收超出超时期间的响应消息。如果指定max-stale消息的值,那么客户机可以接收超出超时期指定值之内的响应消息。 |
name
name属性主要用于描述网页,与之对应的属性值为content,content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的。
值 | 描述 | 例子 |
author | 标注网页的作者 |
<meta name="author" content="dashen" /> |
keywords | 页面关键词,用于被搜索引擎收录 |
<meta name="keywords" content="新闻,新闻中心, 新闻频道"> |
description | 页面描述,用于搜索引擎收录 |
<meta name="description" content="新闻中心,包含有时政新闻、国内新闻、国际新闻、社会新闻、时事评论、新闻图片、新闻专题、新闻论坛、军事、历史、的专业时事报道门户网站"> |
viewport | 用于控制页面缩放 | <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"> |
renderer | 指定双核浏览器默认以何种方式渲染页面。 | <meta name="renderer" content="webkit">//默认webkit内核 <meta name="renderer" content="ie-comp">//默认IE兼容模式 <meta name="renderer" content="ie-stand">//默认IE标准模式 PS:360浏览器支持 |
generator | 说明网站的采用的什么软件制作 |
<meta name="generator" content="Microsoft"/> |
revised | 网页文档的修改时间 |
<meta name="revised" content="设计网, 6/24/2015"/> |
robots | 用来告诉搜索机器人哪些页面需要索引,哪些页面不需要索引。 |
<meta name="robots" content="none"/> 取值:all|none|index|noindex|follow|nofollow, 默认all all:文件将被检索,且页面上的链接可以被查询; none:文件将不被检索,且页面上的链接不可以被查询; index:文件将被检索; follow:页面上的链接可以被查询; noindex:文件将不被检索,但页面上的链接可以被查询; nofollow:文件将不被检索,页面上的链接可以被查询。 |
copyright | 网站版权信息 |
<meta name="copyright" content="本页版权XXX所有。All Rights Reserved" /> |
以上がHTMLのメタタグの概要と詳細説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ブール属性は、値なしでアクティブ化されるHTMLの特別な属性です。 1.ブール属性は、無効化された入力ボックスを無効にするなど、存在するかどうかによって、要素の動作を制御します。 2.彼らの実用的な原則は、ブラウザが異なっているときに属性の存在に応じて要素の動作を変更することです。 3.基本的な使用法は、属性を直接追加することであり、高度な使用法はJavaScriptを介して動的に制御できます。 4.一般的な間違いは、値を設定する必要があると誤って考えており、正しい執筆方法は簡潔にする必要があります。 5.ベストプラクティスは、コードを簡潔に保ち、ブールのプロパティを合理的に使用して、Webページのパフォーマンスとユーザーエクスペリエンスを最適化することです。

HTMLコードは、オンラインバリデーター、統合ツール、自動化されたプロセスを使用するとクリーンになります。 1)w3cmarkupvalidationserviceを使用して、HTMLコードをオンラインで確認します。 2)リアルタイム検証のためにVisualStudiocodeにhtmlhint拡張機能をインストールして構成します。 3)HTMLTIDYを使用して、建設プロセスでHTMLファイルを自動的に検証およびクリーニングします。

HTML、CSS、およびJavaScriptは、最新のWebページを構築するためのコアテクノロジーです。1。HTMLはWebページ構造を定義します。2。CSSはWebページの外観に責任があります。

HTMLの機能は、Webページの構造とコンテンツを定義することであり、その目的は、情報を表示するための標準化された方法を提供することです。 1)HTMLは、タイトルやパラグラフなどのタグや属性を使用して、Webページのさまざまな部分を整理しています。 2)コンテンツとパフォーマンスの分離をサポートし、メンテナンス効率を向上させます。 3)HTMLは拡張可能であり、カスタムタグがSEOを強化できるようにします。

HTMLの将来の傾向はセマンティクスとWebコンポーネントであり、CSSの将来の傾向はCSS-in-JSとCSShoudiniであり、JavaScriptの将来の傾向はWebAssemblyとServerLessです。 1。HTMLセマンティクスはアクセシビリティとSEO効果を改善し、Webコンポーネントは開発効率を向上させますが、ブラウザの互換性に注意を払う必要があります。 2。CSS-in-JSは、スタイル管理の柔軟性を高めますが、ファイルサイズを増やす可能性があります。 CSShoudiniは、CSSレンダリングの直接操作を可能にします。 3. Webassemblyブラウザーアプリケーションのパフォーマンスを最適化しますが、急な学習曲線があり、サーバーレスは開発を簡素化しますが、コールドスタートの問題の最適化が必要です。

Web開発におけるHTML、CSS、およびJavaScriptの役割は次のとおりです。1。HTMLは、Webページ構造を定義し、2。CSSはWebページスタイルを制御し、3。JavaScriptは動的な動作を追加します。一緒に、彼らは最新のウェブサイトのフレームワーク、美学、および相互作用を構築します。

HTMLの将来は、無限の可能性に満ちています。 1)新機能と標準には、より多くのセマンティックタグとWebComponentsの人気が含まれます。 2)Webデザインのトレンドは、レスポンシブでアクセス可能なデザインに向けて発展し続けます。 3)パフォーマンスの最適化により、応答性の高い画像読み込みと怠zyなロードテクノロジーを通じてユーザーエクスペリエンスが向上します。

Web開発におけるHTML、CSS、およびJavaScriptの役割は次のとおりです。HTMLはコンテンツ構造を担当し、CSSはスタイルを担当し、JavaScriptは動的な動作を担当します。 1。HTMLは、セマンティクスを確保するためにタグを使用してWebページの構造とコンテンツを定義します。 2。CSSは、セレクターと属性を介してWebページスタイルを制御して、美しく読みやすくします。 3。JavaScriptは、動的でインタラクティブな関数を実現するために、スクリプトを通じてWebページの動作を制御します。


ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

人気の記事

ホットツール

WebStorm Mac版
便利なJavaScript開発ツール

DVWA
Damn Vulnerable Web App (DVWA) は、非常に脆弱な PHP/MySQL Web アプリケーションです。その主な目的は、セキュリティ専門家が法的環境でスキルとツールをテストするのに役立ち、Web 開発者が Web アプリケーションを保護するプロセスをより深く理解できるようにし、教師/生徒が教室環境で Web アプリケーションを教え/学習できるようにすることです。安全。 DVWA の目標は、シンプルでわかりやすいインターフェイスを通じて、さまざまな難易度で最も一般的な Web 脆弱性のいくつかを実践することです。このソフトウェアは、

SublimeText3 英語版
推奨: Win バージョン、コードプロンプトをサポート!

EditPlus 中国語クラック版
サイズが小さく、構文の強調表示、コード プロンプト機能はサポートされていません

メモ帳++7.3.1
使いやすく無料のコードエディター

ホットトピック









