170404 まちづくり協議会ホームページ、スマホ対応
以前の記事でも紹介しました、私が事務局を務めます中間西校区まちづくり協議会のホームページですが・・・
現在「試験運用中」という形で準備中、調整中です。
やっと、検索エンジンにも登録され「中間西校区」だけの検索で上位にランクされるようになりました。
で、ホームページのそのものですが、スマホで閲覧されることは大前提で、スマホ対応を余儀なくされています。
PCでメモ帳にHTMLを記述してホームページを作っているのですが、私、ガラケーで、作ったホームページをスマホで確認できないんです。
しかも、このガラケー先月(3月)に機種替えまでして、通話のみ、携帯でのEメール、ネットも使わなくしました。
そこで、仕方なくまちづくり協議会の事務員さんのスマホで確認をさせていただいていたのですが、何とかPCでスマホの画面で見ることができないか調べてみましたら・・・
何のことはなく、グーグルのクロームでホームページを表示させて「F12」を押すと左半分に表示されます。
なんと、機種も選べます。
スマホに対応しないとこのような表示に・・・
なぜこのような表示になるかと言うと、どうもiphon5の横幅320pxの画面に、PCで表示される980pxの表示を320pxに自動縮小して表示しているようです。
左右の余白は表示させなくて、スマホの画面いっぱいに表示させたいですね。
ネットで調べ調べ、解決しました。
じゃあ、このブログは・・・
まちづくり協議会のホームページ同様、対応をします。
FC2ブログの「管理画面」から「テンプレートの設定」の「HTML編集」で、HTMLを1行追加します。
ただ、気づいたのですが、最初から表示させるコンテンツを980pxで作っていれば、この対応は要らないような・・・
980pxより小さなスマホの画面では横幅いっぱいに、980pxより大きな画面では、左右の余白に指定した背景画像なり背景色が表示される・・・
さて、協議会のホームページの方では、画面が小さい時に、画面に応じて文字の大きさ、改行にも配慮しました。
ipadやPCでは、こんな感じ。
iphone5では、こんな感じ。
ネットで、サイトやブログの記事を参考に、見よう見まねですが、画面のサイズに合わせて改行、文字の大きさを調整する事ができました。
中間西校区まちづくり協議会ホームページ
中間西校区まちづくり協議会ホームページ
ブログランキングに参加しています。応援よろしく です。
トラックバックURL

http://onta0001.blog.fc2.com/tb.php/205-9cb448cb

トラックバック
コメント
お疲れさま。
ホームページスマホ対応、その後どうですか。

自分もスマホで試してみました(笑)
“中間西校区”で検索ヒット。ホームページは見れましたよ。まだ試験運用中になっているようですね。
さらに問い合わせ先の下にある記事の見出しをクリックしたら記事のページに入れました。
ただ、その下に三つ並んでいる“まちづくり協議会”などの項目はクリックしてもどこにも飛びませんでした。機種が違うのでしょうか。

余計なことかもしれませんがお節介してみました。
自分もこういうのは詳しくはないので良く分かりませんが、うまく出来て多くの人に読まれるようになることを祈っています。
ミドリノマッキー 2017.04.13 20:44 編集
ミドリノマッキーさん、コメントありがとうございました。

いやいや、貴重なご意見ありがとうございます。

ご指摘の項目は、マウスオーバーするとプルダウンメニューが表示されます。
PCで確認していただくと分かるかと思います・・・

で、お使いのスマホの機種とホームページを見るアプリ(ブラウザ)を
教えていただくと助かります。

遠太 2017.04.13 21:54 編集
返事が遅くなり申し訳ありません。

スマホの機種はF-06F。
ブラウザはグーグルクローム。

お役に立てれば幸いです。


確かにPCではいろいろな項目が表示され、それぞれのページに入り記事を読むことができました。
ミドリノマッキー 2017.04.15 14:23 編集
ミドリノマッキーさん、返事ありがとうございました。

参考になります。
とりあえず、マウスオーバー式を止めて、クリックしていただいて、
別ページでメニューを表示する方式に変えました。

少しずつ、改造したいと思います。
遠太 2017.04.15 14:43 編集
管理者にだけ表示を許可する
 
プロフィール

遠太

Author:遠太
九州は福岡県中間市で環境保全や
地域に関するボランティア活動中
できる時にできる範囲で。
そこには、ノルマも強制も義務も
ありません。

ホームページ
中間西校区まちづくり協議会ホームページ
遠賀川ボランティア清掃の会へジャンプ 遠賀川ボランティア清掃の会へジャンプ
今後の清掃予定
5月30日(火)9:00~
 清掃美化ボランティア活動
 ロイヤル中間店駐車場集合
6月11日(日)9:00~
 グリーンクリーンなかま
 JR中間駅集合
6月23日(金)9:00~
 中島清掃
 中島入口駐車場集合
素材をお借りしています。
ランキング参加
FC2ランキング にほんブログ村 環境ブログ 環境ボランティアへ
にほんブログ村 家族ブログ 仲良し家族へ にほんブログ村 地域生活(街) 九州ブログ 北九州情報へ
リンク
カテゴリ

pagetop ↑

Copyright © 2017 遠太 all rights reserved.
Powered By FC2 blog. Designed by yucaco.