[SharePoint Online] カスタム スクリプトの許可と禁止
[SharePoint Online] メガメニュー&フッター

[SharePoint Online] モダン サイトについての考察

SharePoint Online では昨年からモダン サイトの機能がものすごい勢いで進化しています。

最初はドキュメント ライブラリやリストの機能の拡充から始まり、リストやライブラリの作成方法や設定変更が非常に簡単になりました。PowerAppsや Microsoft Flow との連携機能とともに列の書式やビューの書式も登場し、これらに関してはある程度、必要な機能がそろったこともあり、進化のスピードは落ち着いてきています。

ポータルとしての進化

次の進化の矛先が "ポータル" 機能です。Wikiページに代わるモダンUIのページが「サイトページ」です。サイトページには新しいWebパーツが続々と追加されてきていますし、サイトページのうち "ニュース" としてのフラグが設定されるものを「ニュース」と呼びます。

ニュースは従来の「お知らせ」リストに代わるものです。ニュース記事は、専用の「ニュース Webパーツ」上に裏では検索機能を使いつつ、任意のサイトから複数のニュース記事を集約表示できます。クラシックな SharePoint サイトではお知らせを複数のサイトから取得するのに、検索機能を使えましたが、設定が込み入っていましたし見栄えもいまいちでした。ですから、JavaScriptなどでカスタム 開発することも少なくなかった。しかし、モダンサイトでは標準機能だけで(設定だけで)、見栄えよくニュースを集約表示できます。

たとえば、現在、ニュース Web パーツにはピン留め機能がロールアウトされています。「この記事、しばらくの間、上位に固定しておきたいなぁ」という要望は少なくなく、「お知らせ」リストでもこうしたカスタマイズを工夫していましたが、ピン止め機能は非常に手軽に、しばらく1番目の記事として固定とか 3番目に固定といったことができます。

ニュース Webパーツの詳細は下記のリンク先を参照してください。

SharePoint ページで、ニュース Web パーツを使用する

パーソナライズ機能も下記の通り一部のWebパーツで対応しました。パーソナライズとは、要するにログインユーザーに関連する情報だけを出す設定のことです。

  • 強調表示Webパーツ
  • サイト
  • ニュース

そして現在展開されているのが、「タイトルのカスタマイズ」、「メガメニュー」と「フッター」です。これに関してはのちほどの記事で個別に取り上げます。また「サイトデザインの再適用」、「対象ユーザー」などポータルとしての魅力的な機能が今後、随時ロールアウトされていく予定であり、従来の SharePoint のサイトデザインのカスタマイズを考えると格段に少ない手間で設定できます。

サイトデザインのカスタマイズ

SharePoint は長らく(Microsoft製品にはありがちですが)、ちょっとカスタマイズしようとすると HTMLや CSS, 場合によっては JavaScript を組み込んできました。しかし、こうした作業は最初に開発するだけにとどまらず、長期的な保守も必要であり、昨今のビジネスの状況を考えると「人と時間をそこまでかけなければ、サイトが使えないのか」という問題をはらんでいたことも事実です。

モダンサイトのコンセプトは「コンテンツありき」です。コンテンツにはビジュアルで訴える "画像" も重要になっています。全体的なデザインは、豊富な Web パーツをうまく配置していくだけで見栄えよく整えてくれます。HTMLや CSS の知識は不要であり操作も難しくないため、ユーザー自身が素早くポータルを作成できます。

従来格闘してきたマスターページはモダンサイトではもう利用しません。それもあって、弊社で長らく実施してきて人気でもあった「SharePoint サイトデザインカスタマイズの基礎」のコースも、内容がマスターページのカスタマイズが題材であったため、コンサルタントとしての観点からも顧客に対して積極的に進めていくべきではないと考え、現在は定期コースから外し、1社向け研修でのみの開催に限定している状況です。

2019年4月よりリストやライブラリはモダンモード優先 

ちなみに、ご存知の方も多いと思いますが、2019年4月以降、リストやライブラリはモダンモードが優先されるように変更されます。モダンモードのアドバンテージを考えると当然の戦略だろうと思います。詳しくは下記のリンク先を参照してください。

⇒Delivering SharePoint modern experiences

そもそもモダンサイトって何? 利点は?

モダンサイトとは「チームサイト」や「コミュニケーション」サイトテンプレートから作成するサイトのことです。とはいえ、クラシックのSharePointサイトをモダンに変えていくことも可能ですから、これもモダンサイトです。端的に言えばモダンサイトは次のような特徴があります。

  • HTML5 に準拠
  • レスポンシブWebデザイン
  • モバイルを意識
  • リボンメニューではなくコマンドバー
  • クライアント側の処理が圧倒的に多くなり、操作性が上がっている

SharePoint の歴史から見るモダンサイト

