WEBデザイン覚え書き

ソクラテツの憂鬱-DigiCon Library-

Planet20xxバナー

PageSpeed Insights

PC(HP)
画像の最適化手順を説明したページへのリンク画像

画像を軽くする最適化はお済みですか?

画像にはいろいろな情報が入っています。ムダな部分を削除して容量を小さくしましょう。

PC(html/Javascript)
スマホでの画像遅延読み込みイメージイラスト

表示スピードアップ!画像遅延読み込み実装

PagespeedInsightのスコア改善に役立つ画像遅延読み込みの実装方法についてわかりやすく解説します

PC(Javascript)
CDNとサーバー読み込みのイメージ画像

CDNとレンタルサーバーのjsファイル読み込み比較

jsファイルを利用できるCDNのパフォーマンスと稼働時間を調べてみました。

PC(html)
preloadで先読みして高速表示する方法へのリンク画像

preloadで先読みして高速表示する方法

サーバーから先行してフェッチすることで、サイトの高速表示を実現します。

PC(html)
DNSプリフェッチでリレーションしているイメージ画像

GoogleAdsense広告を速く表示する

DNSプリフェッチで5つの参照先を事前リレーションするだけで、すばやく表示されます

PC(html/CSS)
ソースコードのハイライト表示のやり方を説明したページへのリンク画像

ソースコードのハイライト表示のやり方

負担が少ない軽量ライブラリを使用して、ハイライト表示する方法を解説。

PC(CSS)
縦スクロール時に横揺れするサイトの修正方法

縦スクロール時に横揺れするサイトの修正方法

縦クロールしたときブレたり横揺れてしまう場合のCSS対処法を解説(スマホタブレット)

PC(CSS)
グーグルアドセンス広告がはみ出す時の修正方法

グーグルアドセンス広告がはみ出す時の修正方法

レスポンシブ広告が横にはみ出すために起こるスマホの横揺れを解消!

Google Amazon

PC(HP)
Googleアナリティクスで特定のIP除外する方法

Googleアナリティクスで特定のIPアドレスを除外する方法

自分アクセスによる訪問カウントを取得しないための設定

PC(HP)
Googleアドセンスを中央に寄らない場合の対処法解説画面

Googleアドセンスが中央に寄らない場合のやり方

デフォルトで画面いっぱいに表示されるアドセンスですが、なぜかセンタリング出来ない場合の対処法を解説します。

PC(html)
アフィリエイトの後ろになぜかある1ピクセル画像を究明するイメージ画像

謎の1ピクセル画像を究明

Amazonアソシエイトコードにあるimgタグの1ピクセル画像をご存知ですか?

PC(html)
Amazonギフト券メールが届かない、削除したかもなバナー画像

Amazonギフト券が届かない

Amazonギフト券メールが来てないかも…、それとも削除しちゃった!?そんな時はあわてず…

PC

PC(Windows)

WindowsでもHelveticaフォントを使いたい

ちょっと似てるArialじゃ満足できない方必見!

Illustrator

手のひらツールのショートカットが効かない!!

イラストレーターやフォトショップでスペースキーを使ったショートカット「手のひらツール」が使えなくなった時の対処法を解説します。

Visual Studio Code
macbookキーボードの写真

Brackets Extension Packでユーザビリティアップ!

使い慣れたBracketsっぽくVS Codeをカスタマイズ。

PC(html)
macbookキーボードの写真

迷惑メール対策にウィジェットを表示

reCAPTCHAv2を導入して迷惑メールを撃退!

PC(Macbook)
macbookキーボードの写真

MacBookを買ったので、Windowsのショートカットキーと比較早見表を作成しました。

TOP