すべてのカテゴリ

ご覧いただきありがとうございます。初心者にも親切丁寧なWEBデザイナーmore design officeの樹下です。素敵なデザイン、素晴らしい文章。それらが揃っていても、サイトが開くまでに時間がかかってしまったら……お客様は画面が表示されるのを待たずに、そっとページを閉じてしまいます。現代のネットユーザーは非常に多忙です。表示速度の遅延は、そのまま「お客様の離脱」に直結します。今日は、お客様にストレスを与えず、サクサク快適に閲覧してもらうための「サイト軽量化」について解説します。1. 「表示速度」が信頼を生む外出先や電波の弱い場所でサイトを開くお客様にとって、読み込みが遅いサイトは「不親切なサイト」と映ってしまいます。Googleの調査では、読み込みに3秒以上かかると半数以上のユーザーが離脱するというデータもあります。表示速度を速くすることは、単なる技術的な話ではなく、お客様の貴重な時間を大切にするという「最大のおもてなし」なのです。イメージ画像： 読み込みが遅く画面が表示されないと離脱に繋がる2. 「画像のサイズ調整」が軽量化の最大の鍵サイトが重くなる最大の原因は、「写真・画像のファイルサイズ」です。スマホで撮った綺麗な写真をそのまま載せていませんか？デジカメの高画質な画像は、WEBで表示するには大きすぎることがほとんどです。・適切なサイズにリサイズ・圧縮ツールで画質を落とさず容量を削る・次世代形式（WebPなど）を活用するこれらを行うだけで、サイトの軽さは劇的に変わります。プロの制作現場では、1枚1枚の画像を丁寧に最適化しています。イメージ画像： 最適化したファイル形式を

PagespeedInsightsやGTMetrixの表示速度スコアはオールグリーンにしておく必要はありません。表示速度が早い方が快適なのは事実ですが、表示速度3秒と1秒ではユーザーの体感で、さほど操作に差は出ません。画面が切り替わって、画面が表示されてから操作できるようになるまでに3秒から5秒あれば十分快適です。問題なのは、画面が全く切り替わらない、画面が切り替わっても3呼吸以上何も変わらなず真っ白な場合です。TwitterやInstagramから外部のサイトに遷移する場合、プラットフォーム側のアナリティクスやリダイレクトがあり表示がめちゃくちゃ遅い事が多いですが、アレと同じ状態は完全にNGです。　サイトにAdsを載せている場合はどうがんばってもJavascriptの分スコアが下がり、大きい画像を載せないといけないデザイン系のサイトでは画像のために表示速度スコアは下がります。そのサイトの目的を満たすために表示速度スコアが下がっている分にはさほど心配はいりません。　しかし、記事がメインのページなのに使っていないreCAPTCHAと関係ないYouTube埋め込みとAdsenseによる遅延、さらに画像サイズがムダにでかい横幅1200pxのままでPNGのカラフルな画像で…（ブログエリアのカラム幅が横幅800pxなのに）となると、この場合は改善すべきことが多くあります。ひとまずは完全オールグリーンを目指すのではなく、ユーザーが不快にならないような表示速度を維持できるようにしましょう。Adsenseも遅延表示させる方法はあるようですが、規約違反になれば収益取り消しになる上に、ちょっとした

クライアントから「ここにアニメーションを入れたい」と言われたとき、つい「素敵だから」とそのまま採用していませんか？でも、気づかないうちにページ表示が遅くなったり、ユーザー体験が損なわれたりすることがあります。この記事では、アニメーションを使う前に知っておきたい落とし穴や判断のポイント、クライアントへの上手な説明方法までをわかりやすくお話しします。1. そのアニメーション、本当に必要？（１）「アニメーションを入れておけば喜ばれる」と思っていたLP制作の打ち合わせで、クライアントが誇らしげに参考サイトを見せてくる。「ここのアニメーション、すごく良くないですか？こんな感じで動かしたいんです。」その瞬間「たぶんできます！」と答えて、そのまま仕様に落とし込んでしまったこと、ありませんか？実装に問題があるわけではなく、むしろ「再現できるかどうか」はコーダーがなんとかしてくれたりします。でも、本当の問題はそこじゃないんです。（２）納品直前、クライアントの不満が一気に押し寄せる制作も終盤に差し掛かり、動作もそれっぽく仕上がった。「これなら喜んでもらえそう！」と安心したのもつかの間。クライアントがチェックしてこう言われることがあります。「なんか表示が遅いんだけど…」「スマホだと全然開かないんですが」「一瞬だけガクッとずれるのは仕様ですか？」「PSIが30点台なんですけど…広告審査これ通らないと言われてます」この瞬間、“アニメーションを入れれば喜ばれる”という前提が音を立てて崩れていきます。アニメーションの操作性・表示速度・広告審査への影響…。デザイナーさんが最初に想定していなかった領域のトラブル

