ウェブページの表示速度は、離脱率やコンバージョン率にもっとも影響する重要なポイントです。Googleが公表した調査結果では、「表示に3秒以上かかると、約53%のユーザーは離脱する」「表示速度が1秒から6秒に落ちると、直帰率は106%上昇する」というデータが出ているようです。 表示速度を改善する施策は色々とありますが、本記事では「AMPアンプ（Accelerated Mobile Pages）」を作成する際に利用するJavaScriptライブラリーを使って、簡単に表示速度を改善する手法を紹介します。 AMPとはウェブページの読み込みを高速化させる技術 「AMPアンプ（Accelerated Mobile Pages）」とは、名前の通りモバイルでのウェブページの読み込みを高速化させる技術です。 本サイト（ICS MEDIA）では以前「AMPの利点と対応HTMLの作り方」で導入方法を紹介していま

オリジナルカーソルについて 独自の画像をカーソルとして使用することができます。 指定方法 cursor: url(example.cur), text; url( ) … ( ) 内に、カーソルとして使用する画像ファイルを指定します。 オリジナルカーソルが表示できない場合に備え、カンマ（ , ）に続けて任意のキーワード（default や pointer 等）を指定しておきます。（上記の例では text を指定しています） カーソルの候補 cursor: url(example.cur), url(example.gif), auto; 上記のように、カンマ（ , ）で区切って複数のカーソル候補を設定しておくこともできます。この場合、ユーザーの環境で利用できる形式の画像が使用されます。（先に指定したものが優先されます） 対応ブラウザ オリジナルカーソルは、IE 6以上、Firefox、Sa

Chromeなどでイメージマップのリンク部分に青い線が表れます。 これを消すにはareaに対してCSSでclassなどを使用して以下の設定をします。 area{ border:none; outline:none; } IEの古いバージョン対策ではHTMLタグの中に以下の属性を加えます。 onFocus="this.blur();"

みなさんこんにちは！ デザイナーの伊東です。 一生懸命作ったWebサイトがめちゃくちゃ重い！ デザイナー・コーダーのみなさんなら、そんな悩みを一度でもお持ちになったことだと思います。 表示速度が遅いのには、容量の大きい動画を配置していたり、数万pxのボリュームのあるページだったり、様々な理由があると思います。 今回はそんなお悩みを解決する方法の一つとして、「画像の遅延読み込み」という方法をご紹介します。 昔からよく知られた技術ですが、実は「SEOに不向きだ」という意見も数多くありました。 しかしGooglebotの技術向上により、その不安は解消されつつあるようです。 読み込んでいる画像の数が多いサイトの場合、非常に有効な手段だと思いますので、ぜひお試しください。 遅延読み込みとは 遅延読み込みという技術は、Webサイトに表示される画像を一度に読み込まず、必要に応じて必要な分だけ読み込むとい