デザイン

シングルカラムレイアウトで必須となる要素の中央寄せと、ブロック要素の横幅指定。widthプロパティよりもmax-widthプロパティが有効な方法です。

同一ジャンルで複数のサイトを運営してきましたが、一つのサイトが突出してきたので、内部回遊率アップによるPV大幅アップを期待して、サイトを統合してコンテンツを集中させることにしました。

ウェブページのデザインはモバイル対応を無視できません。PCでは要素を横並びに配置し、モバイルでは縦配列にする必要があります。「段組」や「inline-block」で作るレイアウト例です。

URLをテキストで記載するなど、英数文字の長い文字列はブラウザの幅を超えても改行されずにどこまでも続くことがあります。 この原因は“禁則処理”の影響です。 一つの文節が長い場合には、画面の端で自動改行されるようになっているの...

CSS3では画像を使わずに視覚的要素に装飾を加えることができます。見出しの文字に影をつけたり背景にグラデーションをつけたり、見出しの枠に影をつけることもできます。コピペで使えるコードを掲載していますので、ご自由に使って下さい。

モバイルファーストインデックスは、PCよりもスマホでのWeb閲覧ユーザーが多いことから、サイトの検索順位はスマホで閲覧する場合に、ユーザーが求めているサイトの条件をより多く満たしたサイトを上位にランキングしようということです。

訪問者の回遊率を高める為には、内部リンクを効果的な位置に設置することが大切です。文章中に内部リンクを貼ったり、サイドバーにメニューを表示させたりします。 もうひとつ方法があって、グローバルナビを常に上部に表示させる方法があります。 ...

「海外SEO情報ブログ」にAMP対応をやめたとき、Google検索にAMPページを表示させないようにする3つの方法が掲載されました。 AMP対応していたサイトのAMPページを削除して、検索結果に表示させない方法を解説しているの...

Googleが進めている“PWA（Progressive Web Apps）” AMPの対応はすでにこのサイトでも出来て（Simplicityのおかげ）いますが、PWAに対応させる必要が将来出てくるのかまったく分かりません。 ...

スマートフォンからのアクセスが半分以上になって、ページの表示速度がますます重要になっています。遅いページは速攻直帰になってしまいます。 直帰率を低くするために画像の多いページの改善をやってみました。 まず現在のページ速度を把...