そもそも従来の SharePoint サイトは SharePoint 2007 の流れを汲み、当時の主流だった Internet Explorer 6 ころの仕組みをいまだ結構使っています。つまり、10年以上前の仕組みを使い続けているのです。ですが、インターネットの進化は目覚ましいものがあります。随分前からインターネット上ではHTML5が主流であり、魅力的な最新機能が多く登場しています。しかし、クラシックな SharePoint サイトは HTML4 がベースであり、そういう意味でも世代が古い。少し前まではSharePoint 上のサイトを商用サイトとしてインターネットに公開しようという動きもあったのですが、こうアーキテクチャーが古いと最早、使えません。それくらい陳腐化していっているのです。以前、海外の方が Twitter でつぶやいていましたが、「SharePoint は古いまま寝かしていてもブランディ―のようには熟成しない。新しいものに限る」というようなことを書かれていました。尤もな意見だと思います。

全面的に HTML5 を取り入れていくなら大幅に刷新したい。と、おそらく、そうした意図で生まれたのがモダンサイトです。家に例えてみれば、時代の流れに応じて、ちょっとしたリフォームではなく、新築のように全体的に作り変えるというイメージですね(某人気番組のように)。ちなみに HTML5 がメインとなるため、相性がよいのは Edge か Chrome です。Internet Explorer を使っている組織も多いと思いますが、弊社のお客様は8割りほどが「IE と Chrome」のデュアルスタンダードだったり、Windows 10 が展開されている組織では Edge か IE といったように IE しか利用できないという縛りにしている組織はかなり減ってきている印象です(もっとも、Microsoft 社も IE はなるべく早く Edge に移行して欲しいのでしょうし。Microsoft 独自路線だった時代の産物で、時代は変わりました)。

Webブラウザーも進化し、昔とは比べ物にならないくらい JavaScript エンジンも性能が上がっています。これまで SharePoint は 2007年ごろ流行だったサーバーサイド処理を用いていろいろなことを行っていました。そのため、何かボタンをクリックしたりすると、画面が遷移することが多かったわけです。サーバーにいちいち問い合わせるためです。しかし、現在のWebの世界はクライアント側で処理して操作性をよくするのが主流です。ボタンを押したら画面が遷移することなく、素早く処理が反映するような仕組みです。モダンサイトはこうした仕組みを取り入れています。

またモダンサイトはモバイルを意識しているのも特徴です。

2010年に登場したSharePoint 2010 のころは、まだデスクトップが主流であり、ワイドスクリーンのPC画面が流行ったため、これに応じて「リボンメニュー」が取り入れられました。続く 2013年に登場した SharePoint 2013 ではタブレット対応が目玉となり、「注目リンク」Webパーツのような比較的大きいアイコンなどがよく利用されていました。これがSharePoint Online ではモバイルを意識しているため、レスポンスWebデザインとなり、リボンメニューも狭い画面では使いにくくコマンドバーになりました(SharePoint 2007はコマンドバーでしたが、当時ですからレスポンシブではもちろんありません)。

比較的古くから SharePoint を利用してきた方々と話をすると、いまだにクラシックサイトしかご存知ない方が非常に多いなという印象を強く持ちます。確かにモダン機能が出てきた当初は機能的にもクラシックよりもデグレードする部分も多く、魅力は今一つと言えました。しかし、2017年後半からの機能アップデートの追い上げはすさまじく、モダンUIに慣れるとクラシックには戻れないほどです。たとえば弊社の研修で行っている演習一つとっても、手順の作成時間も実施時間も従来の半分の時間で済んでいます。操作にかかる時間が圧倒的に短縮できるのは何にも代えがたいものがあります。

とはいえ、往々にしてモダンサイトが"何をもって優れているといえるか" というのがポイントになるのでしょう。私が重視しているのは、「機能性と操作性」です。日々利用するものですからこの部分の改善は非常に大きい。見た目が変わった、というのは慣れの問題であり、その部分を議論することにはあまり意味を見出せません。つまりはリストやライブラリ、またはページををいかに素早く作成し、情報共有できるかという点が重視されるべきでしょう。モダンサイトは画面遷移がほとんどなく、操作の反応も早い。また機能としても、クラシックになかった機能を多数備えています。

例えば次のような点です。

「リストについて」主だったところのみ

  • 列の幅が変更できる
  • 列の追加や編集削除の操作が簡単
  • ビューの作成や編集も簡単
  • 列の表示位置をドラッグ&ドロップで変更できる
  • 列の書式が設定できる
  • ビューの書式が利用できる
  • 画面リフレッシュしなくても最新アイテムが続々表示される
  • 5,000アイテム問題が解消し、3000万アイテムまで格納できる
  • ビューあたり30アイテムで遷移せずスクロールダウンするだけで全件確認できる
  • 列ごとの編集ができる
  • 複数アイテムの列を一括編集できる
  • PowerAppsでカスタマイズできる

