スタッフブログ Staff Blog

年末年始休暇を利用して「AS情報を作成するためのテスト」に協力

新しい年を迎え、当社も昨日より2019年の営業を開始いたしました。本年もより一層のお引き立てを賜りますようお願い申し上げます。

さて、年末年始は1月4日を年次有給休暇とし、9日間の休暇とさせて頂きました。12月はセミナーや会議での登壇、また健康診断があり少々慌ただしかったことから「ゆっくり休みたいな」と思いつつも、9月から始めた週2回のスポーツクラブ通いに加え、自宅の掃除、神社の参拝など、やらなければならないことがたくさんだったなと考えています。

そのような中、9日間休暇があると仕事に関する事以外で「Webに関する何か」をやりたいな、という思いも出てきます。何かないだろうか?と考えていたのですが、12月26日にウェブアクセシビリティ基盤委員会より「AS情報を作成するためのテストへご協力のお願い」が公開されました。2018年後半は私自身あまりWebアクセシビリティ関連に関わることができていなかったため、「これなら私でもお役に立てそうだ」と思い、年末に時間を作ってテストに励みました。

※ちなみに、「アクセシビリティ・サポーテッド(AS)」とは、ある実装技術(例えば画像に代替テキストを付けること)がユーザーエージェント(ブラウザ等)や支援技術によって実際に利用できるようになっている状態を指します。

テストを通してmacOSに搭載されているVoiceOverの操作を改めて学習するきっかけにもなりましたし、「テーブルの見出しセルにscope属性を付けると予想通りこう読み上げられるな」とか「こう読み上げられると思っていたけれど、このブラウザと支援技術の組み合わせでは意図した読み上げにならないのだな」という現状を知る事ができました。

これまでにmacOS上のFirefox + VoiceOverの組み合わせ、またFirefoxのみでのテストを終えたところです。まだテスト期間は続いていますので、Windows上のFirefox + NVDAの組み合わせでテストを進めています。私のテストがAS情報作成に少しでも役立てば幸いです。

今年も仕事で、またプライベートでWebアクセシビリティ関連の取り組みを続けてまいります。直近では、1月26日に開催される「第5回 福山IT座談会」にて、VoiceOverの実演をしてみようと考えています。

仕事納めランチ。

本日12/28は、今年最後の出社日でした。

昨年までは朝からみんなで大掃除をして仕事納めランチへ行っていたのですが、あまりの水の冷たさに今年から年末の大掃除はやめて、GW前に行うことにしました。

お湯が出ない環境なので冷え性にはとっても辛いのです。。。

暖かい時期の方が汚れも落ちやすいですしね。


今年もいろいろありましたが、おかげさまで良い年となりました。

お世話になったみなさま、ありがとうございました。
良いお年をお迎えください。

なお、年始は1/7(月)より通常営業となります。
来年もどうぞよろしくお願い申し上げます。

PowerCMS 5を利用したレコメンド機能にまつわるTips

PowerCMS 5によるレコメンド機能 | PowerCMSブログ」を参考に、関連記事とユーザー毎におすすめ記事を表示する作業を行いました。Google AnalyticsとVisitor Analytics、そしてPowerSearchを利用した興味深い実装でした。

ただ、お客様の環境で作業を進めていてすんなりといかない点等がありました。今日は案件でスムーズに進まなかった点や工夫すると良くなりそうな点をご紹介いたします。

一部のページだけ関連記事が出ない

テンプレートやレコメンドAPI、Google Analyticsの準備をしっかり整え関連記事が表示されるようになったのですが、一部のページだけ関連記事が表示されない現象が発生しました。

現象を探っていると関連記事が表示されないのはフォルダ名に全角括弧が含まれている場合のようでした。ドラフトファイルをよく見てみるとmetadata属性(詳細はPowerCMSブログをご覧ください)に列挙しているカテゴリ名の全角括弧が半角括弧になっていました。全角括弧が半角括弧になるのはis_draftモディファイアを使用するとUnicode::Normalize::NFKC( $text )の処理が入るためで、これにより検索に上手くマッチしなくなるようです。

