Plone4を利用した熊本大学公式Web/教職員Webサイトの再構築

Plone Educational Symposium in Tokyo
2013

Plone4を利用した熊本大学
公式Web/教職員Webサイトの
再構築

永井孝幸1)、坂本瑞穂2)、伊澤睦2)、松葉龍一2)
1)熊本大学総合情報基盤センター

2)熊本大学 eラーニング推進機構

2013年2月22日
明星大学 - Open Source Conference 2013 Tokyo/Spring

Web技術を用いたサービス提供
の
ニーズは増加している
• 研究成果の公開
• オンライン学習環境の提供 • 大学の持つ資産（知的、物
（eラーニング）的）
の提供
• 研究成果の教育への研究
素早いフィードバック • 広い意味での学びの場の提供
• 情報交換と共有
教育社会貢献

• 情報資産量の増加
• 情報改訂速度の増大
• 組織的な情報管理の重要性
• 組織、職員間での情報共有
• 必要情報の素早い取得

Copyright©KumamotoUniversity 2

Webサイトの統合の必要性

• 公式Webサイト＝学外への情報提供
• 教職員向け情報提供サイト＝学内への職務関連情報提供

Ｗｅｂのメリットを
生かせてない！
便利じゃない！
→ 使えない！

• CMSが別＝情報提供手順が異なる
• 情報管理(提供)者が別＝情報が散逸
• フォーマットが別＝情報取得性の低下

Webサイト統合の要請

要望(外部与件)
1)情報発信者（各部局、部署所属）による軽微なコンテンツ
修正を可能にしたい。
2)情報提供者ごとに、情報提供できるようなコンテンツ管理
を
行いたい。
3)公式/教職員両Webサイトの手順を同一にし、コンテンツの
更新作業、管理・運用業務の利便性を上げたい。

Webサイトを統合して利便性の高いサイトを構築する！
それも、学内製
で！

学内製？

• 以前、ほぼ同じ意図で業者製CMSを導入してい
た（2008年～）
• 学内業務とすり合わせがうまくいかず、想定
したようには機能（運用）できなかった。
• 結果、発信者ベースの情報提供は普及せず。
（研修会もしましたが・・・）


熊本大学公式/教職員Webサイト
リニューアルプロジェクト

プロジェクト期間：18ヶ月
現在は、運用チームへ移行

構築チーム編成：6部局、23
名

することは、…いっぱい

 要望は、3つ…でも、システム条件に落とすと16個！
堅牢システムの構築
モジュールのカスタマイズは必要
セキュリティ対策も必須
システム連携
 Webデザインも大変
3タイプのユーザ（公式、教職員サイトの閲覧者、情報提供者
）
部署、業務（提供情報）は多岐にわたっている
閲覧者ごとに、Webサイト利用のニーズが違う
情報提供者のITスキルが…
汎用ブラウザも、いっぱいある
 あれこれと学内調整

三者間での同時並行・協同作業

Webデザイン

http://plone.org/

組織内調整システム構築
CMSカスタマイズ
運用体制整備
システム連携

Webデザイン

Webデザイン

Plone 機能を使った CSSによる
カスタマイズカスタマイズ


Webデザインシステム構築組織内調整

改修にあたってのポイント

 ウェブアクセシビリティ・ユーザビリ
ティ向上
 公式サイトデザインを教職員サイトが踏
襲
 メニューの配置等は公式サイト閲覧者の
利便性を優先
 大学Webサイト格付け調査の総合ポイン
トをUPさせる Copyright©KumamotoUniversity 10


Webデザイナー視点で

要 足りない機能のアドオンインス
望トール
にコラージュ、フォーム、CKEditor 、Quick Upload・・・
対
応 熊大スキンの作成
一覧に日付やタグを出す、コンテンツタイプ・表示形式の追
加

エディタのカスタマイズ
 コンテンツツリー再設計（アドバイス）
提
案  入力テンプレートの作成
 メニュー項目をテキストに


コンテンツツリーを再設計す
る

