🥇

【Shopify.dev和訳】Themes/Best practices/Overview

2021/09/18に公開約4,400字

この記事について

この記事は、Themes/Best practices/Overviewの記事を和訳したものです。

記事内で使用する画像は、公式ドキュメント内の画像を引用して使用させていただいております。

Shopify アプリのご紹介

Shopify アプリである、「商品ページ発売予告アプリ | リテリア Coming Soon」は、商品ページを買えない状態のまま、発売日時の予告をすることができるアプリです。Shopify で Coming Soon 機能を実現することができます。

https://apps.shopify.com/shopify-application-314?locale=ja&from=daniel

Shopify アプリである、「らくらく日本語フォント設定|リテリア Font Picker」は、ノーコードで日本語フォントを使用できるアプリです。日本語フォントを導入することでブランドを演出することができます。

https://apps.shopify.com/font-picker-1?locale=ja&from=daniel

Shopify テーマ構築のためのベストプラクティス

テーマ開発の経験を最適化するために、Shopify は以下のセットを確立しました。

テーマのデザインとコーディング

最適なカスタマーエクスペリエンスを実現し、マーチャントのストアを迅速にアクセスして発見できるようにするためには、多くの要素を考慮する必要があります。Shopify の開発者は、Dawnを構築する際に、最適なテーマを設計・構築するために従うことができる原則とベストプラクティスを特定しました。

  • Templates, sections, and blocks: Shopify のテーマアーキテクチャを使用して、モジュール式でカスタマイズ性の高いテーマを作成し、マーチャントがビジネスの目標を達成できるようにすることができます。テーマテンプレートをセクションやブロックに分割する際の注意点や、テーマコンポーネントの粒度を決定する方法について詳しくご紹介します。

  • Performance: パフォーマンスは、あなたがサポートしているマーチャントの成功と、その顧客の体験にとって重要です。テーマのパフォーマンスを最適化し、テストする方法をご紹介します。

  • Accessibility: テーマのアクセシビリティを向上させ、加盟店やお客様に包括的な体験を提供する方法をご紹介します。

  • Design: 優れたテーマデザインの原則を学び、マーチャントとその顧客の要求を満たすためのテーマデザインの方法を学びます。

https://github.com/Shopify/dawn/

テーマツールとビルドツールの使用

チームの成長に合わせて、開発ツールを使って堅牢なプロセスを構築するために、当社のベストプラクティスを確認することができます。

  • Version control:Shopify テーマへのバージョン管理の適用や、ソースコードとコンパイルされたコードの管理方法について学びます。
  • File transformation: Shopify のテーマを扱う際に、お好みのコード編成戦略やビルドツールを使用したい場合は、以下のベストプラクティスを確認して、テーマファイルに適用できるファイル変換の種類とその利点を理解してください。

テーマ開発の指針

上記のベスト・プラクティスに加えて、テーマ開発における以下の指針を考慮する必要があります。

これらの原則は、一人のマーチャントのためにテーマを作成する場合でも、Shopify テーマストアのために作成する場合でも適用されます。

原則 詳細
パフォーマンスの向上 テーマは、マーチャントとその顧客が最速で最も信頼性の高いオンラインショッピング体験を享受できるよう、パフォーマンスを考慮して構築されるべきです。テーマは、JavaScript の使用を最小限に抑え、ほとんどの機能をモダンでネイティブなウェブブラウザの機能に依存すべきです。
目的を持って作られていること 各テーマのレイアウト、スタイル、機能セットは、特定のマーチャントやマーチャントセグメントに合わせて最適化されていなければなりません。すぐに使えるテーマは、マーチャントのニーズに合わせて最適化されたツールセットを提供します。特化したテーマは、一般的なテーマよりもマーチャントに大きな価値をもたらします。
クラス最高の UX を提供 Shopify ストアの数が増えている中、テーマは業界をリードし、e コマースのユーザーエクスペリエンスのパターンを形成する力を持っています。テーマは、お客様を第一に考え、品質を考慮して設計されるべきです。
モバイルファーストであること オンラインストアのトラフィックの大部分はモバイルで発生しているため、テーマ構築のプロセスにおいて、モバイルデバイス向けのデザインを最優先しなければなりません。
アクセス可能であること 様々なマーチャントやお客様に最高の体験を提供するためには、アクセシビリティのベストプラクティスを考慮してテーマを一から構築する必要があります。
カスタマイズを簡単に マーチャントはテーマを使ってカスタマイズし、潜在的な顧客にブランドを表現します。テーマは、マーチャントがカスタマイズできるように、柔軟で考え抜かれたオプションを備えていなければなりません。また、マーチャントがすぐにストアを立ち上げて商品の販売を開始できるように、管理が簡単でなければなりません。

Shopify アプリのご紹介

Shopify アプリである、「商品ページ発売予告アプリ | リテリア Coming Soon」は、商品ページを買えない状態のまま、発売日時の予告をすることができるアプリです。Shopify で Coming Soon 機能を実現することができます。

https://apps.shopify.com/shopify-application-314?locale=ja&from=daniel

Shopify アプリである、「らくらく日本語フォント設定|リテリア Font Picker」は、ノーコードで日本語フォントを使用できるアプリです。日本語フォントを導入することでブランドを演出することができます。

https://apps.shopify.com/font-picker-1?locale=ja&from=daniel

Discussion

ログインするとコメントできます