DNS（Domain Name System）とは簡単に言うと、自身の端末のIPアドレスを数字の羅列から人間にもわかりやすいドメイン名というものに変換する仕組みの事。 詳細説明は省くが、インターネット上の電話帳のようなものと考えてもらえれば良い。 通常は契約しているプロバイダから自動的に割り当てられるが、住んでいる場所などの環境にも左右され、応答速度が遅い場合がある。 この設定を変えることによってネットの表示速度が劇的に改善する可能性があるという話。 プロバイダが経営しているDNSサービスは当然品質などにも気を配っているが、さほどコストがかけられていないのが現実。 世界一応答速度が速いのがcloudflareというサービス。次点がGoogle。 DNSの設定をこの2つのうちどちらかにすることでネットの応答速度が改善する可能性がある。 今回は世界最速であるcloudflareの設定方法まずはWindowsの設定方法。コントロールパネルを開き、ネットワークとインターネットを選択。次にネットワークの状態とタスクの表示。そして今繋がっているネット回線のIDをクリック。 恐らく大部分の人はIPv4を使っているかと思うのでこちらをダブルクリック。IPv6を使っている人はそちらも。通常は自動取得になっている部分に指定を加える。 cloudflareを使う場合は以下のように入力。 優先：1.1.1.1 代替：1.0.0.1 以上の設定を行い、okを押す。これだけ。 ではiphoneは？ 設定からWi-Fiを選択し、接続しているWi-Fiの右端、iマークをタップ。画面下の方に移動してDNSを構成

【この記事で解決する悩み】・ウェブサイトの表示速度が重要な理由・表示速度が遅くなる原因・適切な表示速度へ改善する方法この記事で紹介している内容は下記のサービスで対応しています。今回は、ウェブサイトの表示速度を改善する重要性と、表示速度が遅くなる原因と解決方法について詳しく解説します。ページ表示速度が5秒以上の場合64.5%がストレスを感じている通信大手のBIGLOBEが2024年に発表した調査結果によると3割以上の人が「ページが表示されるまで5秒以上かかるとストレスと感じる」と回答しています。最低でも5秒以内・理想は3秒以内、ページが表示されるまでに10秒以上になると至急対応が必要です。表示速度の確認方法サイトの表示速度はパソコンやスマートフォンで実際にページを開いて確認することも重要ですが、Page Speed Insightsで計測する方法がおすすめです。PageSpeed Insightsは、Googleが提供する無料のツールです。ウェブサイトのURLを入力するだけで、表示速度やパフォーマンスを分析し、改善点を指摘してくれます。パソコンとスマートフォンそれぞれの環境でのページ表示速度や、改善点を把握することができます。1. 表示速度改善の重要性ウェブサイトの表示速度は、ユーザー体験に大きく影響します。簡単にまとめると「ページがなかなか表示されないと待ちきれずに他のサイトへ移動してしまう。」という事態になります。頑張って作成したウェブサイトやブログにアクセスしてくれたのに、ページの中身を見らないのは非常にもったいないですよね。また、2018年ごろからGoogleはスマホでの

最近の調査によると、多くのユーザーがWebサイトやアプリを使用する際に、表示速度の遅さによって離脱することがわかりました。 約7割が表示速度の遅さを理由にサイトを離れ、さらに約5割が購買を断念したとのことです。 これは特にデジタルネイティブ世代に顕著で、69.5％が「ページ表示速度遅」に不満を感じていると回答しています。 表示速度が遅いと、ユーザーはストレスを感じ、最終的にはそのサイトやアプリを使うことを諦めてしまいます。 この調査結果は、私たちプログラマーにとって非常に考えさせられる内容です。 私たちが開発する際、性能を最優先にすべきであり、ユーザーの体験を向上させるためにどれだけ努力できるかが重要です。 現在のインターネット時代において、少しでも表示に時間がかかると他の選択肢に目が行ってしまうため、いかにスピードを最大化するかは、ユーザー維持や収益化に直結します。 それゆえ、開発時にはコーディングの効率性やサーバーのレスポンス時間など、細部まで注意を払う必要があります。 この結果から見えてくることは、私たちプログラマーの責任の重さであり、常に進化を目指さなければならないということです。