Your SlideShare is downloading. ×
Plone4を利用した熊本大学公式Web/教職員Webサイトの再構築
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

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

2,850
views

Published on

本スライドは2013年2月22日にPlone Users Group Japanが開催した「Plone Educational Symposium in Tokyo 2013」でご講演いただいた資料となります。

本スライドは2013年2月22日にPlone Users Group Japanが開催した「Plone Educational Symposium in Tokyo 2013」でご講演いただいた資料となります。

Published in: Technology

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
2,850
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
5
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. 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
  • 2. Web技術を用いたサービス提供のニーズは増加している • 研究成果の公開• オンライン学習環境の提供 • 大学の持つ資産(知的、物 (eラーニング) 的) の提供• 研究成果の教育への 研究 素早いフィードバック • 広い意味での学びの場の提供 • 情報交換と共有 教育 社会貢献 • 情報資産量の増加 • 情報改訂速度の増大 • 組織的な情報管理の重要性 • 組織、職員間での情報共有 • 必要情報の素早い取得 Copyright©KumamotoUniversity 2
  • 3. Webサイトの統合の必要性• 公式Webサイト=学外への情報提供• 教職員向け情報提供サイト=学内への職務関連情報提供 Webのメリットを 生かせてない! 便利じゃない! → 使えない! • CMSが別 =情報提供手順が異なる • 情報管理(提供)者が別 =情報が散逸 • フォーマットが別 =情報取得性の低下 Copyright©KumamotoUniversity 3
  • 4. Webサイト統合の要請要望(外部与件)1)情報発信者(各部局、部署所属)による軽微なコンテンツ 修正を可能にしたい。2)情報提供者ごとに、情報提供できるようなコンテンツ管理を 行いたい。3)公式/教職員両Webサイトの手順を同一にし、コンテンツの 更新作業、管理・運用業務の利便性を上げたい。 Webサイトを統合して利便性の高いサイトを構築する! それも、学内製 で! Copyright©KumamotoUniversity 4
  • 5. 学内製?• 以前、ほぼ同じ意図で業者製CMSを導入してい た(2008年~)• 学内業務とすり合わせがうまくいかず、想定 したようには機能(運用)できなかった。• 結果、発信者ベースの情報提供は普及せず。 (研修会もしましたが・・・) Copyright©KumamotoUniversity 5
  • 6. 熊本大学公式/教職員Webサイトリニューアルプロジェクト プロジェクト期間:18ヶ月 現在は、運用チームへ移行構築チーム編成:6部局、23名 Copyright©KumamotoUniversity 6
  • 7. することは、…いっぱい 要望は、3つ…でも、システム条件に落とすと16個! 堅牢システムの構築 モジュールのカスタマイズは必要 セキュリティ対策も必須 システム連携 Webデザインも大変 3タイプのユーザ(公式、教職員サイトの閲覧者、情報提供者 ) 部署、業務(提供情報)は多岐にわたっている 閲覧者ごとに、Webサイト利用のニーズが違う 情報提供者のITスキルが… 汎用ブラウザも、いっぱいある あれこれと学内調整 Copyright©KumamotoUniversity 7
  • 8. 三者間での同時並行・協同作業 Webデザイン http://plone.org/ 組織内調整 システム構築 CMSカスタマイズ 運用体制整備 システム連携 Copyright©KumamotoUniversity 8
  • 9. Webデザイン WebデザインPlone 機能を使った CSSによる カスタマイズ カスタマイズ Copyright©KumamotoUniversity 9
  • 10. Webデザイン システム構築 組織内調整改修にあたってのポイント ウェブアクセシビリティ・ユーザビリ ティ向上 公式サイトデザインを教職員サイトが踏 襲 メニューの配置等は公式サイト閲覧者の 利便性を優先 大学Webサイト格付け調査の総合ポイン トをUPさせる Copyright©KumamotoUniversity 10
  • 11. Webデザイン システム構築 組織内調整Webデザイナー視点で要 足りない機能のアドオンインス望 トールに コラージュ、フォーム、CKEditor 、Quick Upload・・・対応 熊大スキンの作成 一覧に日付やタグを出す、コンテンツタイプ・表示形式の追 加 エディタのカスタマイズ  コンテンツツリー再設計(アドバイス)提案  入力テンプレートの作成  メニュー項目をテキストに Copyright©KumamotoUniversity 11
  • 12. Webデザイン システム構築 組織内調整コンテンツツリーを再設計するコンテンツツリーの再設計サイト設計の基本!【目的】情報の整理・所有者を明確にする とはいえクライアント(事務組織)でなければ 大学Webサイトの特異点わからないことが多いコンテンツツリーの作成はクライアント側(広報U) デザイナーとしてアドバイス 時間かかった!Copyright©KumamotoUniversity 12
  • 13. Webデザイン システム構築 組織内調整主に活用しているPloneの機能 Ploneのコレクションはデータベースにおけるレポートや 検索クエリと同じように働きます。コレクションを使用すコレクション ることで、コンテンツを動的にソートしたり表示したりで きます。 Plone Users Group Japan「Plone4ユーザーマニュアル」より引用 タグによるコンテンツの分類を行いたい 場合に使用します。ここで追加したタグ タグ はコンテンツの下部に表示され、各タグ をクリックするとそのタグを持つコンテ ンツが検索されて一覧表示されます。 「Plone 4 Book」より引用 Topページなどで、ニュース一覧と静的情報など複数の内 コラージュ 容を、1ページに表示したい時の対応方法 Plone Users Group Japan「ノウハウ集」より引用 Copyright©KumamotoUniversity 13
  • 14. Webデザイン システム構築 組織内調整情報を集約するお知らせ・イベント、教職員サイト コレクション タ グ コラージュ クリック • ページに内容にあったタグをつける • タグや作成日などで検索してコンテンツ 最新情報 を集めてコレクションする を簡単に 閲覧・発 信 閲覧者:決まったページを見るだ け 作成者:タグをつけるだけ • タグはデフォルトでは一覧に出てこない ので見えるようカスタマイズ →公式サイト用と教職員サイト用を準備 コレクションのペー タグ • 日付の書式もカスタマイズ ジ Copyright©KumamotoUniversity 14
  • 15. Webデザイン システム構築 組織内調整情報を集約する タポータル コレクション グ コラージュ 1ページ内に複数のコンテンツ を表示できるコラージュ機能 を追加 • トップページ、部局トップペー ジ、教職員サイトトップページ など、ポータルになるような ページに使用 • コラージュ機能は多用させない ように管理者権限でしか追加で きない Copyright©KumamotoUniversity 15
  • 16. Webデザイン システム構築 組織内調整運用効率をアップする作業状況一括管理 コレクション タ グ コラージュ サイト管理や業務の効率化 を図るために、サイト内の ページ状態を一覧表示 • 承認中のまま公開されてい ないなどの管理がしやすい • 更新の行われていないペー ジも見つけやすく、更新を 情報の鮮度がUP! 促しやすい Copyright©KumamotoUniversity 16
  • 17. Webデザイン システム構築 組織内調整各部署用のフォームを設置 今までは管理部署のメールアドレスを書 いてあったが、どんなメールがどれくら いきているのかサイト管理者は把握でき なかった 問い合わせフォームを設 専門のサポート部門があるわけで 置 はないので各部署に飛ぶ必要があ る 1. ページ管理部署とサイト管理者を入れたMLを 作成 2. ページ管理部署分のフォームを作成(62個) 3. 各ページごとにそれぞれのフォームを設置 Copyright©KumamotoUniversity 17
  • 18. Webデザイン システム構築 組織内調整移行作業は手動ですよ残念ながら旧サイトからのコンテンツ移行は自動化できません ・・・よね? 手動移行 作業人数:12~13人 ページ数:約1600ページ 期間:約600時間(移行のみ、確認含ま ず) ちなみに テンプレートを作成し、それに沿って移行するよう指 約1900ページ 示 2013年1月現在 移行→確認→確認(ダブルチェック) Copyright©KumamotoUniversity 18
  • 19. Webデザイン システム構築 組織内調整Webデザイン Webデザイン Plone 機能を使った CSSによる カスタマイズ カスタマイズ Copyright©KumamotoUniversity 19
  • 20. Webデザイン システム構築 組織内調整入力をカンタンに! ITスキルがばらばら 部署 • メールができる • Wordが触れる up up up部署 広報 作成~up 程度のスキルに合わせ 部署 部署 部署 る HTMLがわからなくてもOK 改修前 改修後 各部署が広報へ依頼 各部署の担当者が ページ作成、UP 作成からUPまで Copyright©KumamotoUniversity 20
  • 21. Webデザイン システム構築 組織内調整エディタ整備:CKEditor• ツールバーのカスタマイズ(ツールは最小限) ※CKEditor3.6.1• プルダウンメニューの表示とプレビュー画 面内の表示を同様に(CSSで上書き) プレビュー画面 変更前 変更後 Copyright©KumamotoUniversity 21
  • 22. Webデザイン システム構築 組織内調整ページテンプレート4種類のページテンプレート準備 標準ページ 目次ページ お知らせペー イベントペー ジ Copyright©KumamotoUniversity ジ 22
  • 23. Webデザイン システム構築 組織内調整スタイルの統一デザインの統一のため使えるスタイルを絞る見出し・リスト・ボッ 文字装飾 テーブル クス 業者に発注して80万円/年 キラキラ画像デコレーション&トッピング防止 →上層部は不満らしいけど ファイルへリンクを張ると 自動でアイコンが付く 教職員サイト でも視認性UP Copyright©KumamotoUniversity 23
  • 24. Webデザイン システム構築 組織内調整状態別スタイル編集画面 編集ワークフ ロー に基いて変化 変更前 変更後 Copyright©KumamotoUniversity 24
  • 25. Webデザイン システム構築 組織内調整熊大スキンを作る • 旧サイトのデザインを踏襲要 • 左側からヘッダ部分に固定望 • 訪問者別目メニューもヘッダ位置に移動 • バナーはシンプル&減らす Schools Skin • Viewlet調整 • 3つのCSS • base_properties(plone機能)活用 Copyright©KumamotoUniversity 25
  • 26. Webデザイン システム構築 組織内調整メニュー項目はテキスト&CSS• 音声読み上げにも対応(チェック済)• 変更の度に画像を作らなくていいので更新が楽 見出しページタイト ル Copyright©KumamotoUniversity 26
  • 27. Webデザイン システム構築 組織内調整ナビゲーション 旧サイト 新サイト• ページによってデザインが違 う?!• 自分がどこにいるのかわからな Copyright©KumamotoUniversity 27
  • 28. 三者間での同時並行・協同作業 Webデザイン http://plone.org/ 組織内調整 システム構築 CMSカスタマイズ 運用体制整備 システム連携 Copyright©KumamotoUniversity 28
  • 29. Webデザイン システム構築 組織内調整CMS選定基準• 前提条件 – オープンソースのCMSで内製 – 教職員数:約2,000人,担当部署:約40• 要求事項 – ページ毎に編集・閲覧権限を指定可 – 編集ワークフローに対応 – CAS認証、LDAP連携が可能 – 10,000アクセス/分に対応可能 – コンテンツの時限公開開始に対応 – 等々 Copyright©KumamotoUniversity 29
  • 30. Webデザイン システム構築 組織内調整先生、セキュリティはどうします?• 2005/4/15 熊大Web • 望ましいCMS – 脆弱性が尐ない – アクセス制御が強固 – 保守が容易 – 長期サポート Joomla? Drupal? Plone? 2011年3月決定 (Plone 4.0.3) (後、Plone 4.0.5に更新) Copyright©KumamotoUniversity 30
  • 31. Webデザイン システム構築 組織内調整内製って言いますけど• 私(永井) ←達観 – 基本、情報屋(CS系)さんです – 以前に新設大学の情報インフラ構築・運用経験 – RFC読んで、パケット眺めて、ソース読む• 学内の状況 ←怖い物知らず 止める大人はいなかった – 「インストールすれば動く」程度の理解 • postfix,samba,Apacheぐらいは触ってるけど... \(^ ^)/ • 「動かないコンピュータ」のリスクを知らない – 「先生、サーバー発注しときました!」 • 「システム構成決めてませんけど?(゜Д゜) 」 Copyright©KumamotoUniversity 31
  • 32. Webデザイン システム構築 組織内調整大学Webシステム構成 物理サーバ3 学外閲覧 「読み取り専用状 リバースプロキ シ 学内閲覧 態」 (Varnish) でも動くように改造 物理サーバ2 Ploneスレーブ (Plone4+Apache) 閲覧用Plone • 読み取り専用状態で動作MySQLスレーブ(read only運用) LDAPスレーブ (OpenLDAP) • 編集用Plone停止中も動作 物理サーバ1 編集用Plone LDAPマスターMySQLマスター (OpenLDAP) • 閲覧用Ploneへコンテンツをコピー • RelStorageを利用 Ploneマスター (Plone4+Apache) 学内編集 Copyright©KumamotoUniversity 32
  • 33. Webデザイン システム構築 組織内調整編集ワークフロー • 学外公開用のワークフローを自作 差戻し 承認依頼 公開依頼 差戻し 制作者 承認者 総合管理者• 新規原稿作成 • 最終原稿確認 • 学外公開承認 or 差戻し• 既存ページ編集 • 学外公開依頼 or 差戻し • 文面の軽微な修正• ワークフローの動作テスト用に各役割別のGmailアカウントを作 • 本当の業務用アドレスに送ると迷惑なので Copyright©KumamotoUniversity 33
  • 34. Webデザイン システム構築 組織内調整コンテンツの時間指定公開• 自明な言葉ほど要注意 – 「時間指定で公開するコンテンツって何?」 – 「入試の合格速報です」 – 「どれくらい正確な時刻に公開できればよい? 」 – 「フライングは絶対駄目。遅れるのは可」• Ploneの標準機能でしょ?ーところが – URIを知っていれば公開期間前でも閲覧できる – 現状とても予想しやすいURIです orz – ex. http://www.kumamoto- Copyright©KumamotoUniversity 34 u.ac.jp/nyuushi/sokuhou/H25igakugoukaku4.pdf
  • 35. Webデザイン システム構築 組織内調整時間指定公開改良版• 「公開待ち状態」を追加 – 公開時間がくるまで「管理者のみ閲覧可」 差戻し 承認依頼 公開依頼 private draft review 差戻し 即時公開 時間指定あり 状態はcronで自動更新 公開期間終了 公開期間開始 hidden published wait 公開終了 一般公開 公開時間待ち Copyright©KumamotoUniversity 35
  • 36. Webデザイン システム構築 組織内調整Varnish連携• 目的:入試合格発表の一斉アクセスに対応• plone.app.caching – コンテンツを「変更する」とVarnishにPURGEを要求 – コンテンツの「状態変更」は考慮していない • 「公開時間が来ても古いキャッシュのまま」 • 「手作業で非公開にしてもキャッシュはそのまま」 – purge.pyのafterTransitionメソッドを修正 • 公開状態に変化があったらPURGEを要求 – 保険:30分毎に全キャッシュを破棄 Copyright©KumamotoUniversity 36
  • 37. Webデザイン システム構築 組織内調整遭遇した地雷• 何これ??? – CSSが反映されない、無関係な画像が出る – 他のユーザのセッションと入れ替わる Copyright©KumamotoUniversity 37
  • 38. Webデザイン システム構築 組織内調整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
  • 39. Webデザイン システム構築 組織内調整その他色々致命傷をデバッグ• 特定日本語ファイルだけアップロード不可 – Pythonプロセスが異常終了 – unicodedata.normalize(Python本体)の不具合 – 該当処理をPyICUライブラリに置換• 日本語添付ファイルが検索できない – インデックス作成プロセスと通信できていない – c2.transform.msoffice-1.0b3-py2.6.eggの修正• Ploneの送信メールヘッダ不具合 – MIME-Versionが重複(postfixでエラーになる) Copyright©KumamotoUniversity 39
  • 40. Webデザイン システム構築 組織内調整システム構築まとめ• 全学Webでは各種ミドルウェア統合が必須 – CMSの知識(Python/Zope/Plone)では足りない – KVM,OpenLDAP,MySQL,Apache,Varnish,postfix, CAS,AppArmor,HTTrack,OpenVAS,etc.• 構築・運用レベルの資料が無い – 既存プラグインの正確な動作が不明 – 「あってはならない動作」の早期把握• なんだかんだで700時間 – 会議、調査、構築、デバッグ、記録 Copyright©KumamotoUniversity 40
  • 41. 三者間での同時並行・協同作業 Webデザイン http://plone.org/ 組織内調整 組織内調整 システム構築 CMSカスタマイズ 運用体制整備 運用体制整備 システム連携 Copyright©KumamotoUniversity 41
  • 42. Webデザイン システム構築 組織内調整情報(コンテンツ)所有者の明確化 ウェブによる情報発 信 を 通常業務化 Copyright©KumamotoUniversity 42
  • 43. Webデザイン システム構築 組織内調整マニュアル、ガイドライン、規約の整備マニュアルの整備、研修用eラーニングコンテンツも作成 マニュアル、規約なんて、どうせ誰も読まない! オンラインマニュアル =研修会コンテンツにしてしまおう! Copyright©KumamotoUniversity 43
  • 44. Webデザイン システム構築 組織内調整ウェブサイトシステム利用研修会 • 職員異動等による情報発信の遅延 • 担当者の欠如による情報公開の不整備 研修会を年数回開催 延べ190名 全事務職員の3分の2が受講済 みんな「翻訳」ボタンが大好き→非表 示に Copyright©KumamotoUniversity 44
  • 45. Webデザイン システム構築 組織内調整運用チームへ 運用では • 長期間に渡り常時の システム監視、 • 安定的にユーザ・サポー ト に徹する組織運営 が必須 事務組織主導による事務・技術職員 を中心にスタッフ編成 Copyright©KumamotoUniversity 45