【ニコニコ動画】コメント視聴環境の違い

【ニコニコ動画】コメント視聴環境の違い
目次

【ニコニコ動画】コメント視聴環境の違い

※この記事はFlash版プレイヤーのコメント仕様を書いております、HTML5版プレイヤーでは表示が異なります。

ニコニコ動画「コメント視聴環境の違い」を分かる範囲で書きます。

「各環境の特徴と対策が分かれば、ある程度互換性のあるＣＡが作れるかもしれない。」

結論
  • 妥協が必要。

どこまで対応させるかは、ＣＡ作成者が精密性と互換性を考えて、どこかを妥協して作成すると良いかと思います。

※ブラウザやＯＳ Ｖｅｒの違い、情報が古い場合等があり、情報が間違っている場合もありますので、参考程度に読んで頂ければと思います。

コメントアート（ＣＡ）を作る時に多くの人が対象にしている環境は下記です。↓

  • OS：Windows XP, Vista, 7 （ニコニコ動画推奨環境）
  • ブラウザ：Internet Explorer, Firefox（ニコニコ動画推奨環境）
  • プラグイン：Adobe Flash Player 10以降
  • プレイヤー：Ｑwatch中画面、原宿

この環境以外だと見え方が変わります。
各環境の特徴を簡単に書きます。

プレイヤー更新履歴
・2013/11/06　コメント表示の大画面＆フルスクリーン対応(第1弾)実装。
・2014/02/21　Chrome 33になりU+2588、U+2001等が「Lucida化」で全角幅に変わらなくなる。
・2014/03/18　コメント描画処理の更新。コメント行数が大文字３行、中文字５行、小文字７行以上の場合、コメント縦幅を1/2に縮小。

各環境の特徴

１．Windows OS+Ｑwatch大画面

  • 「コメントの拡大比率が違う。」

詳しく説明して頂いているブログがあります下記。↓
・Qwatch中画面・大画面両対応ＣＡについて【導入編】
ＵＲＬ：https://ch.nicovideo.jp/883797/blomaga/ar314439

２．Windows OS＋ブラウザGoogle Chrome　

  • 「フォント変化しない。」
  • 「U+2001が漢字幅よりもやや小さい。」


詳しく説明して頂いているブログがあります下記。↓
[コメントアート] Chrome pepflashplayer対応技術：U+2001の漢字幅化
ＵＲＬ： https://ch.nicovideo.jp/gottuttu/blomaga/ar40154
※Chrome 33になり使用不可になりました。

３．Mac OS X 10.7、10.8＋ブラウザSafari（ニコニコ動画推奨環境）

  • 「日本語の文字幅が同じ。」（Windowsの標準日本語フォントは文字幅バラバラ。）
  • 「フォント変化しない。」

詳しく説明して頂いているブログがあります下記。↓
フォント変化と明朝化DR10行固定
ＵＲＬ：https://ch.nicovideo.jp/meg_nakagami/blomaga/ar224487

４．Android OS+ブラウザAngel Browser（PC表示）

※AndroidはＰＣ表示にしないと話にならない位見れません、またブラウザによって見え方が変わってきます。ニコニコ推奨アプリや、スマートフォン表示だと文字の大きさがまったく違ったり、カラーコードが反映されません。私が知る限りの一番まともな環境が〈Angel Browser〉のPC表示です。

  • 「日本語の文字幅が同じ。」（Windowsの標準日本語フォントは文字幅バラバラ。）
  • 「フォント変化しない。」
  • 「文字が Windowsよりも少し小さく描画される。」

フォントは違いますが、Ｍａｃに特徴が似ています。

ある程度互換性のあるＣＡを作る為の方法

１．Ｑwatch大画面 対策

  • 中、大両画面の正比率と拡大比率の差が小さい文字サイズを選ぶ。

２．Chrome 対策

  • フォント変化しなくても影響のないレイアウトにする。
    ・U+2001使用時は漢字幅になる様、行頭に「ゼロ幅文字＋結合文字」（「U+202A」+　　「U+0655」）を入れる。（※ゼロ幅文字は幅が無く扱いが難しいです。）※Chrome 33になり使用不可になりました。

３、４．Mac OS、 Android OS 対策

  • フォント変化しなくても影響のないレイアウトにする。
  • 二重リサイズ固定を使用する。
    （二重リサイズは負荷が大きいので、あまり使用し過ぎない事を推奨。）（文章訂正済）
  • 文字が小さくなっても影響のないレイアウトにする。
    （文字が小さくなるというのは大きな問題でレイアウトがガラッと変わる為、かなりの妥協が必要です。コメントの高さを表示　領域と同じにする固定や積上げでズレが発生します。精密さを求めるＣＡはこの問題により　Ｍａｃ対応を諦めています。）
  • 全角スペース（Ｕ＋3000）を使わず、U＋2001 ｏｒ 半角スペースを使用する
    全角スペースはWinだと「27px」ですが、Macだと「39px」になってしまう為、使用を避けてMACでも幅の違いが少ないU+2001、又は幅が変わらない半角スペースを使用する。

続き↓

関連記事
【ニコニコ動画】互換性のあるコメントアートを作る方法

ある程度互換性のあるＣＡ（コメントアート）を作る為の具体的な方法ニコニコ動画で、〈ある程度互換性のあるＣＡ（コメントアート）〉を作る為の具体的な方法を紹介します。前回記事 ↓ の続きです。[sitecard sub[…]

ＣＡ違い２