FAQ(Frequently Asked Questions)とは、よくある質問集という意味です。 ウェブサイト作成についての問題解決策や実用的な技術を紹介します。
一般 - サイトが表示されません - サイトが更新されません - 文字化けしてしまいます - 改行がうまくできません - 空白がうまくできません - 表示速度が遅いです - メールアドレスへリンクする方法 - フォントサイズの指定方法 - サイト内検索を設置する方法 - サイトマップとは? - エラーページのカスタマイズ方法 - ファビコンとは? - Webサービスの利用方法 - <pre>タグで自動改行されません - 自動的にジャンプさせる方法 - フレームサイトの作り方 - indexの順位を指定する方法 - ページ内リンクをする方法 - Firefoxでa:hoverがうまくできません -
CGIとPHP - CGIが動作しません - PHPが動作しません - アクセス制限をする方法 - CGIで文字化けしてしまいます - CGIで文字コードをUTF-8に変換する方法 - PHPで「Cannot modify header infomation」エラー - PHPでExif情報を取得し表示する方法 -
CMS - XOOPSのテンプレートが更新されません - XOOPSの表示速度が遅いです - XOOPSとXOOPS Cubeの違いは何ですか? - XOOPSサイトをサーバ移転するにはA - XOOPSサイトをサーバ移転するにはB - XOOPSでタグクラウドを表示する方法 - XOOPSのブロックタイトルを非表示にする方法 - XOOPSのコメント機能が使いにくいです - MT4のスタイルシートが適用されません - MT4のカテゴリを任意の順番にソートする方法 -
Flash - Flashが表示されません - マウスが矢印になりません - .flaファイルの容量がどんどん大きくなってしまいます -
画像 - 画像が表示されません - 画像にリンクすると枠線が表示されてしまいます - 画像の周りに余白を作りたい - バナーとは? - 画像の横に文字を回り込ませる方法 - 画像のコピーを防ぐ方法 - 画像をランダムに表示する方法 - 画像をクールに表示する方法 - 携帯向け画像を転送不可にする方法 -
掲示板 - 荒らしに困っています - phpBB3のスタイルが更新されません -
その他 - iPhone対応サイトの作り方 - IPアドレスによるアクセス制限をする方法 - パスワードによるアクセス制限をする方法 -
- 「404 error」の場合、ファイルがサーバに存在しないということです。
- 「403 error」の場合、アクセス権が無いか、アクセスが混み合っているということです。
- 「500 error」の場合、CGIのエラーなどということです。
- まずは、HTMLは正しく記述されていますか? タグやファイル名は全て半角英数字(特殊記号、空白なし)でないとダメです。
- サーバにはちゃんとアップロードされていますか? PC上で表示できて、サーバ上で表示できない場合は、 リンク先のパスが間違っていたり、ファイル名の大文字と小文字が違っているなどが考えられます。
- サーバの指定するフォルダにアップロードしていますか? 「public_html」や「web」など指定のフォルダがある場合があります。
- ソフトウェアである程度自動的に作成した場合、 パスがローカルPCのアドレスになっている場合がよくあります。 パスが「file:///C:/Documents/...」などとなっていたらダメです。 ブラウザで「ソースを表示」して確認してみましょう。
- 独自ドメインをはじめましたか? DNSの設定が完了していないかもしれません。1日以上待ってみましょう。
- サーバがダウンしているかもしれません。確認してみましょう。
- FTPソフトでアップロードする際「上書き」に設定されていますか?
- ブラウザが古いファイルを表示していませんか?「更新」または「再読み込み」してください。
- ブラウザが古いファイルをキャッシュしていませんか?キャッシュファイルをクリア(削除)してください。
- htmlの<head>タグの中で文字コードを宣言していますか?必ず、 <meta http-equiv="Content-type" content="text/html; charset=Shift_JIS">などと記述してください。
- 宣言した文字コードとHTMLファイル自体の文字コードは一致していますか?
- 異なる文字コードの漢字などが含まれていませんか?
- 機種依存文字(半角カナなど)が含まれていませんか?
- FTPソフトが、自動的に文字コードを変換してアップロードする設定になっていませんか?
- HTMLファイルの最上部にコメントアウトした漢字を記述してみてください。 <!-- あ -->などと記述することで正常に表示される場合があります。
- ブラウザの「文字エンコーディング」設定が固定されていませんか? 日本語(自動判別)に設定してください。
- 改行には<br>タグを使用しましょう。
- <p>タグは段落として前後に改行が入りますが、改行のためのタグではありません。 また、もし使用する場合は終了タグ</p>を必ず書きましょう。
- 空白を連続して改行することはやめましょう。改行しているように見えるだけです。
- <br><br>とふたつ並べて書くと1行空白の改行になります。
- 微妙な空白などがある場合、HTMLソース自体に改行がありませんか? 改行タグの周辺を1行で記述してみてください。
- 空白には タグを使用しましょう。
- スペースキーによる空白はうまく表示されない場合が多いです。
- HTMLソースに改行があると、そこに空白が挿入されるブラウザもあります。
- サーバの性能によるものが大きいです。引越しをご検討ください。
- 画像が大きすぎませんか?画像ソフトを利用して編集してください。
- ソフトウェアで作成していますか?余計なタグなどが自動挿入されていませんか?環境設定などを確認しましょう。
- テーブルを使ってレイアウトしていませんか?テーブルによるレイアウトは推奨されません。 テーブル内の画像や文字を全て読み込んでから表示するブラウザもあります。 できるだけスタイルシートでレイアウトしましょう。
- 閲覧者のネット環境は何ですか?ナローバンド(ダイヤルアップ、ISDN)では回線速度自体が遅いです。 ブロードバンド(ADSL、FTTH(光))にしましょう。
【@nifty光 with フレッツ】無線LANプレゼントキャンペーン実施中!
- メールアドレスは、HTMLで、<a href="mailto:test@test.com">test@test.com</a>と書くことで、 クリックしたときにメールソフトを起動させることができます。
test@test.com
- しかし、これを自動的に探し出して標的にし、スパムメールやウィルスメールを送信されることがあります。
- そのため、あえてリンクしなかったり、大文字で書くことでこれらを回避します。
- フォントサイズは外部CSSに記述すると、サイト全体に一括で指定できるので便利です。 その際、12pxなど絶対的な値で指定するより、120%などと相対的な値で指定する方が柔軟性があります。絶対値だと、ブラウザで大きさを変更できない場合があります。 small、largeなどの指定も絶対値となります。
body{ font-size:120%; }
- サイト内を検索できるととても便利です。
- CGIとPHPによるスクリプトなどもありますが、 Googleやヤフーなど大手検索ではサイト内検索のサービスを提供しているので、 簡単に自分のサイトに設置することもできます。
Googole リンク、検索機能を追加
Yahoo!検索 - 検索窓(サーチボックス)設置方法
- サイト全体の全てのページを一覧でリンクしたものです。
- XMLでサイトマップを作成する手法もあります。 検索エンジンにXMLのサイトマップを登録して検索結果に反映させることができます。
サイトマップ自動生成ツール
- 「404 Not Found」などと表示される、エラーページを、 .htaccessファイルを利用してカスタマイズすることができます。 サーバによってはエラーページに広告などが表示されるので、ぜひ変更しましょう。 サーバが.htaccessファイルの設置を許可している必要があります。
- テキストエディタで以下のように書いて、Errorフォルダに指定のHTMLファイルをアップロードすれば完了です。 ただ、Internet ExplorerではHTMLファイルの容量が小さすぎると正常に表示されない場合があります。 そのときはコメントアウトした文字を書くなどして容量を1KB以上にします。
ErrorDocument 401 /Error/401.html
ErrorDocument 403 /Error/403.html
ErrorDocument 404 /Error/404.html
ErrorDocument 500 /Error/500.html
- ファビコン(Favicon)とは、ブラウザのアドレスバーやサイトタイトルの横に ちょこっと表示されるサイトのアイコンのようなものです。
- ファビコンを指定するには、HTMLの<head>中で
<link rel="shortcut icon" href="./favicon.ico" type="image/vnd.microsoft.icon">などと記述します(2行とも書くのが望ましいです)。
<link rel="icon" href="./favicon.ico" type="image/vnd.microsoft.icon">- ファビコン画像の作り方は、16*16ピクセルで、画像ソフトで作成したものを、 拡張子だけ「.ico」に変更すればOKです。
- まずはアフィリエイトで紹介するサービスへ登録が必要です。 Amazon Webサービスの利用には別途、登録ID(Subscription ID)の取得が必要です。
- 主にPHPを使って構築しますが、XMLを利用する場合、PHPなしても構築できます。
- 以下に紹介するサイトでプログラムを配布されています。
zerosp.blog
Web Serviceカテゴリで、Amazon Webサービス4.0のXSLTテンプレキットの配布など。Amazonくん
XOOPSのモジュールです。
- <pre>タグは、スペースや改行をそのまま表示できる便利なタグですが、 ブラウザの横幅に合わせて自動改行してくれません。
- スタイルシートで以下のように記述することで自動改行してくれるようになります。
pre{ white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; white-space: pre-wrap; word-wrap: break-word; }
- サイト移転などでURLが変更になった場合、 古いページから新しいページへ自動的に移動させることができます。 HTTPリダイレクトが方法で、2種類のステータスコード301と302があります。 「301 Moved Permanently」はページが完全に引っ越したこと、 「302 Moved Temporarily」はページが一時的に別の場所にあるという意味があります。 301の場合、検索エンジンもサイトが移転したことを認識してくれます。
- .htaccessで301リダイレクトする方法。
redirect 301 /index.html http://www.newdomein.com- PHPで301リダイレクトする方法。
<?php header( "HTTP/1.1 301 Moved Permanently" ); header( "Location: http://www.newdomein.com" ); ?>- HTMLの<head>中に以下のタグを記述します。contentに秒数を指定します。0に指定することで、検索エンジンは301リダイレクトと判断してくれます。
<meta http-equiv="Refresh" content="0, http://ad.lemon-s.com/">
- 検索エンジンなどから、単ページに直接アクセスされることが多々あります。 なので、最初からフレームが外れた状態も想定してページレイアウトをしましょう。
- フレームページの<noframes>には、よく「フレーム対応ブラウザでご覧ください」と 書いてありますが、検索エンジンでもそれが表示されるので、何のサイトか分かりません。 <noframes>にはメインページと同じ内容(サイト説明や各ページへのリンク)を書きましょう。
- .htaccessファイルを利用して、index.htmlやindex.phpなどの表示順位を指定することができます。 以下のように記述して対象ディレクトリにアップロードします。
DirectoryIndex index.html index.shtml index.php
- このページ上部にように、ページ内にリンクを設定してジャンプすることができます。
- リンク先に<a name="a">と記述します。
- リンク元に<a href="#a">と記述します。
- XHTMLでは<a id="a">が推奨されます。
- #直後の文字列は半角英字で、数字は推奨されません。
- マウスカーソルが通過した時の装飾であるa:hoverをCSSで指定したとき、 ページ内リンクをする方法でa要素にname属性などをつけている場合、 Firefoxではhref属性もname属性も同じように装飾されてしまいます。
- 区別したい場合は、CSSのセレクタを利用します。
a[name]:hover { color:#000000; }
- サイトが表示されませんを確認してください。
- サーバはCGI(Perl)に対応していますか?
- サーバの指定するフォルダにアップロードしていますか? 「cgi-bin」など指定のフォルダがある場合があります。
- FTPソフトでパーミッションを設定していますか? 「705」や「755」など、サーバが指定するパーミッションに設定してください。
- Perlのパスは合っていますか? 「/usr/local/bin/perl」や「/usr/bin/perl」など、サーバが指定するパスに設定してください。
- サイトが表示されませんを確認してください。
- サーバはPHPに対応していますか?
- HTMLに埋め込んだ場合、拡張子「.html」だと動作しないサーバもあります。
- PHP5の場合、動作しなかったり特殊な設置方法があるサーバもあります。
- PEARパッケージを利用する場合、サーバが対応しているか確認してみてください。
- php.iniの設定が確認できる場合、しっかり確認してみてください。
- IPアドレスやホスト名を判別してアクセス制限をすることができます。
- IPアドレスの取得は「REMOTE_ADDR」、ホスト名の取得は「REMOTE_HOST」です。
- Perlでのアクセス制限方法。
@host = ("0.0.0.0","0.0.0.1","0.0.0.2"); foreach(@host){ if($ENV{'REMOTE_ADDR'} =~ /$_/){$match=1;last;} } if($match){ print "Content-type: text/html\n\n"; print "アクセスできません"; exit; }- PHPでのアクセス制限方法。
$host = array("0.0.0.0","0.0.0.1","0.0.0.2"); $host = gethostbyaddr($_SERVER["REMOTE_ADDR"]); foreach($no_host as $value){ if(eregi($value,$host)){ header("Content-type: text/html; charset=Shift_JIS"); die("アクセスできません"); } }
- 文字化けしてしまいますを確認してください。
- 「表示」が「侮ヲ」になるなど、特定の文字だけが文字化けしている場合、Shift_JIS問題によるものです。 「表\示」のように、円記号を追加すると解決します。
- ファイルの文字コードをEUC-JPにするとこの問題は起こりません。
2バイト目が5C等に成りうることによる問題
- Perlの文字コード変換ライブラリ「jcode.pl」ではUTF-8を扱えません。
- Perlモジュール「Jcode.pm」を使用します。モジュールの使用(インストール)には対応するサーバが必要です。
Jcode.pm
- Perl 5.8.x以降では文字コードの相互変換が標準モジュールになっています。
- Perl 5.0xで、モジュールも使用できない場合は、変換スクリプトがあります。
シフトJISコードからUTF-8コードに変換するスクリプト
- header関数やsetcookie関数より先にヘッダが出力される場合です。
- 上記関数より前にecho関数やHTMLがあると先にヘッダが出力されるのでエラーになります。require関数で呼び出す場合も同様です。
- exif_read_data()関数で、JPEGかTIFF画像のExifヘッダを読み込むことができます。
- $exif['IFD0']['Make']などとして出力できます。
- 管理画面でモジュールのアップデートをしてください。
- キャッシュを有効に設定している場合、キャッシュを消去をしてください。
- 通常のサイトはサクサク表示されるのに、XOOPSを利用したサイトの表示速度が遅い場合は、 データベースが重たいことが考えられます。
- サーバのデータベースの性能によるものが大きいです。引越しをご検討ください。
- 管理画面でキャッシュ機能を有効に設定すると、アクセスのたびにデータベースへ接続することがないので、 静的ページの表示速度は速くなります(根本的な解決にはなりません)。
- 「XOOPS」と「XOOPS Cube」は似ていますが全く別物です。
- 現在日本の公式サイトでは「XOOPS Cube Legacy」が配布されています。
- XOOPS2JP系からアップデートすることはできます。
- モジュールの互換性は以下のサイトで確認できます。
XOOPS Cube Legacy モジュール一般の互換性情報
- phpMyAdminを使うと新たにXOOPSをインストールする必要がありません。 phpMyAdminでデータベース(全てのテーブル)のエクスポートファイルをダウンロードします。 ※容量が大きすぎてエラーになる場合は「構造だけ」ダウンロードします。
- phpMyAdminで新データベースサーバにファイルをインポートします。
- 旧サーバのファイルを全てFTPでダウンロードします。
- ルートフォルダにあるmainfile.phpを新サーバの設定に編集します。
- 新サーバに全てのファイルをFTPでアップロードして完了です。 ※「構造だけ」にした場合、この後 XOOPSサイトをサーバ移転するにはAの 「BackPack」モジュールでバックアップとリストアの手順をします。
- 擬似的には簡単に表示できます。 このサンプルは、あらかじめ決めておいたタグをランダムにサイズ変更するだけです。
- 検索ログなどを外部ファイルに記録して、それを読み込めば、それらしくなると思います。
- ブロック管理でコンテンツに以下のように記述し、コンテンツのタイプをPHPスクリプトに設定します。
$tag = array('キーワード1', 'キーワード2', 'キーワード3'); shuffle($tag); echo "
"; for($i = 0; $i<30; $i++){ $tagsize = mt_rand(2, 6); $dat.= ''.$tag[$i].' '; } echo "$dat";
- 以下のサイトで紹介されている方法でテンプレートをカスタマイズできます。
XOOPSのリデザイン
- カスタマイズ後、ブロックのタイトルにnoneと入力すると非表示になります。
- 配布されているテーマによってはあらかじめ導入済みのものもあります。
- 以下のサイトで配布されているどこでもコメント(commentAny)モジュールで、 投稿をクリックしなくてもコメントフォームを表示することができます。 exFrameライブラリをモジュールフォルダにアップロードする必要があります。
PEAK XOOPS
SourceForge.JP
- モジュールをインストール後、管理画面のガイドに従って設定します。
- MT4のファイルをアップロードするフォルダはサイトのURLと異なる必要があります。 専用のフォルダを作成してアップロードし、インストールしてください。
- サーバでマルチドメインを設定していると正常に表示されない場合があります。
- プラグインを使用してカテゴリーの並べ替えができます。
カテゴリーとフォルダを並べ替えるプラグイン(MT4以降用)
- サイトが表示されませんを確認してください。
- HTMLにFlash swfファイルの呼び出しタグは適切に記述されていますか?HTMLファイルもパブリッシュして確認してください。
- Flash Playerのバージョンは最新ですか?バージョンアップを確認してください。
- ムービークリップなどを重ねて配置している場合、下にあるボタンにマウスが反応して指マークになってしまいます。
- 透明のムービークリップを最上部に配置して、アクションに「MovieClip.useHandCursor = false;」を指定してください。
- 保存する際に、上書き保存ではなく、別名で保存(同じ名前でもOK)にすると小さくなることがあります。
- サイトが表示されませんを確認してください。
- 画像のファイル形式は何ですか? ブラウザが対応している形式(JPEGやGIF)にしてください。
- 画像ファイルが大きすぎませんか? 何十、何百MBとかだと大きすぎます。 サーバ容量を超過しているかもしれません。
- 他のサーバにある画像ですか?サーバによっては別サーバから呼び出すことができません。
- ブラウザで画像を表示しない設定になっていませんか?
- <img src="aaa.jpg" border="0">と指定してください。
- スタイルシートでも指定できます。
img{ border-style:none; }
- <img src="aaa.jpg" hspace="10" vspace="10">などと指定してください。 hspaceで横、vspaceで縦の余白をピクセル単位で指定できます。
- スタイルシートでも指定できます。
img{ margin:10px; }
- バナー(banner)とはウェブサイトのロゴのような画像のことです。 アフィリエイトの広告用としても利用されますが、 ここではリンク用のバナーについて紹介します。 サイトにリンクを貼るときにバナーを使うことがよくあります。
- 他サイトのバナーを使ってリンクを貼るとき、バナーを保存して自分のサーバへ アップロードする方法と、他サイトにあるバナーを呼び出す方法があります。 リンク先サイトの意向に従いましょう。また、サーバによっては呼び出す方法ができないこともあります。
- バナーは画像ソフトなどを使って作ります。 主に以下の3種類の大きさがあります。
200*40ピクセル
88*31ピクセル
31*31ピクセル
- テーブルなどを使用しなくても簡単に、 このページ上部のロゴ画像と横の文字のように、 画像の横に文字を表示することができます。
- <img>タグにalign要素を指定します。
<img src="aaa.jpg" align="left">
上のタグでは画像が左側に表示され、文字はその右側から回り込んで表示されます。 以下のタグで回り込みを終了できます。
<br clear="all">
- まず、サイトで画像を表示している限り、 スクリーンショット(バソコンの画面をそのまま画像として保存する機能)などで 画像をコピーされることは防ぎようがありません。
- Flashで表示すると右クリックで簡単に保存されることは防ぐことができます。
- スタイルシートでも以下のように記述すると、 右クリックで簡単に保存されることは防ぐことができます。 ダミーの画像(1*1ピクセルで透過)を用意して、その後ろに本当の画像を表示する方法です。 ソースを見られるとバレます。
<img src="./img/dummy.gif" width="425" height="60" style="background-image: url(./img/logo.gif);background-repeat:no-repeat;width:425px;height:60px;">
- JavaScriptを利用して簡単に表示できます。拡張子「.js」の外部ファイルに以下のように記述して、 HTML内の表示させたい部分に<script language="JavaScript" src="random.js"></script>と記述します。
var ad = new Array(); ad[ad.length]=''; ad[ad.length]=''; document.write(ad[Math.floor(Math.random() * ad.length)]);
- JavaScriptのライブラリを利用して簡単に動的に表示できます。 無料で利用できるものが色々あり、スライドショーができるものもあります。
- 呼び出すファイルには、DOCTYPE宣言などをちゃんと記述していないと正常に動作しない場合があります。 また、XHTMLによる記述が推奨されます。
Lightbox JS
Creative Commons Attributionで配布されるライブラリです。ダウンロードしたファイルを全てアップロードし、以下のように記述します。Highslide JS
Creative Commons Attributionで配布されるライブラリです。ダウンロードしたファイルを全てアップロードし、以下のように記述します。Slimbox
MIT Licenseで配布されるライブラリです。同じくMIT Licenseで配布されるmootoolsを併用します。Slimboxとmootoolsをダウンロード、アップロードし、以下のように記述します。サンプル
- 携帯で画像のコピーや転送をできなくすることができます。
- 画像の冒頭にコメントを挿入します。
- ドコモ用
copy="NO"
- au用
kddi_copyright=on
- 両方対応
copy="NO",kddi_copyright=onMulti Comment Editor
- 基本的には無視が一番です。掲示板上では余計なやり取りは行わないようにしましょう。 注意などをすればするほど余計に荒らしを煽ってしまいますし、 他の利用者も巻き込んでしまうかもしれません。 注意するなら、メールアドレスの入力を必須にしたりメール認証をしておき、メールで注意をする方が効果的です。
- 悪質な場合は、IPアドレス入りのログなどを添付して、プロバイダへ連絡して注意をしてもらいましょう。 IPアドレスなどをWhoisで検索すればプロバイダなどの情報を表示できます。
Whois
- 同一人物から荒らしが繰り返される場合は、IPアドレスやホスト名を指定してアクセス制限をしましょう。
- レンタル掲示板ではアクセス制限などの機能がない場合もあります。 できるだけ荒らし対策機能がある掲示板スクリプトを利用しましょう。
- 荒らしは、IPアドレスを隠ぺいできるプロキシ(proxy server、プロクシ、串)を使うことが多いです。 プロキシ特有の環境変数を送信するものをアクセス制限したり、 「proxy」が含まれるホストなどをアクセス制限しましょう。 ただし、プロキシを利用した悪意のない閲覧者も制限されます。
- アクセス制限には、CGIを利用してアクセス制限をする方法、 .htaccessを利用してIPアドレスによるアクセス制限をする方法、 .htaccessを利用してパスワードによるアクセス制限をする方法を参考にしてください。
- 管理画面でキャッシュの消去をしてください。
- iPhoneまたはiPod touch対応サイトの作り方は、携帯サイトより簡単です。 iPhoneは始めからPC向けのサイトを表示する能力があります。
- ただ、そのときに自動的に縮小表示されるので、ピッタリの大きさで表示させるには、 htmlの<head>タグの中で、viewportに任意のサイズを指定します。
<meta name="viewport" content="width=320">
width:横幅を200~10000で指定します。
height:縦幅を223から10000で指定します。
initial-scale:スケール値。minimum-scaleとmaximum-scaleで指定します。
user-scalable:ユーザのズーム動作をyesかnoで指定します。
minimum-scale:ズームスケール最小倍率を0~10で指定します。
maximum-scale:ズームスケール最大倍率を0~10で指定します。
- 「ホーム画面に追加」したときのアイコンを設定できます。
- 57×57ピクセル(または129ピクセル)のPNG画像を用意します。 角を丸くしたりする必要はありません。
<link rel="apple-touch-icon" href="iphone-icon.png">
- .htaccessファイルを利用してアクセス制限をすることができます。 設置したディレクトリ以下全てのファイル(HTMLやCGI)を対象にできます。 サーバが.htaccessファイルの設置を許可している必要があります。
- 以下のように記述した.htaccessを設置します。※ネットマスク(スラッシュ以降の数字)の指定が必要です。
order allow,deny allow from all deny from 0.0.0.0/1 deny from 0.0.0.0/2ネットマスク変換スクリプト
ネットマスクが分かります。
- .htaccessファイルを利用してアクセス制限(Basic認証)をすることができます。 設置したディレクトリ以下全てのファイル(HTMLやCGI)を対象にできます。 サーバが.htaccessファイルの設置を許可している必要があります。
- 以下のように記述した.htaccessと、IDとパスワードを記述した.htpasswdを設置します。
AuthUserFile /home/hogehoge/.htpasswd
AuthGroupFile /dev/null
AuthName "Please enter your ID and password"
AuthType Basic
require valid-user.htaccess活用法
詳しい解説はこちらをご覧ください。