「ライブラリについて」主だったところのみ

  • 列の幅が変更できる
  • 列の追加や編集削除の操作が簡単
  • ビューの作成や編集も簡単
  • 列の表示位置をドラッグ&ドロップで変更できる
  • 列の書式が設定できる
  • ビューの書式が利用できる
  • 画面リフレッシュしなくても最新アイテムが続々表示される
  • 5,000アイテム問題が解消し、3000万アイテムまで格納できる
  • ビューあたり30アイテムで遷移せずスクロールダウンするだけで全件確認できる
  • 列ごとの編集ができる
  • 複数ファイルの列を一括編集できる
  • 基本的にドキュメント ライブラリのみで事足りる(画像ライブラリやメディアライブラリを使い分ける必要がない)
  • 既定でビューアーが入っている (Adobe Illustrator などのファイルのビューアーが SharePoint 側に用意されているため、PCなどにアプリケーションを入れる必要がない)
  • Edge や Chrome であれば、フォルダーごとアップロード
  • 任意のサイトに対するファイルのコピーや移動 (エクスプローラービューを使う必要がないし、ActiveXは利用しない)
  • 複数ファイルの一括ダウンロード(zipファイルとして)
  • フォルダーが複数あった場合、パンくずリストが標準で表示できる

クラシックモードのリストやライブラリには新機能は投入されません。モダンでのみ、最新機能が使えます。

ということで、まだクラシックしか使っていないという組織の方も、そろそろモダンサイトに取り掛かっていく準備を始めましょう。クラシックモードのサイトはサポート期限は発表されてはいませんが、モダンサイトが有利になるように仕組みが作られている以上、実質的な寿命はそれほど長くはないでしょう。

カスタマイズのために、カスタム コードは実行できるのか

モダンサイトは スクリプト エディタ Web パーツやコンテンツ エディタ Webパーツは利用できませんし、そもそもサイト自体 NoScript 設定がされているため、任意のカスタム スクリプトは利用できません。それもあって、「カスタマイズが柔軟にできないらしい」という理由から、モダンサイトが嫌われている面もあるようです。

しかし、これはちょっと誤解があります。

SharePoint Framework を利用したカスタム Webパーツは 作成できますし、JavaScript Injectionやカスタムのコマンドメニューも作成できます。要するに、SharePoint Online 全体管理者またはサイトコレクションの管理者 が把握しているアプリケーションだけが実行できるという仕組みに変わっているだけです。

これはアプリケーションはライフサイクル管理すべきというガバナンスの観点からは十分に理解できる話です。手軽に組み込めるスクリプトがあちこちにあることは、長期的に保守メンテナンスしていくうえでは望ましいとは言えません。私はイメージしやすいように「野良スクリプト」と時々、よんでいますが、こうしたスクリプトの乱用を防ぐ意味が大きいと言えます。SharePoint Framework ではアプリカタログというところに、管理者が SharePoint Framework アプリをインストールすることで展開します。アプリの更新や削除も簡単です。

しかしながら、この SharePoint Framework は従来の SharePoint エンジニアには少々心理的なハードルの高さがあるのも事実でしょう。JavaScript でコーディングするのですが、基本的にオープンソースの仕組みを使うので、TypeScript, Gulp, Node, Yoeman, React, Sass  といった SharePointの開発エンジニアの多くがあまり触れてこなかった技術を習得する必要があるためです。

研修コースの宣伝

最後に弊社コースの宣伝を。モダンサイトに関わる情報を習得できるよう下記のコースをご用意しています。

 

これまでクラシックサイトしか使ってこなかった方が、手軽にモダンサイト機能をキャッチアップできる 1day コースとして下記のコースを実施しています。

SharePoint経験者向け SharePoint モダンUI機能について学ぶワークショップ

また、ファイル管理手法もモダンサイトとTeams などを組み合わせていく必要があります。そこで下記のコースをご用意しています。

Office 365を活用したファイル管理手法を学ぶワークショップ

さらに、来月からモダンサイトでのポータルサイト構築に特化した研修コースを実施します。新しいサイト設計も含め、メガメニュー、SharePointハブ、サイトスクリプトなど最新機能をふんだんに取り入れて、どのようにサイトを作っていくとよいのかを説明もしくはディスカッションしながら、演習を行います。「SharePoint サイトデザインカスタマイズの基礎」のコースの後継コースにあたります。

SharePoint Online モダン ポータルサイトの設計・デザイン・展開 ワークショップ

SharePoint Framework の基礎を学びたい方には下記のコースを用意しています。

SharePoint Framework 入門

コメント

コメントの確認

コメントのプレビュー

プレビュー中です。コメントはまだ投稿されていません。

処理中...
コメントを投稿できませんでした。エラー:
コメントを投稿しました。コメントは記事の投稿者が承認してから表示されます。 さらにコメントを投稿する

入力された文字と数字は画像と一致していません。再度入力してください。

最後に、下の画像の中に見える文字と数字を入力してください。これはプログラムを使ってコメントを自動的に投稿するのを防ぐために行われています。

画像を読み取れない場合は 別の画像を表示してください。

処理中...

コメントを投稿

コメントは記事の投稿者が承認してから表示されます。

アカウント情報

(名前とメールアドレスは必須です。メールアドレスは公開されません。)