AEMの運用をスムーズに進めるためのパートナー併走期間のポイント

この記事は[2019/10/16]に公開した記事を[2023/01/23]に加筆編集しております。

AEM（Adobe Experience Manager）とは、Adobe社が提供するCMSです。 AEMを導入する理由の一つに、「ページ制作コストの削減」を考えている方も多いのではないでしょうか。

導入の目的として、外部委託していたニュースページや製品ページの更新、キャンペーンページの制作などを内製化することで外注費を削減したいといった想いをよく耳にします。しかし、たとえAEMを入れたとしても、制作会社に依頼する比重は軽くなりますが、自社だけですべてのページやコンテンツを制作するのは難しいと考えます。

なぜ自社だけではページ制作が難しいのか

AEMでのページ作成方法は２つあります。

１. テンプレートをそのまま活用（例：ニュース）
２. テンプレートに画像やテキストなどのコンポーネントを追加（例：キャンペーン、製品紹介）

それぞれに必要なスキルがどのようなものかというと、

１. テンプレートをそのまま活用（例：ニュース）
→ テキストを編集することができる → 自社運用◯
　
２. テンプレートに画像やボタンなどのコンポーネントを追加（例：キャンペーン、製品紹介）
→ テキストを編集することができる → 自社運用◯
→ コンポーネントのhtml出力を見てcss,jsに修正を加える事ができる → 自社運用△

つまり、自社内での対応が難しい２の部分に注意する必要があります。例えば、製品紹介ページにおいて、カスタマイズによって各事業紹介ページからタイトルとサムネイルを引用し、３カラムで表示させたいと考えたとします。その場合の対応として、単純にリストコンポーネントを入れてもCSSやJavaScriptがうまく当たらず崩れてしまう場合があるため、CSSやJavaScriptをコンポーネントに対して当て直す必要があります。

変更の度合いによってはテンプレートの作り込みでカバーできると思われがちですが、全てのパターンを事前に作り込んでおくのは、正直難しいでしょう。さらに、修正を加えるCSSやJavaScriptが他のページにも使用されている場合、一つのキャンペーンページのために他のページが崩れることもあり得るので注意が必要です。

AEM運用のためにやっておくべきこと

AEMでのページ作成を制作会社に依頼することを前提として、「制作会社用マニュアル」を準備します。制作会社用マニュアルには、AEMの基本的な使い方、コンポーネントのHTML出力内容、AEM独特のコーディング注意点などを記載しておきます。

更に、HTMLでページを作成する場合とはルールが異なるため、制作会社からは多くの質問が出てくることが予想されます。おそらく、全ての質問に回答するには、コーディングとAEM、両方の知識が必要になります。質問を受けた担当者は、AEMコンポーネント出力の問題なのか、CSS、JavaScript側で解決するべき問題なのかを判断しなければならずハードルが高いと言えるでしょう。

もし導入時にパートナー企業にお願いしている場合は、その併走期間中に、マニュアル準備だけでなくページ制作も開始し、相談できる環境下で運用期の準備をしておくと安心です。

AEM6.2以降で実装されたテンプレートエディタ

AEM6.2以降では、テンプレート作成についてもフロントエンドの知識で実装することができる「テンプレートエディタ」の機能が追加されました。

引用（adobe help）：ページテンプレートの作成
>テンプレート作成者が開発プロジェクトなしにテンプレートを作成して構成できるようになります。
https://helpx.adobe.com/jp/experience-manager/6-3/sites/authoring/using/templates.html

テンプレートエディタを開発者がいない状態で使いこなすには、HTML、CSS、JavaScriptだけではなく、AEMの知識も必要になります。追加で必要になるのは、AEMのエクスペリエンスフラグメントの仕様、CSSやJavaScriptが保存されているDAMの構造、テンプレートエディタの使用方法・仕様に関する知識です。そのため、テンプレートエディタを使う可能性がある場合、上記の情報もマニュアル化しておく必要があります。