コンテンツ8 サムネイル 1×1

contents-8-3840x3840

キャンペーン
割引中

4K(Retina)
レスポンシブ対策

4K(Apple製品はRetina)にデフォルトで対応
2Kは普通サイズ、4Kは普通サイズ縦横2倍の画像、さらにレスポンシブにするという特殊なコーディングを発明(笑)

image2kphoto_size_select_large4k
2k4k

サムネイルは1280px
コンテンツは3840px

コンテンツの画像は、最低3840pxでWordPressが自動的に4Kレスポンシブに
サムネイルは最低1280pxでやはり自動的に4Kレスポンシブになるコーディングを開発

image2kphoto_size_select_large4k
2k4k

今回のテーマは、 サムネイルを中心として画像活用が生命線

2013年9月発売の、当WordPressテーマ(当テーマ)のセールスポイントのまとめ

当テーマのアピールポイント(特筆すべき仕様)は次のとおりです

  1. モバイルファースト
  2. HTML Living Standard & CSS3適応
  3. 疑似スマートフォンアプリ
  4. WebP採用
  5. JSON-LD導入
  6. 4K(Retina)対策
  7. マテリアルデザイン プチ採用
  8. gridレイアウトとflexboxコンテンツ
  9. クラシックなエディターとウィジェット:将来的にはブロックエディター対応予定

モバイルファースト → iPhoneポートレイト ファースト

今回は、モバイルファーストがアピールポイントです
モバイルファーストは、CSS記述やGoogleのクローラー巡回などで盛り上がっていますが、多くのWebデザインでアピールされているのはデスクトップ画面がほとんどです
また、他社のWordPressのテーマ販売サイトでも、デスクトップ画面のスクリーンショットばかりで、じつのところ、スマホ縦画面ではカテゴリートップでも個別ページでも、どれも同じで区別がつきません

ここでは、カテゴリートップでのスマホ縦画面での特異性や差別化、「スマートフォン ポートレイト ファースト」「iPhone縦画面ファースト」と表現したいです

しかも、Webサイト、テンプレート、WordPressテーマなど、これらの作成の歴史はデスクトップオンリーから、スマホにも対応程度のレスポンシブでデスクトップファースト
逆に、デスクトップでも見ることができる、しかもスマートフォン画面と大差ないパソコン画面、というコペルニクス的転回が欲しいところです

iPhone X/11/12/13のノッチとiPhone横画面

些細なことですが、iPhoneのX・11・12・13には「ノッチ」つまり画面の切れ込みがあり、これを素通りしてWebを表示させるために
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
「viewport-fit=cover」をビューポートに設定しています
ところが、このノッチがコンテンツの邪魔になります

そこで、画像などはそのまま、テキストボックスなどの背景はノッチを通り越しながら、paddingを4vwほど右や左に設定して、テキストだけは隠れないようにしています
これは、iPhone横画面セカンドでしょうか(笑)

対策としてのSEO

モバイルファーストは、スマートフォンにも対応しているWebということではなく、HTMLもCSSもスマホ画面で見えるところを第一番にコーディングしてこそ、その名に違わないと言えるでしょう


SEOテンプレート×WordPressテーマサプライズ!

SEOテンプレート×WordPressテーマ 販売サイト

SEOテンプレート×WordPressテーマ 販売サイト

販売サイトは、クレジットカード購入がメインの対応です(Amazon、Microsoftなども採用しているStripeを採用)

Stripeのクレジットカード決済はJCB・VIZA・mastercard・AMEXなど 銀行振込も

銀行振込も加わりました(安全性・信頼性のため Stripe の口座を利用しています)
オンラインからでもATMからでも振り込むとすぐに、マイページでダウンロードできるようになります
また「認証キー」は購入履歴でご確認できます

アバター

author-primary による

Algorism Inc. 株式会社アルゴリズム 代表取締役。SEO塾運営。このサイトは2023年新発売のWordPressテーマのショーケース