ツール
PIXLR EDITORのフィルターでできる画像加工のいろいろ
デザイン
デザイン シングルカラムレイアウトで要素幅を指定するなら「max-width」の活用
シングルカラムレイアウトで必須となる要素の中央寄せと、ブロック要素の横幅指定。widthプロパティよりもmax-widthプロパティが有効な方法です。
デザイン 複数のサイトを一つのサイトに統合する作業手順と注意点
同一ジャンルで複数のサイトを運営してきましたが、一つのサイトが突出してきたので、内部回遊率アップによるPV大幅アップを期待して、サイトを統合してコンテンツを集中させることにしました。
デザイン body内にCSSを記述する件と段組レイアウトとinline-blockを検証
ウェブページのデザインはモバイル対応を無視できません。PCでは要素を横並びに配置し、モバイルでは縦配列にする必要があります。「段組」や「inline-block」で作るレイアウト例です。
デザイン URLテキストなど英数文字を自動改行で表示させる方法
URLをテキストで記載するなど、英数文字の長い文字列はブラウザの幅を超えても改行されずにどこまでも続くことがあります。
この原因は“禁則処理”の影響です。
一つの文節が長い場合には、画面の端で自動改行されるようになっているの...
デザイン CSS3で見出しなどのブロック要素をカスタマイズしてみた
CSS3では画像を使わずに視覚的要素に装飾を加えることができます。見出しの文字に影をつけたり背景にグラデーションをつけたり、見出しの枠に影をつけることもできます。コピペで使えるコードを掲載していますので、ご自由に使って下さい。
デザイン モバイルファーストインデックスに対応する為にサイトを見直す
モバイルファーストインデックスは、PCよりもスマホでのWeb閲覧ユーザーが多いことから、サイトの検索順位はスマホで閲覧する場合に、ユーザーが求めているサイトの条件をより多く満たしたサイトを上位にランキングしようということです。
デザイン WPテーマ「simplicity2」でグローバルナビを上部に固定するカスタマイズ
訪問者の回遊率を高める為には、内部リンクを効果的な位置に設置することが大切です。文章中に内部リンクを貼ったり、サイドバーにメニューを表示させたりします。
もうひとつ方法があって、グローバルナビを常に上部に表示させる方法があります。
...
デザイン AMP対応を止めるケースもあるけどAMPページ対応って必要なの
「海外SEO情報ブログ」にAMP対応をやめたとき、Google検索にAMPページを表示させないようにする3つの方法が掲載されました。
AMP対応していたサイトのAMPページを削除して、検索結果に表示させない方法を解説しているの...
デザイン PWA対応のウェブ開発に必要なデベロッパーツールやいろいろ
Googleが進めている“PWA（Progressive Web Apps）”
AMPの対応はすでにこのサイトでも出来て（Simplicityのおかげ）いますが、PWAに対応させる必要が将来出てくるのかまったく分かりません。
...
デザイン ページの表示速度を早める対策をやってみた結果
スマートフォンからのアクセスが半分以上になって、ページの表示速度がますます重要になっています。遅いページは速攻直帰になってしまいます。
直帰率を低くするために画像の多いページの改善をやってみました。
まず現在のページ速度を把...