読者です 読者をやめる 読者になる 読者になる

anti scroll

ブラウザと小説の新しい関係を模索する

Windows版のChromeでフォントが見づらくなっている件について

縦書き文庫

この辺の議論を見る限りでは、Windows版のChromeはversion52からDirectWriteを採用したらしく、その影響でフォントがギザギザに表示されてしまっているようです。

本来はDirectWriteで綺麗になるはずなのですが、まだ色々と調整中なのかもしれませんね。

ちなみに、chrome://flagsあたりで、あれこれパラメーターを調整するとDirectWriteが無効化されて元に戻るらしいので、どうしても気になる方はやってみてください。

常時SSL化とHTTP/2に対応しました

縦書き文庫

なかなか大変でしたが、常時SSL化とHTTP/2の対応が完了しました。

以下はHTTP/2 Testの結果

f:id:convertical:20161230113534p:plain

ちなみに、HTTP/2 and SPDY indicator - Chrome Web Storeを入れた上でアクセスすると、青いイナズマがピカっと光って気持ちがいいです(笑)。

f:id:convertical:20161230113356p:plain

縦書き文庫でゲームブックを作る方法

縦書き文庫

ちょいネタですが、縦書き文庫ではアンカーリンクによる内部ジャンプが使えるので、ゲームブックのような仕組みを簡単に実現できます(動くサンプル)。

やり方はシンプルです。

テキストをチャプターに分けて、それぞれのチャプターに「チャプター番号」のアンカーを貼ります。

で、それぞれのチャプターには「ページ内リンク(href=#チャプター番号)」を使ってジャンプすればよいのです。

例えばこんな感じです。

<a name="1"></a>
先頭ページのテキスト
<a href="#2">続きへジャンプ</a>
[page-break]
<a name="2"></a>
次のページのテキスト
<a href="#1">先頭ページに戻る</a>

選択肢を作る

選択肢を作ることもできます。

<a name="1"></a>
恋人がサンタクロース!
どうする!?

<a href="#2">受け入れる</a>
<a href="#4">無理。別れる</a>
[page-break]

<a name="2"></a>
恋人がサンタクロース!
背の高いサンタクロース!
どうする!?

<a href="#3">すべてを受け入れる</a>
<a href="#4">無理。足を切り落とす</a>
[page-break]

<a name="3"></a>
お幸せに!
<a href="#1">先頭に戻る</a>
[page-break]

<a name="4"></a>
破局しました!
<a href="#1">先頭に戻る</a>

読んでいるチャプター以外のテキストはネタバレになってしまうので、チャプター番号ごとに改ページしています。

こういうのって、紙の本だと(たぶん紙がもったいないから)同一ページに別チャプターのテキストが並んでしまうのですが、電子媒体ではそんなことを気にする必要がないのが嬉しいところです。

あとチャプター番号も、紙媒体のゲームブックだと、隣接するテキストによるネタバレを防ぐため、ランダムなチャプター番号へ移動させますが、電子媒体では改ページし放題なので、その必要はありません。

実際にやってみると「あれ? 意外と書きやすいかも?」って感じでした。

課題

ただし課題もいくつかあります。ざっと上げるとこんなところでしょうか。

  • ページ送りボタンで移動できてしまう
  • まだ組版が済んでいないページにはジャンプできない(待たされる)
  • 選択肢によってページをジャンプする影響で、ページ送りによるポイントが付きにくい

いずれも致命的な欠点というほどでもない気がするのですが、最後の「ポイントが付きにくい」ってのは、ちょっとまずいかもしれませんね。

サーバーメンテナンスの告知

縦書き文庫

本日の17:00〜19:00ぐらいまで、サーバーのメンテナンスを行います。

ご不便をおかけしますが、よろしくお願い致します。

表示設定をリセットするボタンを追加

縦書き文庫

表示設定を初期化して、デフォルトの設定に戻すボタンを追加しました。

f:id:convertical:20161202080056p:plain

青空文庫の注釈(割注)に対応しました。

縦書き文庫

青空文庫の割注は、ほとんどが原文の漢字に関する情報で、一般の読者にとってはあんまり必要のない情報だったりします。

というわけで、普段は注釈の中身を本文から隠しておき、アイコンをクリックしたらポップアップする、というようにしました。

f:id:convertical:20161110130145p:plain

iのアイコンをクリックすると

f:id:convertical:20161110125950p:plain

のようにポップアップします。

自作で利用するには

こんな風にマークアップしてください。

飛び級しすぎたメガネ男子<span class="notes">メガネをかけた若い男性</span>とは、お前のことか?

その他にも縦書き文庫には補足(チップ)記法もありますので、そちらもよかったら使ってください。

Googleの検索結果でリダイレクトとトラッキングを無効化する

programming

Googleの検索結果からリンクをコピーして貼り付けたら、めちゃくちゃ長いリダイレクト用のリンクになっていて「ふぁ??」となることがあります。

なので、それをなんとかしてくれる拡張機能を探したのですが、しっくり来るのがなかったので自作することに。。。

拡張機能のソース

// manifest.json
{
  "name": "Disable google search tracking",
  "version": "0.1",
  "manifest_version": 2,
  "description": "Disable google search tracking",
  "permissions":[
    "tabs", "http://*/", "https://*/"
  ],
  "content_scripts": [
    {
      "matches": ["http://*/*", "https://*/*"],
      "js": ["content.js"],
      "run_at": "document_idle"
    }
  ]
}

// content.js
(function(){
  setTimeout(function(){
    document.querySelectorAll("h3.r>a").forEach(function(link){
      var a = document.createElement("a");
      a.href = link.href;
      a.innerHTML = link.innerHTML;
      link.innerHTML = "";
      link.appendChild(a);
    });
  }, 100);
})();

仕組み

リンクエレメントを直接どうこうしようとしても、Google側のjsで強引に書き換えられてしまうので、リンクエレメントの子に非Redirectなリンクを挿し込む方法を取りました。

こうすれば、リンクのクリックイベントは最深の子のみで発火するので、親リンクのRedirectとトラッキング用のイベントハンドラは無効化されます。

これで純粋なリンクのみがリストアップされたクリーンな検索結果になりました。

主要ゲーム機のタイトル数

game

なんか気になってしまったので、amazon.co.jpで確認した感じだとこうでした。

総タイトル数

ハード 総タイトル数
3ds 2584
vita 1641
ps4 1211
one 520

タイトル数は3dsダントツでトップでした。

あと、vitaのタイトルが意外と多いんだなあっていう印象でした。

年間あたりのタイトル数

ハード タイトル数
3ds 516
ps4 400
vita 328
one 270

リリーススピードも3dsがトップなのですね…

しかし、ps4は次世代機なのに、年間400タイトルも出てるのか!って思いました。

ちなみに北米では

ハード 総タイトル数
3ds 1556
ps4 969
one 900
vita 602

ちなみにamazon.com調べだとこんな感じでした。

北米ではps4もxbox oneもタイトル数にほとんど変わりがないのが印象的です。

あと日本のほうが3ds、ps4、vitaのタイトル数が多いです。

海外企業は日本でもほぼ同時にリリースしますが、日本企業は海外でのリリースが遅れるので、相対的に日本のソフト数が多くなってるんだと思います。