忍者ブログ
管理人がどうやってオンライン小説サイトを作っていったのか、その実体験によるノウハウや悪戦苦闘の日々をつづるWEB小説制作日記ブログです。 ちょっと変わった独自システム付きのネット小説サイトを運営しています。

小説サイト制作を始めた当初、自分はあまりスマートフォンやタブレットでのサイト閲覧を想定していませんでした。
 
そもそもサイト制作開始当初はタブレットもスマホも持っておらず、PC(パソコン)とスマホ・タブレットとの使い勝手の違いなど、まるで分かっていなかったというのもあります。
 
…で、ほぼPCで閲覧した場合のことのみを考えて、サイトの利便性やエンターテイメント性などを追求してきたわけですが…
 
タブレット端末を購入して実際に自分のサイトを閲覧してみた際、重大な事実に気づきました。
 
それは「タブレットだとロールオーバー効果が無意味なモノと化している!」という事実です。
 
ロールオーバーとはPCなどでサイトを閲覧している際、マウス(矢印ポインタ)をボタンや画像などの上に持って行くと、そのボタンや画像がマウスが乗っている間だけ変化するという効果です。
 
しかしタブレットやスマホには、そもそもマウスが存在しません。
 
自分はこのロールオーバー効果を使い、メニューボタンや項目名の上にマウスが来れば、そこに描かれたマスコットがフキダシでその内容を案内してくれるだとか、
    

    

オリジナルノベル・ロゴ
ファンタジー小説サイト「言ノ葉ノ森」TOPページの項目名ロゴ。
 マウスONで小鳥の左上にフキダシで説明が出ます。)

あちこちマウスを動かしてみると、マスコットのセリフが変化したり
   
 
プロフィールページの「ビジュアルガイド」から。
 プロフィールページはマウス(矢印カーソル)位置により猫のセリフが変化します。
 (一定時間放置していても変化はしますが…。)
 
隠しキャラが出現したり、
   
星見表
   ↓
隠しキャラ1
 
隠しキャラ2
(いくつかある★のうちのどれかの上にマウスをONすると、隠しキャラが出現)
 
画像が変化するなど、
   

空織のドレス(昼)昼のドレス
「夢見の島の眠れる女神」9章の「空織のドレス」用語解説にある画像。
 マウスONでドレスに鳥が現れます。)
 

「夢見の島の眠れる女神」9章ルビ有・ファンタジーレベル強Ver
 「空織のドレス」用語解説にある画像。
 マウスONでドレス画像が夕焼け→夜→朝焼けに変化します。) 
 

「夢見の島の眠れる女神」3章の「ラウラ」の用語説明にある画像。
 マウスONでちびキャラが動き出します。)
 
様々な「しかけ」をサイトに施していたのですが、それがほとんど意味の無いモノと化し、PCで見た時に比べ、スマホ・タブレットで見た際に面白さが半減してしまうという事態が発生してしまいました…。
 
まぁ、タブレット等であっても、マウスを乗せる代わりにその部分をタップ(タッチ)することで、ある程度ロールオーバー効果を発動することはできます。
 
が、適当にぐるぐるマウスを動かしていれば発見できるPC版とは違い、スマホ・タブレットの場合は「そこを狙ってタップ」しないと効果が発動しない分、「隠しコマンド」的に隠されたロールオーバー効果を見つけるのはなかなか大変だと思います。
 
それに、ロールオーバー効果のついたボタンが「他のページへジャンプするリンク」のボタンになっている場合は、タップすると他のページへ移動してしまうので、すぐにはロールオーバー効果が見られません。
(他のページへジャンプした後、元のページへ戻るとタップした部分の画像が変わっているのですが、わざわざ戻って確認する方はなかなかいないと思いますので、やはりここでもロールオーバー効果は見つけづらくなってしまうと思います。)
 