そこで、括弧がある場合は括弧を取り半角スペースを入れて2つのキーワードに分割することとしました。例えばアクセシビリティ(A11Y)だとアクセシビリティ A11Yです。

ドラフトファイルはregex_replaceで置換を行いました。

metadata=<mt:PageFolder glue=" "><mt:FolderLabel regex_replace="/(\(|()(.*?)(\)|))/"," $2" is_draft="1"></mt:PageFolder> <mt:PageTags glue=" "><mt:TagName is_draft="1"></mt:PageTags>

レコメンドAPIにも括弧がある場合の処理を追記しました。

$entry = $type == 'entry' ? $mt->db()->fetch_entry( $entry_id )
                          : $mt->db()->fetch_page( $entry_id );
if ( $entry ) {
    $interests = [];
    (中略)
    $categories = $entry->categories();
    foreach( $categories as $category ) {
        $label = $category->label;
        preg_match( '/(.*)(\(|()(.*?)(\)|))/', $label, $matches );
        if ( $matches[0] ) {
            // 括弧が含まれる場合は2つのワードに分割
            if (! in_array( $matches[1], $interests ) ) {
                $interests[] = $matches[1];
            }
            if (! in_array( $matches[3], $interests ) ) {
                $interests[] = $matches[3];
            }
        } else {
            if (! in_array( $label, $interests ) ) {
                $interests[] = $label;
            }
        }
    }
    $interest = join( ',', $interests );
}

この対策により、無事関連記事が表示されるようになりました。

ビジターデータに興味・関心がセットされない

ウェブサイト配下のブログを閲覧しても、ウェブサイトに蓄積しているビジターデータの「興味・関心」にデータがセットされない状況が起こりました。

しばらく悩んだのですが、ソースコードを読んでみるとmy $blog_ids = MT->config->VisitorAnalyticsInterestBlogIDs || MT->config->VisitorAnalyticsBlogID;とあり、環境変数VisitorAnalyticsInterestBlogIDsでビジターの興味・関心を解析する際に対象とするウェブサイト・ブ ログIDをカンマ区切りで指定する必要がある事が分かりました。

マニュアルは冷静に読まないといけないですね。

おすすめ記事を全ブログから抽出したい

標準では閲覧しているページと同じブログを対象に検索を行いおすすめ記事を表示していますが、ウェブサイト配下の全ブログから抽出することはできるのだろうか?と考えました。しかも今回作業したサイトには複数のウェブサイトがあり、上手く検索をかけないと違うウェブサイトのページをおすすめ記事に表示してしまう可能性があります。

どのようにすれば実現できるか...と考えたのですが、レコメンドAPIでおすすめ記事の検索を行う際に独自の属性を利用すれば良いことに気付きました。例えばwebsite_idを属性を作るのです。

ドラフトファイルでは以下のようにします。

website_id=<mt:WebsiteID is_draft="1" />

レコメンドAPIは以下のように変更します。(ウェブサイトのIDは1とします。)

if ( $type == 'visitor' ) {
    $attr .= ' -attr "website_id NUMEQ 1" ';
} else {
    if ( $blog_id ) {
        $attr .= ' -attr "@blog_id NUMEQ ' . $blog_id . '" ';
    }
}

まとめ

PowerCMS 5を利用したレコメンド機能を使いこなすには、Visitor AnalyticsやPowerSearch、そしてGoogle Analyticsとさまざまな知識が必要だなと分かりました。記事では扱いませんでしたが、Google Analyticsの設定の都合上、複数のトラッカーを使用する必要もありました。

PowerCMS 5でレコメンド機能を扱われる方の参考になれば幸いです。

大阪出張へ行ってきました。

12月14日(金)は会議への参加のため、スタッフ総出で大阪へ行っておりました。

会議では参加者一人ひとりが発表する場が設けられており、
1人10分という持ち時間で、与えられたテーマに合わせて発表しました。