コンテンツツリーの再設計サイト設計の基本！
【目的】情報の整理・所有者を明確にする
とはいえ
クライアント（事務組織）でなけれ
ば大学Webサイトの特異点
わからないことが多い
コンテンツツリーの作成はクライアント側（広
報U）
デザイナーとしてアドバイス
時間かかった！Copyright©KumamotoUniversity 12


主に活用しているPloneの機能

Ploneのコレクションはデータベースにおけるレポートや
検索クエリと同じように働きます。コレクションを使用す
コレクションることで、コンテンツを動的にソートしたり表示したりで
きます。 Plone Users Group Japan「Plone4ユーザーマニュアル」より引用

タグによるコンテンツの分類を行いたい
場合に使用します。ここで追加したタグ
タグはコンテンツの下部に表示され、各タグ
をクリックするとそのタグを持つコンテ
ンツが検索されて一覧表示されます。
「Plone 4 Book」より引用

Topページなどで、ニュース一覧と静的情報など複数の内
コラージュ容を、1ページに表示したい時の対応方法
Plone Users Group Japan「ノウハウ集」より引用



情報を集約する

お知らせ・イベント、教職員サイト
コレクション
タ
グ
コラージュ

クリック • ページに内容にあったタグをつける
• タグや作成日などで検索してコンテンツ
最新情報
を集めてコレクションするを簡単に
閲覧・発
信
閲覧者：決まったページを見るだ
け
作成者：タグをつけるだけ
• タグはデフォルトでは一覧に出てこない
ので見えるようカスタマイズ
→公式サイト用と教職員サイト用を準備
コレクションのペー
タグ • 日付の書式もカスタマイズ
ジ


情報を集約する

タ
ポータルコレクション
グ
コラージュ

1ページ内に複数のコンテンツ
を表示できるコラージュ機能
を追加

• トップページ、部局トップペー
ジ、教職員サイトトップページ
など、ポータルになるような
ページに使用
• コラージュ機能は多用させない
ように管理者権限でしか追加で
きない


運用効率をアップする

作業状況一括管理コレクション
タ
グ
コラージュ

サイト管理や業務の効率化
を図るために、サイト内の
ページ状態を一覧表示

• 承認中のまま公開されてい
ないなどの管理がしやすい
• 更新の行われていないペー
ジも見つけやすく、更新を
情報の鮮度がUP！促しやすい


各部署用のフォームを設置

今までは管理部署のメールアドレスを書
いてあったが、どんなメールがどれくら
いきているのかサイト管理者は把握でき
なかった

問い合わせフォームを設
専門のサポート部門があるわけで
置
はないので各部署に飛ぶ必要があ
る
1. ページ管理部署とサイト管理者を入れたMLを
作成
2. ページ管理部署分のフォームを作成（62個）
3. 各ページごとにそれぞれのフォームを設置


移行作業は手動ですよ

残念ながら旧サイトからのコンテンツ移行は自動化できま
せん・・・よね？
手動移行
作業人数：12～13人
ページ数：約1600ページ
期間：約600時間（移行のみ、確認含ま
ず）ちなみに

テンプレートを作成し、それに沿って移行するよう指
約1900ページ
示 2013年1月現在
移行→確認→確認（ダブルチェック）


Webデザイン

Webデザイン

Plone 機能を使った CSSによる
カスタマイズカスタマイズ



入力をカンタンに！

ITスキルがばらばら

部署 • メールができる
• Wordが触れる
up up up

部署広報作成～up 程度のスキルに合わせ
部署部署部署
る
HTMLがわからなくてもOK
改修前改修後
各部署が広報へ依頼各部署の担当者が
ページ作成、UP 作成からUPまで


エディタ整備：CKEditor

• ツールバーのカスタマイズ（ツールは最小限）

※CKEditor3.6.1

• プルダウンメニューの表示とプレビュー画
面内の表示を同様に（CSSで上書き）

プレビュー画面
変更前変更後


ページテンプレート

4種類のページテンプレート準備

標準ページ目次ページ

お知らせペーイベントペー
ジ
Copyright©KumamotoUniversity
ジ
22


スタイルの統一