残念ながら、この問題を解決する手段は現在まだ思いついていません。
(ネット検索すると「スマホでのロールオーバーの代替手段」のような記事はいくつか出てくるのですが、結局はタップしないといけなかったりするので「それだと意味が無いんだよなー…」という感じで、結局解決策が見出せないままでいるのです…。)




ちなみに、マウスONしなくても自動的にアニメしている「しかけ」も存在します。
   ↓

「夢見の島の眠れる女神」9章ルビ無・ファンタジーレベル強Ver
 「空織のドレス」用語解説より。)
 

「夢見の島の眠れる女神」9章ルビ有・ファンタジーレベル弱Ver
 「空織のドレス」用語解説より。)

拍手[0回]

PR

小説サイト「言ノ葉ノ森」で、Google ChromeやSafariなどの一部ブラウザでレイアウト崩れを起こすページがいくつかあった(現在もいくつかある)ということは以前の記事で書きましたが、それに自分が気づいたのは、ユーザー様からのご指摘があったとかではなく、全くの偶然でした。

そういったレイアウト崩壊や、他にもたとえばリンクエラー(ボタンをクリックしてもその先のページへ飛べなかったり、違うページに飛んでしまったりする等)などのWEB制作上のミスというのは結構起こり得るものだと思っているので、「言ノ葉ノ森」にもそういったエラーや不具合を報告するための連絡手段(アンケート・フォーム)が予め備えてあります。

しかし、実際にその機能を使ってエラーやミスを報告してくださった方は、現在までのところ一人もいらっしゃいません。

ほんのり悲しくはあるのですが、それもある種、仕方のないことだという思いはあります。

自分の身をユーザーに置き換えて考えてみれば分かることですが、たとえば初めて訪れたサイトがレイアウトが崩れてまともに見られなかったとして、それをわざわざ一手間かけてエラー報告するなんて、よほど親切レベルの高い人間でないと無理な気がしますから。

おそらくほとんどの人間は「何だよーこのサイト、ダメダメじゃん」とすぐにそのサイトに見切りをつけ、そのまま離脱→もう二度とそのサイトは訪れずにおしまい、ということになってしまうのではないかと思います。

(だからこそ余計に、ミスやエラーは恐いことなのですが…。)

WEB制作上のミスだけでなく、たとえばある物事について勘違いをしていたとしても、やはりそのことについてわざわざ指摘してくれる方というのはそう多くないと思います。

何かのトラブルがあったり、偶然正しい知識に出会って初めて勘違いに気づく、ということがほとんどなのではないかと思います。

(さらに昨今の世相を考えると、その勘違いに気づかないままそれを続けていると、ある日突然、それが元で炎上だとか、(前もっての注意も警告もなしに)突然ルール違反を突きつけられペナルティを課せられる、などというパターンがありそうな感じがそこはかとなくしていて「最近の世の中は“愛”が無いなぁ、生きてるだけでコワイなぁ」と思うこともしばしばです。
「失敗に学ぶ」が許されず、失敗したらその段階でもう「終わり」みたいな…。)

それに対する対策、と言っても根本的解決策など無きに等しいとは思うのですが(そもそも正しい知識が分かりやすく広く周知されているとも限らないので)、せめて常に「自分の知識に疑問を持ち、チェックする姿勢」を持っていたいなぁとは思います。

拍手[0回]

自分で作ったWEBサイトの動作確認をする際、なるべく複数のブラウザ(インターネット閲覧ソフト)で見た方が良い、ということが一般的に言われています。

理由は、同じWEBサイトであっても使っているブラウザによってレイアウトが崩れてしまったりするから、なのですが、「言ノ葉ノ森」も実際、このレイアウト崩壊には散々苦しめられてきました。

「言ノ葉ノ森」の場合、おそらく日本では一番メジャーであろうと思われる「Internet Explorer」で動作確認をし、何の問題もなく全ページ見られていたので、当初は「他のブラウザで見てもそんなに変わりはしないだろう」と油断しまくっていました。

ところが後にiPadなどに初めから入っている「Safari」やグーグルの「Google Chrome」などで見ると、見事なまでにレイアウトが崩壊するページがあることが発覚したのです。