今回のテーマは「5年後の会社と5年後の自分」。

発表中の吉田くん

発表中の英樹くん

発表中の優弥くん

あまりこういう話を社内でする機会もなく、
みんなが現状あるいは近い将来についてどう考えているのかを聞けて参考になりました。

今回は私と英樹くんが表彰されました!



休憩時間中の窓からの景色。

中之島公園

ここは中之島公園ですが、ちょうど、光のアートフェスティバル「OSAKA光のルネサンス 2018」の開催期間中だったようです。

写っているのは台湾のランタンで、この右の方にはスノーマンもありました。(終了後の移動時に見たかったのですが余裕がなくて見れず><)

翌日行く機会があったので近くで見てきましたが、土曜日の昼間は立ち入り禁止になっていてスノーマンも片づけられていました。

ランタン全体

ランタンアップ

ランタンアップ


子どもたちが書いた笑顔のイラストの中にLEDを入れた「ひかりの実」。
来場者が作るワークショップもあるようでした。

ひかりの実

PowerCMSに付属の「PowerSearchプラグイン(エンタープライズ検索)」の理解を深める

最近PowerCMSに付属の「PowerSearchプラグイン(エンタープライズ検索)」を使用し、指定の期間に公開された記事を抽出して表示する機能の実装を行いました。その際、どのようなクエリストリング・テンプレートにすれば良いのか、マニュアルを読んでもなかなか答えにたどり着くことができませんでした。

そもそも、PowerSearchはインデックス型の検索エンジンである「Hyper Estraier」を利用したシステムです。そこで、Hyper Estraierを自分のマシンであるMacにインストールし、コアであるHyper Estraierについての理解を深めることにしました。

インストール方法

  1. 公式サイトからパッケージをダウンロードし、展開します。
  2. ターミナルを開いて1.で展開したディレクトリに移動し、./configureを実行してビルド環境を設定します。
  3. make macを実行し、プログラムをビルドします。
  4. make install-macを実行し、プログラムをインストールします。

Macの場合はmake macmake install-macになるのがポイントです。正しくインストールできた場合、estcmdを実行するとestcmdの詳細が表示されます。

ドラフトファイルの作成

適当な内容でドラフトファイルをいくつか作成します。文書ドラフトはHyper Estraier独自のデータ形式で、詳細は公式サイトのユーザーガイドに記載があります。

今回は特定の期間に公開された記事の抽出についてコマンドラインでテストをしたいので、@cdate属性のみ丁寧に作り、後の情報は適当に埋めました。(PowerCMSで検索を行う際は、テンプレートを書いて丁寧にドラフトファイルを作成して下さい。)

@uri=https://www.anothersky.pw/test/2018-06-02-002.html
@title=テスト2018-06 02-002
@cdate=2018-06-17T15:31:18+09:00
@suffix=html
@blog_id=1
@entry_id=1

テスト2018-06 02-002

インデックスの生成

Hyper Estraierで検索を行う際は、事前に対象文書の情報を登録したインデックスを準備する必要があります。以下のコマンドを実行することでインデックスが作成できます。

estcmd gather -il ja test.index ./draft

-il jaは文字コードの指定、test.indexはインデックスのデータベース名です。

以下のような内容が表示されると、インデックスが正常に生成されています。出力にregisteredが見えるか、その左にあるドラフトファイルのパスが目的のファイルになっているかを確認しましょう。

estcmd: INFO: reading list from the directory: ./draft
estcmd: INFO: status: name=test.index dnum=0 wnum=0 fsiz=6899176 crnum=0 csiz=0 dknum=0
estcmd: INFO: 1 (/Users/[ユーザー名]/hyperestraier-1.4.13/draft/draft_test.est): registered
estcmd: INFO: 2 (/Users/[ユーザー名]/hyperestraier-1.4.13/draft/draft_test2.est): registered
estcmd: INFO: 3 (/Users/[ユーザー名]/hyperestraier-1.4.13/draft/draft_test3.est): registered
estcmd: INFO: 4 (/Users/[ユーザー名]/hyperestraier-1.4.13/draft/draft_test4.est): registered
estcmd: INFO: flushing index words: name=test.index dnum=4 wnum=1 fsiz=6901330 crnum=7 csiz=585 dknum=0
estcmd: INFO: closing: name=test.index dnum=4 wnum=8 fsiz=6901493 crnum=0 csiz=0 dknum=0
estcmd: INFO: finished successfully: elapsed time: 0h 0m 0s