デザインの統一のため使えるスタイルを絞る
見出し・リスト・ボッ
文字装飾テーブル
クス業者に発注して80万円/年

キラキラ画像デコレーション＆トッピング防止
→上層部は不満らしいけど

ファイルへリンクを張ると
自動でアイコンが付く

教職員サイト
でも視認性UP



状態別スタイル

編集画面
編集ワークフ
ロー
に基いて変化

変更前

変更後


熊大スキンを作る

• 旧サイトのデザインを踏襲
要 • 左側からヘッダ部分に固定
望
• 訪問者別目メニューもヘッダ位置に移動

• バナーはシンプル＆減らす
Schools Skin • Viewlet調整
• 3つのCSS
• base_properties（plone機能）活用


メニュー項目はテキスト＆
CSS
• 音声読み上げにも対応（チェック済）
• 変更の度に画像を作らなくていいので更新が楽

見出しページタイト
ル



ナビゲーション

旧サイト新サイト

• ページによってデザインが違
う?!
• 自分がどこにいるのかわからな


Webデザイン

http://plone.org/

運用体制整備
システム連携


CMS選定基準

• 前提条件
– オープンソースのCMSで内製
– 教職員数：約2,000人,担当部署：約40
• 要求事項
– ページ毎に編集・閲覧権限を指定可
– 編集ワークフローに対応
– CAS認証、LDAP連携が可能
– 10,000アクセス/分に対応可能
– コンテンツの時限公開開始に対応
– 等々


先生、セキュリティはどうしま
す？

• 2005/4/15 熊大Web • 望ましいCMS
– 脆弱性が尐ない
– アクセス制御が強固
– 保守が容易
– 長期サポート
Joomla? Drupal? Plone?

2011年3月決定 (Plone 4.0.3)
(後、Plone 4.0.5に更新)


内製って言いますけど

• 私(永井) ←達観
– 基本、情報屋(CS系)さんです
– 以前に新設大学の情報インフラ構築・運用経験
– RFC読んで、パケット眺めて、ソース読む
• 学内の状況 ←怖い物知らず
止める大人はいなかった
– 「インストールすれば動く」程度の理解
• postfix,samba,Apacheぐらいは触ってるけど...
＼（＾＾）／
• 「動かないコンピュータ」のリスクを知らない
– 「先生、サーバー発注しときました！」
• 「システム構成決めてませんけど？（゜Д゜）」


大学Webシステム構成

物理サーバ3
学外閲覧
「読み取り専用状
リバースプロキ
シ学内閲覧態」
(Varnish)
でも動くように改造
物理サーバ2
Ploneスレーブ
(Plone4+Apache) 閲覧用Plone
• 読み取り専用状態で動作
MySQLスレーブ
(read only運用)
LDAPスレーブ
(OpenLDAP)
• 編集用Plone停止中も動作

物理サーバ1
編集用Plone
LDAPマスター
MySQLマスター
(OpenLDAP) • 閲覧用Ploneへコンテンツをコピー
• RelStorageを利用
Ploneマスター
(Plone4+Apache) 学内編集



編集ワークフロー

• 学外公開用のワークフローを自作
差戻し

承認依頼公開依頼

差戻し

制作者承認者総合管理者
• 新規原稿作成 • 最終原稿確認 • 学外公開承認 or 差戻し
• 既存ページ編集 • 学外公開依頼 or 差戻し • 文面の軽微な修正

• ワークフローの動作テスト用に各役割別のGmailアカウントを作
• 本当の業務用アドレスに送ると迷惑なので


コンテンツの時間指定公開

• 自明な言葉ほど要注意
– 「時間指定で公開するコンテンツって何？」
– 「入試の合格速報です」
– 「どれくらい正確な時刻に公開できればよい？
」
– 「フライングは絶対駄目。遅れるのは可」
• Ploneの標準機能でしょ？ーところが
– URIを知っていれば公開期間前でも閲覧できる
– 現状とても予想しやすいURIです orz
– ex. http://www.kumamoto-
u.ac.jp/nyuushi/sokuhou/H25igakugoukaku4.pdf