これは何もうちのサイトに限ったことではなく、ウィキペディアさんなどの大手サイトさんでも同じようなレイアウト崩壊を見たので、どうやら「Safari」や「Google Chrome」は「Intaernet Explorer」とは何かが違っていて、ある種のレイアウト構成をしているWEBページでレイアウト崩壊が起こりやすい、という事象が発生しているようです。

(ちなみに「言ノ葉ノ森」の場合、「表」を使ってページレイアウトを組んでいるページでレイアウト崩壊が見られました。)

しかもこのレイアウト崩壊に気づいたのが、小説のページ数がかなり進んでしまってからだったので、レイアウトの修正に未だに苦労しています。

(しかも、レイアウト崩壊の原因を正確に把握していないので、一度試行錯誤で修正したものの、ブラウザのアップデートやバージョンアップ後に再びレイアウト崩壊が発生するなどという「いたちごっこ」な事態が起きたり…。)

こういったことが起こりえますので、動作確認はなるべく複数のブラウザで早い段階から行い、レイアウト崩壊を発見したら「キズが浅いうちに」早期に処置する、ということが必要になってくるのです。

ちなみに「言ノ葉ノ森」の場合、ある程度こういった事態を想定して、2作品あるネット・デビュー作それぞれを全く別のページ・レイアウトの組み方で作っていたので、トラブルに見舞われたのは1作品だけで、もう1作品は何とかレイアウト崩壊せず無事に済んでいます。

拍手[0回]

ブログ内検索
ブログ更新&チェックについて。

このブログは管理人に時間の余裕がある時にちょこっとずつ更新していく予定ですので、更新やチェックの頻度はおそらく数週間に1回~下手をすると1ヶ月以上の間が空いてしまう可能性も…。
もし更新が滞ったり、コメントくださって返事がなくても「あぁ、仕事が忙し過ぎて時間が無いんだな」と気長にお待ちいただければ幸いです。

ブログもくじ
ブログ記事一覧

(サイトと連動して作ったこのブログのもくじです。手動更新のため、最新記事などは入っていない可能性が高いです。)
WEBサイト及びオリジナル小説
カスタマイズ系ファンタジー小説サイト「言ノ葉ノ森」TOPページ


和風ファンタジー小説「花咲く夜に君の名を呼ぶ」


魔法少女風ファンタジー小説「魔法の操獣巫女エデン」


異世界召喚ファンタジー小説「ブラックホール・プリンセス」


児童文学風ファンタジー小説「夢の降る島」

 
「選帝のアリス」(pixiv投稿小説)
管理人プロフィール
HN(ハンドル・ネーム):
津籠睦月(つごもりむつき)
職業:
社会人(毎日PCを使う仕事。残業も休日出勤も普通にあります。)
趣味:
小説・HP制作、読書、猫と遊ぶこと。
好きな小説ジャンル:
ファンタジー、冒険、恋愛、青春、推理、濃い人間ドラマの展開するモノ。
備考:
漢検2級(準1以上は未受験)。国語の最高偏差値80(高2時点)。

オリジナルのWEB小説サイトを運営しています。
猫好きです。
HPにも小説内にも気づけばあちこちに猫が…。
オリジナル電子書籍「夢見の島の眠れる女神」



DL無料のオリジナル電子書籍(児童文学風ファンタジー小説)です。普通の電子書籍小説とはちょっと違う独自スタイルの電子書籍小説です。
参加ポータルサイト

人気ブログランキング
参加しているポータルサイト(ランキング)です。
相互RSS
猫写真集~疲れた時は猫に限る。

電子書籍無料制作サイト「パブー」さんにて制作した我が家のニャンコの写真集です。 DL無料ですのでぜひご覧ください。
もふもふペルシャ猫写真集
アニマル・エッセイ&フォト「ペットはいつでも突然に」
アクセス・カウンター
P R
忍者ブログ [PR]