パスワードを忘れた? アカウント作成
27876 story
プログラミング

横スクロールをお手軽に実現 35

ストーリー by hylom
次は縦書き? 部門より

hayakawa 曰く、

ASCII.jpの記事によると、縦スクロールではなく横スクロールなページを簡単に作成可能なJavaScriptライブラリである、「bookreader.js」なるものが公開されているようです。

このような動きをするものとしてはFlashを使用したものがあるかと思いますが、なかなか簡単に作るとは言い難いと思います。その点このライブラリを使用すると、既存のWebサイトにも簡単に導入可能なようです。 HTMLヘッダ部分にJavaScript読み込み処理を記述し、本文全体をDIVタグで加工だけでOKという手軽さのため、既存のWebサイトに対しても大幅な変更なく導入可能となっているようです。現時点では「ライセンスを検討中(APL2が有力)」といった状態なためフリーソフトウェア/オープンソースソフトウェアとは違いますが、使用自体は無料で可能なようです。

あまり長いと表示されるまで時間がかかったり、非力なマシンではフリーズしてしまったかのように見えてしまうようですが、ちょっと長めのテキスト(マニュアルやオリジナルのポエムなど)を扱っているサイトで使ってみるのもおもしろいかもしれません。

この議論は賞味期限が切れたので、アーカイブ化されています。 新たにコメントを付けることはできません。
  • あとは (スコア:2, おもしろおかしい)

    by Anonymous Coward on 2008年06月17日 14時32分 (#1365240)
    袋綴じができれば(違
  • 公開先の『テキストを予め複数の「ページ」に分けておき』という説明が気になったのですが(そうなるとHTMLの概念と反しますよね?)、特に1ページごとに分割しなくともきちんと続けて表示されるようです。

    レイアウト的には、思った以上に読みやすく感じます。使いどころを探したくなるような面白い仕掛けだと思いました。
    • by Anonymous Coward on 2008年06月17日 11時58分 (#1365140)
      致命的な欠点が一つ。
      テキストを選択できない。これ、なんてコピペ禁止?

      自分は読んでいる箇所をドラッグして反転させながら読むので、こういうやり方をされると自分の読んでいる箇所を見失いがち。

      これを何とかしてもらえると、ほどほど良いのですが。

      #テキストレイアウト幅を狭くすれば同じぐらい読みやすいのではないかと思ったのは秘密。
      親コメント
  • by Anonymous Coward on 2008年06月17日 12時28分 (#1365160)
    先頭または最後のページでさらに存在しないページの方へ移動しようとすると、
    iPod touch みたいなバウンド動作が入っています。
    これはこれで楽しいんですが、先頭では移動する方向が逆のような気がしてなりません…。
  • by hasbay (7390) on 2008年06月17日 12時43分 (#1365165)
    ×事態
    ○自体
    • Re: (スコア:0, オフトピック)

      すいません、修正しました。
      • by Anonymous Coward
        別ストーリーでもオフトピバンバン付いてるけど、梨の礫の編集者よりはずっとありがたいので
        これからも続けてください、カルマ減っちゃうけど

        編集日記とかの方が良いかな?
  • h2あたりで強制改行するようにすれば、そこそこ読みやすくなるかも。画像があった場合の処理とか、どうなるかわかんないけど。

    ただ、フォントが大きいと、横幅が足りなくて、文字が欠ける...。作者さんに伝えた方がいいのですかね。
  • by Anonymous Coward on 2008年06月17日 11時09分 (#1365113)
    縦スクロールでも表示効果で視線移動が発生しないようにすればいい話だよね
    • by Anonymous Coward on 2008年06月17日 12時43分 (#1365164)
      でも、というか
      縦スクロールでは発生しなかった視線移動が、横スクロールでは発生してるんですが……

      縦スクロールの場合には
      ・行内の文章を追う横移動
      ・次の行へと移る縦移動
      の2つがありますが、スクロールによって次行は「目が見ている位置」に来るので
      縦移動は発生しませんし、また行内の文章も特に大きくは視線を移さなくても読めます
      人間の目は横に並んでいるので、横方向の視野は広いですもの

      一方この横スクロールの場合には
      ・行内の文章を追う横移動
      ・次の行へと移る縦移動
      のうち、行内の文章は一目で読めますが
      次行へは視線を移動させなければなりません
      また、ページが移るたびに行の位置がトップからボトムへと移動するため
      視線を大きくジグザグに移動させなければなりません

      ……もしかして、普段から視線を移動している人の方が多いのでしょうか?
      私の場合は、私が見ている(物理的な)モニタの位置はほぼ一定ですが
      モニタの上から下まで舐めるように読み、一画面分スクロールさせてまた上から下まで読む
      という(本と同じ)読み方をしている人にとっては、同じような動きをするので読みやすいのかもしれません

      親コメント
  • by Anonymous Coward on 2008年06月17日 11時12分 (#1365115)
    巻物のように読めると小説なんかも読みやすくなると思うけどなあ。
    • by Anonymous Coward
      縦書きは、CSSで対応済みだから特に設定不要じゃないですかね。

      …縦書きのサイトってまず見ないですけど。
      フォントデザイン(文字間とセンター位置)の問題で、大抵は読みやすいものでも無いです。
      [dinf.ne.jp]

      小説とか、読みやすそうなのは同意。
      ページ切り替えで画面遷移しちゃうより、ストレス無く閲覧できそうです。

      ただ、ページビューが稼げないので、広告収入得るには不向きですね。
      ニュースサイトなどに普及して欲しい方式なんですけど、望み薄ですかね。
      • by Anonymous Coward
        すみません。「例」のサイトなんですけど普通に横書きで表示されてしまうのですが。

        Firefox2で表示関係のアドオンはなし。
        JavaScriptは許可にしたのですが(cssだから関係ないとは思いますが)。

        ついでにテスト。
        ・Firefoxで純正エンジンだと横書き表示
        ・IE6だとS-JIS扱いで真っ白に。文字エンコーディングをEUCに指定しなおすと縦書き表示OK。
        ・FirefoxでIEエンジンにすると真っ白。文字エンコーディングをEUCにしても変わらず真っ白。
        ・Operaも横書き
        IE専用cssなんでしょうか?
    • by Anonymous Coward
      scroll:【名】巻物{まきもの}

      ん?
      • by Anonymous Coward
        海外の巻物は横書き縦スクロールですな

        イメージとしては羊皮紙に書いた伝令とか

  • 必要性が理解できない (スコア:0, フレームのもと)

    by Anonymous Coward on 2008年06月17日 11時40分 (#1365135)
    こういう既存のインターフェースを無闇に否定して、「俺様が考えたインターフェースは見易いだろう」的な価値観の押し売りをするのはやめてもらいたい。
    この横スクロールも、自分には特に読み易いとは思えなかったうえに、マウスホイールでのスクロールが使えなくなってたりとか、ある意味嫌がらせに近い。

    # でも、JavaScriptを切れば(概ね)普通のページになるのは良いつくりだと思った。
    • by Anonymous Coward on 2008年06月17日 12時11分 (#1365148)
      こういう新しいインタフェースを無闇に否定して、「既存のインタフェースの方が見やすいだろう」的な価値観の押し売りをするのはやめてもらいたい。

      こういうのを有効に使える表現が何かあるだろうとか、想像力が働かないんでしょうかね?
      親コメント
      • by Anonymous Coward
        >こういうのを有効に使える表現が何かあるだろうとか、想像力が働かないんでしょうかね?

        先に示すのが筋だろう
        • by Anonymous Coward
          絵本的表現。
          特に見開きページ
        • by Anonymous Coward
          全然筋じゃありませんが。
          無暗に噛みつく姿勢を批判されてるだけですよ、あなた。
          • by Anonymous Coward
            新しいものが出てくると古いものが否定された気になって攻撃的になる人って、結構いますね。
            #必ずその新しいものも有用というわけではないですが。
            まだ具体的なビジョンを持って否定するならともかく、「ダメじゃない証拠を示さないならダメだ!」って、自分がしている否定の根拠までも人任せでは……
            • by Anonymous Coward
              否定している人は「マウスホイールでのスクロールが使えなく」と具体的な根拠のひとつを挙げていますので、単に「ダメじゃない証拠を示さないならダメ」ってだけではなさそうです。

              ちなみに僕は現状では肯定も否定もできないのですが、ホイールなし2ボタンマウスがほとんど見られなくなった現状のように、横スクロール対応ホイールを搭載したマウスが今度普及したら面白い展開になりそうな気もしますね。
      • by Anonymous Coward
        > こういうのを有効に使える表現が何かあるだろうとか、

        それを本末転倒と考えるヒトの気持ちには共感できる。

        まぁ、余計な心配しなくても、
        奇を衒った表現は非常に限定された場所でしか使われないけど、
      • by Anonymous Coward
        だってそもそも新しくも何ともない [usability.gr.jp]し。下手の考え休むに似たり。
    • 情報を横方向に並べる+ページ切り替えってのは、昔からわりと普通にあるインタフェースじゃないかなぁ。
      HTML+JavaScriptで実装しましたよってところが新しいだけで。
      親コメント
      • by Anonymous Coward
        >HTML+JavaScriptで実装しましたよってところが新しいだけで。

        動きでいえば、コンテンツをスライド表示するjavascript「glider.js」 [skuare.net]とか、まんまかと。
        そもそも、スライド的動きとかのエフェクトってのは比較的容易なもので、
        最近のjsフレームワークで実現されているそれを使えば苦労なく実装できる。
        基本的に、画像でおこなってる事 [coliss.com]をブロック要素に対応させればいい。
        1ページのコンテンツを分割表示するアイデアとなると、これ [kanzaki.com]や
        • by Anonymous Coward
          少なくとも#1365135の人はこのタレコミを読んで「使いにくい新技術が登場した」と思った訳ですから、「知らない人にそれを知らせる」という価値はあったんじゃないですか。
    • by Anonymous Coward
      価値観の押し売りとか嫌がらせって、利用を強制でもされたんでしょうか?

      見なければいいだけじゃないの?
    • by Anonymous Coward
      別に"既存のインターフェースを無闇に否定して"るわけじゃなくないですか?自由に選択できるツールが増えただけで。
      アレゲに冗長性は大事ですよ。
      ほら、このコメントも↑
    • by Anonymous Coward
      ギークたるもの役に立とうが立つまいがとりあえず実装してみるものじゃないですか^^
      そのうち淘汰されて落ち着くところに落ち着くものですし。
      Win95が登場したときにも誰もがトレイアイコンに手を出したおかげで一時はひどいことになったものです。
  • by Anonymous Coward on 2008年06月18日 0時16分 (#1365629)
    ラスタースクロールとか・・・

    #言ってみたかっただけなのでAC
typodupeerror

未知のハックに一心不乱に取り組んだ結果、私は自然の法則を変えてしまった -- あるハッカー

読み込み中...