時間指定公開改良版

• 「公開待ち状態」を追加
– 公開時間がくるまで「管理者のみ閲覧可」
差戻し

承認依頼公開依頼

private draft review

差戻し
即時公開
時間指定あり
状態はcronで自動更新

公開期間終了公開期間開始
hidden published wait

公開終了一般公開公開時間待ち


Varnish連携

• 目的：入試合格発表の一斉アクセスに対応
• plone.app.caching
– コンテンツを「変更する」とVarnishにPURGEを要求
– コンテンツの「状態変更」は考慮していない
• 「公開時間が来ても古いキャッシュのまま」
• 「手作業で非公開にしてもキャッシュはそのまま」
– purge.pyのafterTransitionメソッドを修正
• 公開状態に変化があったらPURGEを要求
– 保険：30分毎に全キャッシュを破棄


遭遇した地雷

• 何これ？？？

– CSSが反映されない、無関係な画像が出る
– 他のユーザのセッションと入れ替わる


Ploneやめる？どうする？

• Plone 4.0.3固有の問題？
– Plone 4.0.9, Plone 4.1.2でも症状を確認
– ConflictErrorが多いと出やすい
• 深刻なバグなのにレポート出てないの？
– Does Plone/Zope deliver wrong content?(2011)
– crazy things happening to my graphics(2009)
影響を受けるのはPloneだが
• Zope側では把握していた直すのはZope側
– dm.zopepatches.fix_responsewrite_conflict
1.0(2011)
– “Response.write is inherently unsafe in the face
of ConflictError. Copyright©KumamotoUniversity fix is not to use it38
The only reliable


その他色々致命傷をデバッグ

• 特定日本語ファイルだけアップロード不可
– Pythonプロセスが異常終了
– unicodedata.normalize(Python本体)の不具合
– 該当処理をPyICUライブラリに置換
• 日本語添付ファイルが検索できない
– インデックス作成プロセスと通信できていない
– c2.transform.msoffice-1.0b3-py2.6.eggの修正
• Ploneの送信メールヘッダ不具合
– MIME-Versionが重複(postfixでエラーになる)



システム構築まとめ

• 全学Webでは各種ミドルウェア統合が必須
– CMSの知識(Python/Zope/Plone)では足りない
– KVM,OpenLDAP,MySQL,Apache,Varnish,postfix,
CAS,AppArmor,HTTrack,OpenVAS,etc.
• 構築・運用レベルの資料が無い
– 既存プラグインの正確な動作が不明
– 「あってはならない動作」の早期把握
• なんだかんだで700時間
– 会議、調査、構築、デバッグ、記録



Webデザイン

http://plone.org/

組織内調整
運用体制整備
運用体制整備
システム連携


情報(コンテンツ)所有者の明確化

ウェブによる情報発
信
を
通常業務化



マニュアル、ガイドライン、規約の整
備

マニュアルの整備、研修用eラーニングコンテンツも作成

マニュアル、規約なんて、どうせ誰も読まない！

オンラインマニュアル
＝研修会コンテンツにしてしまおう！


ウェブサイトシステム利用研修
会

• 職員異動等による情報発信の遅延
• 担当者の欠如による情報公開の不整備

研修会を年数回開催
延べ190名
全事務職員の3分の2が受講済

みんな「翻訳」ボタンが大好き→非表
示に


運用チームへ

運用では
• 長期間に渡り常時の
システム監視、
• 安定的にユーザ・サポー
ト
に徹する組織運営
が必須

事務組織主導による事務・技術職員
を中心にスタッフ編成

Plone4を利用した熊本大学公式Web/教職員Webサイトの再構築

Recommended

Recommended

More Related Content

Similar to Plone4を利用した熊本大学公式Web/教職員Webサイトの再構築

Similar to Plone4を利用した熊本大学公式Web/教職員Webサイトの再構築 (20)

More from Shigeo Honda

More from Shigeo Honda (9)

Recently uploaded

Recently uploaded (12)

Plone4を利用した熊本大学公式Web/教職員Webサイトの再構築