Home Operation

ベクトルドロー・レベルゼロ

まずは、簡単にできることだけ

作成日 2015.01.16
最終更新日

まずは、簡単にできることだけ

何をしたらいいかわからない

もらったメッセージ
読んでもよくわかりません。 「モバイルの問題を調べる」ボタンを押して、表示された内容を呼んでもよくわかりません。 「ガイドラインに従う」ボタンを押して表示されたガイドラインは英語でした。何がしたいのでしょうか?

サポートサイトに投稿

一読して、この一連のメッセージとリンクから理解するのはあきらめました。 私のサイト作成スキルでは理解できません。 指示に従い、、ウェブマスター セントラル フォーラムのモバイルサイトカテゴリに 質問を投稿しました。 ここでわかったことは、「ビューポート」と「AdSense広告」が問題であるようです。

ビューポートの設定

サポートサイトでのアドバイスを元に、ビューポートタグをサイトに追加します。
Web検索をかけて ビューポートに関するページを調べてみました。

このページによると、<head>~</head>内に、


<meta name=viewport content="width=device-width, initial-scale=1">

上記コードを追加すればいいようです。検索置換で追加すると便利です。

PCでの閲覧に影響は出ません。そのため、おまじないとして追加しておきます。

作業

「Expression Web 4」の検索置換機能を利用してすべてのページに上記メタタグを追加しました。
PCからのビューには影響なく変化ありませんでした。

PC用モバイルビュー確認ツール発見!

iPhone5のモバイルビュー
広告ユニットについては、「集まれ!AdSense 初心者」 で質問しました。そこで、モバイルビューの確認は、クロームでできるということを教えていただきました。

表示してびっくり!私のサイトの下に「処刑」「刑務所」「侵略」という文字が躍っています。 無料サイトFC2を利用してきましたが、有料のレンタルサーバを借りる人の気持ちが理解できました。この広告はどこから配信されているのでしょうか。

それは、それとして、モバイルビューを確認できることがわかりました。

レスポンシブル広告に変更

ページに張り付けてあるAdSense広告をレスポンシブル広告に変更したいと思います。 こちらも同じく、「Expression Web 4」の検索置換機能で置換します。

問題点

「このサイトについて」の右端の空白は、cssで左側のカラムをパーセントで指定しているので、画面のサイズが小さくなった時、 Widthの値が不適切になるためです。PC画面で、ブラウザのウィンドウサイズの変化に対応させたので、 スマートフォン表示に対応できていないのです。でも、見にくいですが、何とか閲覧可能です。
このエントリーをはてなブックマークに追加

Home Editor Tools Operation TagScript HPSpace

Copyright (C) 2011-2015 Horio Kazuhiko(kukekko) All Rights Reserved.
kukekko@gmail.com
ご連絡の際は、お問い合わせページのURLの明記をお願いします。
「掲載内容は私自身の見解であり、所属する組織を代表するものではありません。」