Permalink<HEAD>タグ内には、<title>や<meta>、CSSなど様々なタグがありますが、これらの順序はどのように記述すべきでしょうか?まず一番最初に記載すべき要素についてですが、やはり<title>タグが最初と考えてます。大手メディアなどを参照しても一番先は<title>となっているケースが多いですし、一番最初に書くべきは<title>でほぼ間違いはないでしょう。name="keywords"などについては無くても機能しますので、titleタグよりも重要度ははるかに劣るものと感じています。metaキーワードについては、各国の主要な検索エンジンでは利用されているケースもあるかもしれませんが、Googleについては既に意味はなくなっているため、記載してもあまりメリットはないかもしれません。descriptionについては、serpで表示された際の使い方がメインになりますし、インデックスが更新されるまでは検索結果では反映されないため、今すぐ直ちに必要なわけでもないはずです。気をつけるべきはJavascriptですが、先頭の方にこれを書いておくとそこで読み込みが止まるため、できるだけ後の方に持っておくのが一般的かと思います。CSSについては同時に並行して読み込まれますが、ダウンロードするまではレンダリングが始まらないため、今すぐ必要な緊急性という面で考えると、descriptionやkeywordよりも先にCSSを記載すべきとも感じています。name="viewport"の方を先に記載すべきかもしれません。そのため、個人的にはtitle→viewport→preload→CSS→description→keywordの順番でもありかと思います。この「titleとdescription、keyword」の3つについては、昔からセットで記載されてきましたので、「title、description、keywordの3セット」→「viewport、CSS」といった順で記載するのがぶなんかもしれません。次に、OGPタグを記載するのもデファクトスタンダードとなりつつありますが、こちらも今すぐその場で必要というわけでもありません。シェアされてからタイムラインで表示されるのに数秒遅れるぐらいでは何の影響もないでしょうし、そもそもシェアされるかどうかも分からないため、OGPタグについては一番最後に記載しておけばよいでしょう。rel="canonical"」については、OGPタグより前に記載するべきかと思います。media="handheld"と続けてまとめて記載するのがスマートかもしれません。まとめますと、「title、description、keyword」→「viewport、CSS」→「canonical、amphtml、handheld」→「OGP関連のタグ」→「Javascript関連」といった順序がよいのではないかと考えてます。rel="icon"ですが、ChromeデベロッパーツールのPerformanceで確認する限り、こちらはonload後の読み込みとなっていたため、レンダリングや読み込みが完了した後で参照されるものと感じています。アイコン画像はブラウザのタブなどにも表示されるため、その場で直ちに必要ではあるものの、CSSほどの緊急性はないのかもしれません。そのため、CSSの後でカノニカル正規化タグの前あたりがぶなんかなと感じています。Permalink当サイト運営者の場合、サイトのダウンロードサイズは広告関連でのスクリプトの負担が転送量の大部分を占めています。アドセンス広告の読み込みの容量が大きく、概ね数百KB程度となっている傾向があります。ひと昔前なら画像が主な負担になっていましたが、最近は画像よりも広告関連のスクリプトの負担の方が大きいです。ヤフーのトップページをチェックしてみますと以下のようになっていました。合計で約1MB(1,000KB)程度のダウンロードサイズですが、すべての合計サイズは概ね1,000KB程度に抑えるべきと考えています。この1,000KBのうち、どの程度までをWEBフォントに使えるのかでいえば、当サイト運営者の場合は300KB以内までと決めています。WEBフォントは外部サービスからダウンロードするのだから、除外してもいい気もしますが、WEBフォントもサイトのサイトの転送量には入ります。「バナナはおやつに入りますか?」みたいな議論になってしまいますが、訪問者にとって、それがサードパーティーのものであるか、そのサーバーからの配信であるかは関係なく、実際にかかる転送量が問題になります。その点、なかにはWEBフォントのみで1MB程度、すべての合計で3MB以上を使用しているケースもありますが、これはモバイル環境のユーザーにとって負担になるはずです。理想としては、WEBフォントのサブセット化で300KB程度におさえ、画像を300KB程度使用し、その他の広告やテキスト、CSSもろもろで200KB、合計で800KB程度のサイトに抑えるのがベストではないかと考えています。PermalinkPCサイトの場合、シェア的にはWindowsユーザーが多いため、私はデフォルトのメイリオではなく「Notoフォント」を使用することが多いです。W3」を使うことができます。この「Noto」と「ヒラギノ」を天秤にかけた場合、フォントの美しさという点では互角か、もしくはわずかに「ヒラギノ」に軍配が上がると感じています。そのため、あえて転送量が大きくなるWEBフォントの「Noto」をモバイル端末向けに使用する必要性はないと考えており、モバイル端末ではWEBフォントを無効にしています。大手サイトを閲覧しても、おおむねWEBフォントは使用されていないことが多く、基本的にはメイリオが使用されています。個人サイト等でWEBフォントを使用しているケースも多いですが、それがかえって読みにくくなっているのではないかと感じることもあります。そのため、個人的にはサイトでWEBフォントを使用する必要はないと感じており、モバイルサイトでは上記の理由でなおさらないと考えてますが、もし使用するなら、PCサイトでのみ表示されるようにするとよいでしょう。(min-width:480px)">などと指定して、PCサイトでのみ読み込む形にすると最適化できると思います。施行されますが、これに伴い、ウェブサイトのプライバシーポリシーを改訂する必要が出てきます。なかでも特に、「個人関連情報の第三者提供の制限等」に関する項目がポイントになると思いますが、まずは「個人情報」と「個人関連情報」の違いを確認しておくことをおすすめします。ついては「関連」の文字が付いていますが、IPアドレスやクッキーなど、それ自体では氏名などは分からないものの、アクセス解析などのデータに関連した情報になります。これまで、サイトのIPアドレスなどのアクセスログについては、公的機関が介入しない限り、それ自体では個人を特定することは困難でしたが、外部に提供することにより判明が可能となってしまう事例が出てきました。リクナビの内定辞退率を予測するサービスが問題となりましたが、サイト内での行動パターンなどの情報から、内定を辞退する率を割り出して企業に販売するといった事例がありました。サイト内での行動履歴などのデータについては、個人関連情報になり、それ自体では個人情報にはなりませんが、提供先の企業ではそのユーザーについての個人情報を保有している場合、それを紐づけすることで間接的には誰がどのような行動履歴をとり、過去のパターンから内定辞退率はどのくらいかということが判明してしまいます。提供元では個人データに該当しないとしても、提供先で個人データに該当する場合には、本人の同意が得られていることの確認が義務付けられました。そのため、この点でサイト内のプライバシーポリシーの改訂が必要になってくるものと思われます。Permalink以前、プログラミングの効率的なウェブ学習の方法について、アマゾンのKindle読み放題を利用して学習することをご提案していたのですが、4年が経過した現在では、ChatGptで質問しながら学習するのがベストプラクティスであると考えています。ChatGptは無料でも利用できますが、当サイト運営者は有料版で使用しています。教材で学習する方法と比較しますと、AIで学習する方が学習スピードが飛躍的に向上すると感じています。その理由としまして、プログラミングコードについて、1行1行質問しながら学習することにより、疑問点を全て解消しながら習得できるという違いがあります。これが教材の場合ですと、疑問点の答えが掲載されている箇所を1つ1つ探しながら解消していく必要があるため、非常に時間がかかります。その点、ChatGPTの場合ですと、AIに聞けばその場で答えがすぐに出てくるため、習得にかかるスピードが飛躍的に短縮されるメリットがあるわけです。その都度、分かるまでしつこく質問するということは、対面のプログラミングスクールなどでは憚りがありますし、機械のAIだからこそ、遠慮なく質問することができます。加えて、おそらくは答えの精度や速度も、プログラミングスクールの先生よりも上ではないでしょうか。この点が非常にメリットがあり、今後はおそらく、プログラミングスクールは次々に廃業に追いやられるのではないかと考えています。月20ドル、または無料で、おそらくは数十万円分の価値を享受できるものと感じておりますが、これを利用しない手はないです。ChatGPTの登場により、おそらく、今後の半年間で私たちの社会が劇的に変化していくのではないか、そう考えています。見出しタグのmarginは何pxにすればよいのか?医療関連のホームページで集客するには?WEBスクレイピングのクローラーを一括で拒否ジオシティーズ終了まで残りあと1か月ウェブフォントのサブセット化で表示遅延を改善API(ウェブAPI)とは何なのか?Dreamweaverで「width」と「height」が自動挿入されなくなったPhotoshopを使うにはMacの方がいいのか?ウェブ作成費用をいくらに設定するのか?jQueryの「J」はJavascriptのジェイだJavaScriptと「html+CSS」の違いこのアーカイブについてこのページには、過去に書かれたブログ記事のうちホームページカテゴリに属しているものが含まれています。前のカテゴリはドメインです。次のカテゴリはレンタルサーバです。最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。