わさっきhb

大学（教育研究）とか ，親馬鹿とか，和歌山とか，とか，とか．

前期ゼミの活動報告

研究室 computing

今期の前期ゼミ，具体的には自分のWebページ刷新について，取りまとめたいと思います．

はじまり

ゴールデンウィーク明けに学生を集め，ミーティングをしました．といっても，初回はこちらの問題意識の開陳です．自分のWebコンテンツをなんとかしたいのですが…

  • 外部から見て都合の悪そうな点を改善したい．
  • 現状は，教員自身か，研究室か，研究グループか，研究に関する情報が混沌としていて，どれがメインか分かりにくい．
  • 文字コードが混在している（UTF-8とEUC-JPがある）．
  • 新しい研究成果をWeb上で報告したい．
  • 頻繁に更新するファイル（Subversionで管理している）とそうでないファイルがある．
  • 受験生や，3年次配属前の学生のための情報を盛り込みたい．
  • 各ページに，メニューをつけたい．その場合，新規にページを作ると，すべてのページでメニュー情報を更新しないといけないが，更新のためのプログラムを作って対処する．言い換えると，動的な（アクセスごとの）メニューに関する情報取得はしない．
  • 前期ゼミが終わったら私がファイルを管理するが，前期ゼミの間，学生の創意工夫で，対外的には読みやすく，内部的には保守しやすいファイル群に作り替えてほしい．

展開

初回ミーティングから2週間後に集まって，ブレインストーミング形式で，課題と改善案を出していきました．
その次の週には，Webページ刷新の大枠を決め，班分けをしました．班は「トップページ班」「研究室班」「プロフィール・講義班」「その他班」とし，各班は2〜3名で，4人の3年生はそれぞれ別の班につきました．
ファイル（htmlファイル，cssファイル，jsファイル，画像ファイル）は，研究室のメンバ全員がアクセスできるSubversionリポジトリを介して，管理しました．作成および管理の対象となるページとその分類は，ミーティングのたびにチェックしました．
ミーティングをしながら，英語ページの作成が必要なことに気づきました．「英語班」を作るわけにもいかず，個人情報はその他班，研究紹介は研究室班が担当することになりました．もともと英語ページは一つあって，これを分割して，他のと同じレイアウトにしました．
3年生には1回ずつ，議事録を作成してもらいました．こちらはメールで受け取り，目を通し，修正指示を出して若干リライトしてもらいました．

方針・工夫

Webページは刷新したらおしまい，ではありません．近況報告，写真，研究業績の追加，またときには新たな研究紹介や，何らかのコンテンツ追加をしたくなることもあります．今後のことも考えながら，方針を立てていきました．

  • 近況報告の対象は，刷新前と同じ程度とし*1，授業を実施したとか，ゼミで研究室の学生が発表したとかいった情報は，特に書かない．
  • 未発表の研究を明かすのはよくない．研究紹介では，すでに対外発表した内容と画像をベースとして作成する．

表示に関して，刷新前は1カラムで，トップページに戻るリンクこそあったものの，トップページ以外では，どんな情報があるのかが分かりませんでした．各ページにメニューをつけるとして…2カラムにする（左にメニューを並べる）か，1カラム（ヘッダ画像の下にメニューを並べる）かについては，両方のレイアウトを作り，最終的に2カラムに決定しました．
メニューに少し，工夫をすることにしました．JavaScriptを使用して，サブメニュー表示/非表示するようにします．ただしJavaScriptをオフにしても問題なく読めるようにします．CSSをオフにしても読めるようにする，という必要性はないだろうとなりました．
ブログパーツを取り入れ，Twitterの最新の[twitter:@takehikom]のつぶやきが載るようにしました．頻繁に，しかも失礼のない発言しないといけなくなりました．

コンテンツを増やす

そういったファイル整備とは別に，情報を増やし，最終的にそれらも刷新コンテンツの中に取り込まれました．
一つは，ゼミ風景の写真撮影です．これは学生の発案です．「活発に研究活動をしている」ことが目に見えて分かり，かつ学生が卒業しても残るので，採用しました．期間中，何度か撮影しました．
アプリケーション紹介（Cglos, Euclid_js, zjs, nlmate）のページを作りました．スクリーンショットを有りにすると，HTMLファイルと画像ファイルの合計サイズがずいぶんと大きくなったので，画像サイズを小さくする加工をしたり，画像無しの紹介ページを作ったりしました．

前期ゼミ終了後

7月中旬に前期ゼミは終了．学生は試験，そして夏休み*2です．
なのですが，前期ゼミ終了時点のファイル群は，公開にも管理にも不十分と感じていました．こちらで手を加えました．以下，8月6日のリプレースの前に行ったことも，後に手がけたものもあります．

  • メニュー部の変更は，結局私の仕事です．index.htmlのメニュー関連コードを読み取り，他のhtmlファイルに適用するプログラムをRubyで記述しました*3．各ページに「＜-- menu:begin --＞ 」と「＜!-- menu:end --＞」を記述してもらい，その中だけ置き換えるようにしました*4．文字列処理だけでできるかなと思ったのですが，HTMLとしての処理もいくつかあったので，Nokogiriを使用し，英語化についてのノウハウを使ってコーディングしました．
  • メニューは当初，開いたページのグループだけサブメニューを表示し，他はサブメニューを表示していなかったのですが，総数は多くないので，全部表示させることにしました．ボタンで全開きと全閉じもできるようにしました*5．
  • 刷新の前に，古いファイルは ~/public_html/arc に移動しました．arcは，archiveの略です．
  • ヘッダ画像を加工しました．英語用の画像も作りました．といっても，ローマ字で読みを付け加えただけですが．
  • 研究紹介について，8月下旬のリトアニアの国際会議終了後に，その発表に関する文章と画像を追加しました．
  • 英語版zjsの説明文を追加し，アプリのページに飛べるようにしました．
  • 近況報告のうち，Webページ更新履歴を分離しました．今年度の報告からです．
  • 英語ページから，日本語文字を一掃しました．日本語ページの「□」は実際にそういう文字ですが，英語ページでは，箱を描くようCSSで記述しました*6．「○」は「*」に置き換えました．それらの処理をするため，メニュー変更のRubyスクリプトに手を加えました．

