<link> タグは、現在のドキュメントと Web コレクション内の他のドキュメントとの関係を定義します。リンク要素は、属性のみを含む空の要素です。この要素はヘッド セクションにのみ出現しますが、出現回数は任意です。 HTML では、<link> タグに終了タグはありません。 XHTML では、<link> タグを適切に閉じる必要があります。 HTML の標準的な共通属性に加えて、link 要素には、charset、href、hreflang、media、rel、rev、target、title、type などの多くのオプション属性が含まれます。これらの属性のうち、target は Transitional および Frameset DTD でのみ使用できますが、その他の属性は Strict、Transitional、および Frameset DTD で使用できます。 これらの属性の中で、rel 属性が中心となります。この記事では、123WORDPRESS.COM が、私たちが知っているいくつかの rel 属性と、WordPress のいくつかのリンク要素の処理を紹介します。これは、初心者の友人が学習するのに適しています。 1. 外部スタイルシートの呼び出し(1)表示スタイルシートリンク タグは、次のような外部スタイル シートを呼び出すために最もよく使用されます。 ここで、 hrefは対象ドキュメントの URL、 typeは対象 URL の MIME タイプ、 media はドキュメントが表示されるデバイスを指定します。 (2)印刷デバイススタイルシート次のwebdesignerwallスタイルシート呼び出しは、印刷デバイスに表示されるドキュメントの CSS スタイルを指定します。 (3)置き換え可能なスタイルシート一部の Web ページでは、次のようなスタイルシート呼び出しも表示されることがあります。 このコードは、最初のリンク要素と組み合わせて使用される代替スタイルシートを定義します。最初の要素は優先スタイルシートを定義し、この要素はユーザーが代替スタイルシートを選択できるようにします。ただし、この置換操作にはブラウザのサポートが必要ですが、IE などの多くのブラウザはこれをサポートしていません。 そのため、置換スタイルを使用する Web ページでは、通常、スタイルシートの切り替えに JS が使用され、ユーザーはインターフェース スタイルを自由に切り替えられるようになります。誰もがこれを見たことがあるはずです。一部の Web サイトでは、Web ページに複数の配色を定義しています。 WordPress ユーザーが興味を持っている場合は、 Small PotatoのWPDesigner 7 WordPress テーマを試用版としてダウンロードできます (またはDEMO を確認してください)。シンプルな JS と複数の置き換え可能なスタイルを使用して、ユーザーが Web ページの色を変更できるようにします。さらに高度なものには、日中は明るい色、夜間は暗い色を表示するなど、JS を使用して時間とともにスタイルを変更することもできます。 注: 優先スタイルシートに media="all" を指定し、印刷スタイルシートを追加すると、Web 標準にさらに準拠するようになります (ただし、通常の Web サイトの場合、ページを印刷したい人はほとんどいません)。 Palan Imageは印刷スタイルを定義していません。後で時間を見つけて定義します。 注: 代替スタイルを使用するかどうかは裁量の問題です。配色のみを変更し、全体のトーンが変わらない場合は、許容されます。しかし、WordPress ユーザーなど、まったく異なるスタイルの複数のテーマを有効にし、プラグインを使用してユーザーが自由に変更できるようにする人もいます。これはクールに思えるかもしれませんが、やらない方がいいと思います。 SEO に影響するかどうかに関わらず、ウェブサイトに対する固定イメージが人々には欠けてしまいます。 2. ウェブサイトのお気に入りアイコンを定義するfavicon/bookmarks iconの詳しい紹介については、Baidu Encyclopedia ( 1 、 2 ) を参照してください。次のコードを使用して呼び出すことができます。 この呼び出しについてはまだ少し混乱していますが、私の実験の結果は次のとおりです。
注: このリンク要素を使用せずに、favicon.ico ファイルを直接作成し、Web サイトのルート ディレクトリに配置することもできます。 Shun Ding Share: ウェブサイトに Apple Touch アイコンを追加するiPhone または iPod Touch デバイスでは、ユーザーはホーム画面に Web サイトへのリンクを追加できます。次のコードを使用して、Web サイトに Apple Touch アイコンを割り当てます。 アイコンのサイズは PNG 形式で 57 x 57 です。そうでない場合は、自動的に拡大縮小されます。また、私の記憶が正しければ、iPhone スタイルの美しい丸い角である必要はありません。iPhone は、last.fm のApple Touch アイコンのように、スタイルに応じて角が丸いアイコンを自動的にグラデーションにします。 国内ユーザーの場合、iPhoneを使っている人は多くありません。たとえ多くても、あなたのサイトをホーム画面に置いてくれるでしょうか?残念ながら、それは私たちの小さなウェブサイトではできないことです。しかし、楽しみのために、自分の Web サイト用に 1 つ作成し、リンク要素を追加しました。 3. WordPressのリンク要素(1)RSSアドレスとPingbackアドレス以下は、デフォルトの WordPress テーマにおける RSS2 アドレス、Atom アドレス、Pingback アドレスの定義です。具体的な原則は非常に奥が深く複雑だと思うので、勉強するつもりはありません。とにかく、あなたのブログにはそれが必要なので、Atom はそれがなくても大丈夫のようですね? (2)リモート公開用リンク要素テーマに <?php wp_head(); ?> 関数がある場合は、次の 2 つのリンク要素が表示されます。 これら 2 つの要素は主にリモート公開に使用されます。たとえば、Windows Live Write などのデスクトップ ブログ エディターを使用して記事を公開します。この機能が必要ない場合は、これら 2 つの要素を削除できます。削除するには、WordPress テーマの functions.php を開き、<?php } ?> または ?> タグの前の下部に次のコードを挿入します。 注: これら 2 つを生成するのは <?php wp_head(); ?> 関数なので、これを削除すればいいのではないかと思われるかもしれません。はい、他のプラグインでこの機能が必要になることが予想されない場合は、削除してください。 4. 重複コンテンツを防ぐための正規属性Google、Yahoo、Live Searchは今年2月頃、重複コンテンツの問題を解決するためにウェブページの権威チェーンを指定するために主に使用されるCanonicalと呼ばれる新しいLink属性をサポートすると発表しました。 この属性の詳細な説明については、Google 中国語ウェブマスターの「URL 形式の指定」をご覧ください。 WordPress ユーザーがヘッド セクションにこの属性を追加するために推奨される 2 つのプラグインは、 SEO No DuplicateまたはCanonical URL’s です。好きな方をお使いください。 完全な分析だと言いましたが、実際にはよく使われるものについてのみ話しました。ほとんどの人にとってはこれで十分です。他の重要な、よく使われる rel 属性をご存知でしたら、ぜひ共有してください。 |
<<: MySQL 8.0 の新機能 - チェック制約の紹介
>>: 大量のデータを含むエレメントのシャトルボックスで「すべて選択」をクリックするとスタックする問題の解決方法
1. IE8 の getElementById は id のみをサポートし、name はサポートしま...
2 つ以上のブロックレベル ボックスの垂直に隣接するエッジが重なり合っています。結果として得られる境...
この記事では、宝くじマシンの効果を実現するためのJavaScriptの具体的なコードを参考までに共有...
相対パスの概念現在のファイルの場所を参照ポイントとして使用して、ターゲット ファイルへのパスを確立し...
動作環境: MAC Docker バージョン: Docker version 17.12.0-ce,...
序文最近、X 省のコールド チェーン トレーサビリティ システムの開発で忙しくしています。毎日午後 ...
この記事では、centos6.6 で php7 + nginx 環境をインストールする方法について説...
新しいserver.jsを作成する糸初期化 -y 糸を追加エクスプレスノードモン -D var ex...
この記事では、いくつかの基本的なページ要素の実装方法をまとめており、後で更新される予定です。まず、私...
目次Vueのリスナーとは何かリスナーの使い方vue リスナーウォッチVue リスナー - ディープリ...
すべての前提条件にはルート権限が必要です1. MySQLプロセスを終了する //Linux sudo...
一般的に使用される方法は次の 4 つです。 1.locate()メソッドを使用する一般的な使用法: ...
問題を見つける今日、仕事中に、ローカル データベースから仮想マシン CentOS 6.6 上のデータ...
目次1. アニメーション機能の原理2. アニメーション関数のシンプルなカプセル化3. アニメーション...
データ分析の分野では、データベースは私たちの強力な助けとなります。クエリ時間を受け入れるだけでなく、...