検索の実行

estcmd searchで検索を実行します。公式サイトのユーザーガイドを見ながらひたすらコマンドを実行するのみです。「検索条件式」の項をじっくり読んで試しましょう。ヒットした場合、ヒットした数やURLが表示されます。

--------[02D18ACF123C0EEC]--------
VERSION 1.0
NODE    local
HIT 2
HINT#1  [UVSET] 4
TIME    0.001362
DOCNUM  4
WORDNUM 8
VIEW    URI

--------[02D18ACF123C0EEC]--------
2   https://www.anothersky.pw/test/2018-06-02-002.html
3   https://www.anothersky.pw/test/2018-06-02-003.html
--------[02D18ACF123C0EEC]--------:END

私の場合は「特定の期間に公開された記事の抽出」でしたので、以下のコマンドが正解であることが分かりました。-attrで属性インデックスの対象となる属性名とデータ型を指定しています。PowerCMSのマニュアルには記載がないものの公式サイトのユーザーガイドには記載のあるNUMBTが使えることが分かりました。-attrは複数指定ができるようです。

estcmd search -vu -attr "@cdate NUMBT 2018/06/24 2018/10/26" test.index

今回コマンドを実行してテストをしたことで、どのようにすると1日分の結果が出るのか(2018/10/25 2018/10/26とするのか? 2018/10/26 2018/10/26とするのか?)まで細かく調査ができました。

テンプレートへの落とし込み

どのような条件を与えれば目的の結果が得られるか分かれば、あとはそれをPowerCMSのテンプレート、もしくはクエリストリングへ落とし込むだけです。

私の場合は、テンプレートは以下のようになりました。add_attr="@cdate" add_condition="NUMBT"はコマンドを叩いてテストした結果を反映した条件指定です。set_order="@cdate" order_condition="NUMD"は検索結果の並び替えです。今回は検索クエリを使用しないため、no_query="1"も指定します。

<mt:EstraierResults no_query="1" set_order="@cdate" order_condition="NUMD" add_attr="@cdate" add_condition="NUMBT">

そして以下のようなURLを渡すとPowerSearchプラグインにおいても目的の検索結果が表示されました。

/apps/search?blog_id=10&target=10&limit=100&offset=1&@cdate=2018-9-1+2018-10-1&selected_category=2018年09月

ちなみにblog_idで指定されたウェブサイト/ブログにある「Hyper Estraier 検索結果」テンプレートを使用して、targetで指定したウェブサイト/ブログの検索結果を表示するというのもポイントでしょうか。これを上手く使えば内容と見た目の一部のみ違う検索テンプレートを上手くまとめることが可能です。selected_categoryのように、目的の表示を作るためだけに使う情報を送ることもできます。

まとめ

Hyper Estraierやestcmdについて理解を深めておくと、PowerSearchプラグイン(エンタープライズ検索)の利用がスムーズになると思います。テンプレートを作ったものの上手く表示されない時、サーバー上でestcmdを実行してみればインデックスに問題はないか等の調査ができるようになります。また、PowerCMS上で検索を実行するとテンプレート・プラグイン・Hyper Estraierが関係してきますが、コマンドラインだとHyper Estraierだけにターゲットを絞ることができ、答えを見つけやすくなることも期待できます。

コマンドの操作は苦手という方もいらっしゃるかもしれませんが、一度チャレンジしてHyper Estraierについて理解を深めてみてください。

お問い合わせ Contact

制作のご依頼、ご相談などは下記のフォームからご連絡ください。