最後に，Webサーバへの送信の方法について，書いておきます．メニュー部を変更したら，上述のRubyスクリプトを走らせます．それからコミットします．ここまではWindows PCで行います．次に，自分で管理しているLinuxサーバにリモートログインし，一つコマンドを実行するだけで，Subversionの更新を行い，rsyncを使って，必要最小限のファイルだけをWebサーバに送信しています．以下がzsh用function定義の概略です．

function upw() {
  local HTML1=（Subversion作業コピーのパス）
  local HTML2=$HOME/public_html
  local HTML3=（Webサーバのホスト名）:public_html
  svn up $HTML1
  rsync -auv --exclude=.svn --exclude=private $HTML1/ $HTML2/
  rsync -auvz -e ssh --exclude=.svn --exclude=private $HTML1/ $HTML3/
}

「private」というのは，$HTML1の直下にあるディレクトリで，メニュー変更のRubyスクリプトなど，非公開ファイルをそこに置いています．またHTML2というのは，自分のLinuxサーバで（非常時または実験的な試みをしたときに）読めるようにしていて，そのためのパスです．

今後の課題

「アクセスログ解析」*7と「利用者（研究者，配属前学生，受験生）ごとのページ作成」については，手が回りませんでした．

昔書いたこと

何を公開するのかというと，次の二つです．「研究成果」と「活発に研究していること」です．
研究成果は，さらに二つ分かれます．経年的な，論文その他の業績情報と，主要な成果あるいは研究テーマに関する解説です．論文については，参考文献として記載できる形にしておけば，「過去の学会発表で，別刷り・コピーはあるんだけど，学会名や発行年が書かれていない」というのを新たな原稿の参考文献に入れるのも，楽々です．このように，研究業績を取りまとめておけば，研究室の中の人にも役立つというわけです．
(略)
「活発に研究していること」は，ゼミや行楽・飲み会の風景の写真に，年月日と，ちょっとした説明文を書けばいいでしょう．これは，将来この研究室に入ってもらう人，それと，卒業/修了したけど研究室はどうなっているのかなと（研究室訪問をする余裕はないけれど）知りたい人のための情報です．大型機器がやってきたなら，写真撮影のチャンスです．

研究室広報係のすすめ

先々週の金曜日に，研究室の前期ゼミとして，自分のWebページの刷新をリクエストしました．
2週間後となる明日，集まって検討します．

Webページ刷新のためのひとりブレスト
  • Cglos（シー・グロス）は，C言語でよく使われる言葉とその読み方を知ることのできる，Webアプリケーションです．
  • Euclid_js（ユークリッド・ジェイエス）は，ある整数解を求める問題を，拡張ユークリッド互除法を使って解いてくれます．
  • zjs（ズィー・ジェイ・エス）は，時間に厳格な，学会発表や，大学の卒業研究発表会などで，秒単位で時間を管理するためのアプリケーションです．
  • nlmate（エヌエルメイト）は，「2重ループを自由自在に書けるようになりたい」という人を支援する，小さなソフトウェアです．
アプリケーション紹介をつくる

ただし，自身の性格に関して，叱ることへの感度よりも，笑うことへの感度が異様に高いことを指摘しておかないと，不公平かもしれません．ここでいう「感度」は「すぐ叱る」「すぐ笑う」と言い換えられます．先日の前期ゼミで，印字したレイアウト案が学生のところで笑いとともに止まっていて，いいから見せろと言って一瞥した瞬間，異常な縮小設定がかかっていて，A4用紙のうち 3cm平方くらいに，1文字が1mm足らずの大きさで打ち出されていたのには，笑い涙なしではいられませんでしたね．何だったんだオレは…．

叱りへの耐性

今年度は，Webページの刷新です．当初予定では，先週金曜日のゼミでほぼ完成し，週末にこちらでセッティングして，本日リニューアル，だったのですが，私も学生もいろいろなところができておりませんので，少々先延ばしにします．ゼミ自体は，集まれる日時の都合もあって先週でおしまいです．前期にやってきた3年生4人も加え，4班作って班ごとに1人，3年生が入る形となりました．あるページのレイアウトについて，3年生と4年生が作り，こちらでは学年を意識せずに見比べて，最終的に3年生が作った方を選んだ，ということもありました．

来年度以降の前期ゼミ

Webページのリニューアルの前に，研究室の理念を見直しました．

理念を見直す

*1:具体的には，「研究発表」「前後期の授業開始と終了」「行事」です．

*2:院試の人もいました．

*3:プログラムは非公開です．写真の小型化処理も，スクリプトファイルを作っていて，それも非公開です．

*4:おかしな処理をしてしまったり，何らかのエラーでファイルそのものがなくなったりしても，復旧できるのは，Subversionで管理しているからこそです．

*5:jQueryを自習しました．アコーディオンメニューが簡単に作れるのですね．後期の授業ページにも，使うことにします．

*6:もしソースを取り寄せて読んでみたい方は，css/char.cssの「.abox」をご覧ください．クラス名や記載内容は，今後変わる可能性があります．

*7:ログ自体は，去年から，毎週1回の頻度で自動で取得しています．