制作コラム&お知らせ

Androidハック「アンドロイドスマホ 文字列途中で自動改行対処」

2013/10/17

Android系スマートフォンのブラウザでPC用サイトを見ると、文字列が途中真ん中当たりで折り返されて自動改行されてしまう現象があります。

androidhack_im1

すべての機種のデフォルト設定なのかどうかわかりませんが、アンドロイド系スマホに搭載されているブラウザの設定で、スマホ画面に合わせて自動改行し読みやすくするための、言うなれば余計なおせっかい設定?のようなのです。

ですので、ユーザー側ではブラウザの自動改行の設定をOFFってやればOK!なのですが。。。

制作側はなかなかそうもいかず。お客様から突っ込まれたらそのようにお話をするしかないですが、PC用のページなので。それでもご納得していただけない場合の対処法!

通常、pタグなどで囲んであると思いますが、その後ろにCSSで背景色、又は背景画像をダミーで設定。
意味のない設定ですが、そうする事でなぜか改行されない。

以下テストです。
-----------------------------------------

pタグ背景に色(transparent)を付けて見ました。なぜかtransparentではうまく行かない・・・なぜ?

背景に青色を付けて見ました。改行されなくなりました。白でも大丈夫でした・・・。でもこのページは背景に画像が敷き詰めてあるのでダメ!

試に、テーブルレイアウト時代にお世話になった1pxの透明gif画像を背景に張り付けて見ました。改行されなくなりました。

androidhack_im2

これは正確にはエミュレーターって言うんですか?AndroidSDKと言うエミュレーターでの確認ですので、実機では検証まだなので確実ではないですが。(他に方法何かないのかな?)

理由はわかりませんが、それがハックと言うもので深くは考えない事にしましょう!?(いいのかそれで?)

ためしにpタグの横幅を明示的に指定してみましたがダメ!
いちいちpタグの背景に無駄なタグもあまりにあれ!なので、pタグの外側には必ず指定してあるであろう「div」要素に先ほどの透明gifを貼り付けて見ると、、、やっぱりダメ!

私はiPhone所有者なので、アンドロイド系は通常はAndroidSDKエミュレーターでの確認。
PCサイトは特例!?を除いてアンドロイドでは確認することはあまりないですし、iPhoneと違ってAndroidは種類が一杯あるでしょ!なので、実機は妻の携帯を借りて見るくらいでした。

ある時に真ん中から改行されているのを見てびっくり、妻の実機でも同じように改行されててビックリ。

PCもガラケーもスマホもいくつ持てばいいのでしょうね?ぜ~~んぶ違うんだから。。。

いまやスマートフォンのサイトは必須項目なので、スマホのサイトを作っちゃえばいい・・・と思いますが、なんと、スマートフォンでもPC用のサイトを見たいと言う方が圧倒的に多いようなのです。

100人に聞きました・・・ではないですが、周りの方々は皆そのようです。
その原因としては、スマホ用のサイトはPC版と比べるとどうしても文言の量を減らしたり、極力簡素にして表示速度を速めようとしたり工夫するのですが、スマホ所有者からするとポケットに入るPCの感覚なのでしょうか?

ですので、スマホ用ページの下の方には必ずと言っていいほど「PCサイトはこちら」のリンクが張ってありますが、偶然の大正解!?入り口だけは表示早く、あとはユーザーにお任せ。wi-fiや4Gの普及が進めばどちらでも閲覧可能な対策が必要なのかもしれません。

そこで、レスポンシブルデザインはユーザーとしてはどうなんだろか?興味あるところです。
もしかしたら余計なおせっかいなのかも???

デザイン事務所|エイビッツは個人事業&SOHOネットワークによる運営をしております。

Copyright © 2011-2018 Aveit. All rights reserved. — WebSite by Aveit.