Simplicityの特徴 › フォーラム › 不具合報告 › サイドスライドの表示上の問題について
-
投稿者投稿
-
-
2015年3月23日 6:54 PM #24410
壬生狼
ゲストこんばんは、またまたお世話になります。 今回も、アップデートお疲れ様でした。
サイドスライド(スライドイン)メニューの実装、非常に素敵だと思います。
使い勝手が良ければ本採用というところでしたが、いくつか表示上の問題があったので、報告させていただきます。まずは、Simplicity公式と、拙ブログでの表示上の問題です。
http://netakiri.net/uploader/src/up0083.jpg共通の問題としては、グローバルメニューの項目が多い場合、フッターまでスクロールしないと全て表示できないというものと、一部のテキストが背景色と同化してしまって読めないというものです。
私のブログの場合は背景まで白系色になってしまっていますが、これはサイドバーの色を白色に&色自体もCSSで上書きしているからかな?と素人ながらに思ったところであります。
また、寝ログさんの場合は別の問題があって、フッターメニューのSearchがうまく動作していない模様。
http://netakiri.net/uploader/src/up0084.jpg具体的には、Searchをタップすると一瞬だけサーチフォームが表示されますが、すぐに消えてしまうというものです。 こちらの問題は、Simplicity公式と拙ブログでは発生していません。
今回も表示デバイスは少し前のAndroid機種(SO-01F Android 4.4.2搭載)のGoogle Chromeです。
以上、ご確認願えればと思います。P.S.
要望というか、アドバイスいただければありがたいのですが、最近Googleのウェブマスターツールで「タップ要素同士が近すぎます」「コンテンツのサイズがビューポートに対応していません」というユーザビリティ上のエラーが表示されるようになりました。前者は余白を確保すれば良さそうなので私でもできそうですが、後者に関してはviewportが指定されているはずにもかかわらず表示されるので、どうにかならないもんかと思っております。
4月頃よりGoogleではモバイル向けのランキング要素にモバイル対応状況も含めるとしているので、多少なりとも状況を良くしておきたいものですが、私程度の知識と技量では何をしていいものやら、というところですので、アドバイスいただけると幸いです。
-
2015年3月23日 6:58 PM #24412
壬生狼
ゲストおおっと、また書き忘れ失礼します。
拙ブログのURLは以下になります。 -
2015年3月23日 8:41 PM #24428
わいひらキーマスターこんばんは。
不具合報告ありがとうございます。とりあえず、僕のページ(寝ログ、Simplicity)で出ている表示上の不具合は、ブラウザに古いキャッシュが残っていることが原因かと思われます。
現に、キャッシュが更新されている僕のブラウザからは、正常表示されています。
一度ブラウザをリロードするか、それでも改善されない場合は、キャッシュの削除を行ってみてください。その他の不具合は、テーマカスタマイザーのスタイルが最も優先されてしまうSimplicityの仕様からきているものと思われます。
テーマカスタマイザーで設定したスタイルよりも、スライドインメニュー&サイドバーのスタイル(背景色)が優先されるようにスタイルを修正しました。
Simplicity1.6.0にて修正されていると思います。
http://wp-simplicity.com/simplicity1-6-0/ -
2015年3月23日 8:57 PM #24430
わいひらキーマスターコンテンツのサイズがビューポートに対応していません
これは、基本的に水平スクロールが必要とされるページに表示されるようです。
モバイル ユーザビリティ – ウェブマスター ツール ヘルプ
コンテンツのサイズをビューポートに合わせる ? Web Fundamentalsただ、僕もウェブマスターツールでエラーの出ているページを確認してみたのですが、水平スクロールが出るようにはなっておらず、どうしたらよいものかと思っている次第です。
これが、ページは要素のどれかが、端末幅以上にはみ出しているのなら僕もそこを修正するところです。けれど、特にはみ出していないのに、エラーが出ているので、僕も今のところは、どう対処してよいものかと言った感じです。ちょっと詳しい原因がわからないと何ともできません。ちなみに僕のサイトで、エラーが出ているページは以下などです。
http://wp-simplicity.com/media-settings/
http://wp-simplicity.com/how-to-start-adsense/
http://wp-simplicity.com/simplicity1-5/それに今のところ、ウェブマスターツールでエラーの出ているページをPageSpeed Insightsのユーザーエクスペリエンスや、モバイル フレンドリー テストで、チェックさせてみましたが、今のところこちらのツールではエラーが出ていません。
ですので、もう少し具体的な対応策が出るまで様子を見るしかないと思います。
何か良い改善策などを発見した際には、ご報告いただけるとできるだけ対応したいと思います。 -
2015年3月23日 9:29 PM #24432
壬生狼
ゲストこんばんは、早速のご対応ありがとうございます!
大半の表示上の不具合(×ボタンや、Searchボタン)は、おっしゃるとおりキャッシュクリアで改善されました。 初歩的なことを失念していてお恥ずかしい……。ただ、現状でも私の端末だとグローバルメニュー(左側スライドインメニュー)が見きれるのが変わらずです。 挙動としては、スワイプするとグローバルメニューではなく、メインカラムがスクロールしてしまう感じです。 これは、グローバルメニュー項目の多いSimplicity公式でも、拙ブログでも改善されていません。 サイドバーの挙動と同じになれば問題ないのですが……。
背景色に関しては、拙ブログでも修正されているのが確認できました、ありがとうございます!
また、不具合とは関係のないお話にもご回答いただき、ありがとうございます。
それに今のところ、エラーの出るページをPageSpeed Insightsのユーザーエクスペリエンスや、モバイル フレンドリー テストで、チェックさせてみましたが、今のところこちらではエラーが出ていません。
そうなんですよね。 私も全く同じ状況で、問題のあるページをチェックしても問題無いと書かれているという。 タップ要素に関しても「修正を考慮」で、エラーになるほどのものでもなさそうですしね。
こちらに関して何か解決のヒントになりそうなものを見かけましたら、ご報告させていただきますね。
-
2015年3月23日 9:59 PM #24437
壬生狼
ゲストグローバルメニューの挙動について追記。
なんとなく、サイドバーの追従領域と同じような動きをしている気がします。 スワイプすると、画面の表示領域最上部でスクロールがロックされて、ひたすら追従するような。
試しに横画面で表示してみたところ、グローバルナビ項目の少ない寝ログさんの方でも同じ現象が発生。 高解像度デバイスだと表示領域が広がるので問題ないのかもしれませんが、当方の端末(1080*1920、FHD)の解像度が問題なのか、はたまた機種もしくはブラウザの問題なのか。
もしわいひらさんの方で(これより低解像度デバイスをお持ちである前提ですが)、横向きなどでもやはり問題が発生しないようであれば、こちらの端末に問題があるのかもしれません。
お手数ですがもう一度確認願えればと思います。
-
2015年3月23日 10:03 PM #24438
わいひらキーマスターあ、すいません。
グローバルメニュー項目のことについて書くのを忘れていました。グローバルメニューの項目数のことに関しては、何も修正していません。
というのも、数が多くなると、画面内に入らなくなるのはしょうがないからです。例えば、壬生狼さんのサイトでメニューがスライドインメニュー内に収まるように今回修正したとしても、もっとメニューを表示しているサイトでは、結局収まりきりません。
なので、数が多いと見切れるのは何ともできないです。解決策としてはサイトに合わせて、収まるようにスタイルシートで調整していただくしかないかもしれません。
挙動としては、スワイプするとグローバルメニューではなく、メインカラムがスクロールしてしまう感じです。
ブラウザの確認ツールだと、メニューもスクロールできたのですが、Androidだとメニューをスクロールさせようとすると本文がスクロールしてしまうんですね;
これはどうしたらいいんだろう…。
メニューをスワイプするためのエリアを作るとかでいいのだろうか。
何か改善策を考えてみます。 -
2015年3月23日 10:13 PM #24440
壬生狼
ゲスト何度も重ね重ね申し訳ないやらありがたいやらです。
メニューが見きれるというのは表現が良くなかったですね、大変申し訳ありません。結局のところ問題としているのはスクロールの挙動のところで、ここがサイドバーと同じくメニュー項目がスクロールしてくれれば、初見で項目自体が見きれていても問題はないのですがね。
こちらは特に修正なされていないとのことですが、本件については迅速なご対応によりほぼ解決できたので、「解決済み」としてトピックを閉じていただければと思います。
今回も本当にありがとうございました!
-
2015年3月23日 10:22 PM #24441
わいひらキーマスターはい、Firefoxの動作確認ツールでは、スワイプできていたので見切れても問題ないと思っていました。
問題は、そこではなかったのですね。それにしても、何でサイドバーでスワイプできて、メニューでスワイプできないのか今のところ全然わかっていません。
あまり、夜遅くに考え込むと頭が冴えて眠れなくなってしまうので、明日ゆっくり考えたいと思います。貴重な報告ありがとうございます。パソコンブラウザメインで動作確認している僕には、気づかないところでした。
トピックは、解決策を持っているプロ神様の降臨を、ほのかに期待してもう少しだけ開かせておいてください。
明日になって、解決策を模索する頃には閉じさせていただきます。 -
2015年3月23日 10:34 PM #24442
壬生狼
ゲスト悪文で当惑させてしまって申し訳ないです。
ブログを書いている以上、より伝わりやすく文章を書く方向で精進いたします!無料で使わせて頂いている上、夜遅くまでお付き合い下さり、誠にありがとうございました。
プロ神様降臨を私も祈りつつ、ひとまず失礼いたします。 -
2015年3月25日 6:08 PM #24576
壬生狼
ゲストこんばんは。 毎度お世話になっております。
ウェブマスターツールにおける、モバイルユーザビリティーエラーに関して、こんな記事がありましたのでご報告。
すでに目を通されているかもしれませんが……。モバイルフレンドリーテストに合格しているのにモバイルユーザビリティレポートでエラーが出る理由 | 海外SEO情報ブログ:
https://www.suzukikenichi.com/blog/passing-mobile-friendly-test-but-mobile-usability-reports-errors/要は、古い情報を元に判定していて、最新の状態が反映されるまでに遅延があるということのようです。
また、拙ブログではrobots.txtの書き方が古かったらしく、モバイルフレンドリーテストでもエラーが出ていたので、次の記事を参考に修正しました(主に、CSSやJSをクロール許可しました)。
robots.txtを改善してGoogleにブログの構造を的確に伝えよう:
http://naifix.com/robots-txt-improvement/なのでエラーに関して、Simplicityテーマ構造とは別のところに原因がある可能性大、です。 どのみち結果反映まで時間はかかりそうですが、ひとまずお耳に入れていただきたく思います。
それでは。
-
2015年3月25日 9:14 PM #24587
わいひらキーマスターいえ、この書き込みで知りました。
教えていただきありがとうございます。原則的に、モバイルフレンドリーテストで合格が出ていれば、Googleが要求するモバイル対応は完了していると考えてください。
これを見て、かなり安心しました。みなさん同様のエラーが出ていたのですね。
一応、Simplicityを修正してみてこのサイトは、スライドインメニューをスラッシュできるようにしてみました。
一応、仮想環境のAndroid Chromeで表示させると、スクロール出来たので多分改善したのではないかと思います。(ただ、Android Chromeの場合、最初にアドレスバーが表示されるので上にスクロールさせるとメニューの高さが合わずカクンと表示されます)
よかったら確認してみてください。
近いうちに、修正版をアップロードしようと思います。 -
2015年3月25日 10:01 PM #24591
壬生狼
ゲストこんばんは。 件のエラーは割と広範に見られていたようですよね。
懸念事項が一つ減り、私としても安堵しております。スライドインメニューのほうですが、こちらでも確認したところ問題点が解消されていて、ちゃんとスクロールできています。
早期の対応、本当に感謝いたします!だいぶ長くなってしまいましたが、ご対応ありがとうございました!
-
2015年3月25日 10:20 PM #24593
わいひらキーマスターよかった^^確認ありがとうございます。
-
-
投稿者投稿
- トピック「サイドスライドの表示上の問題について」には新しい返信をつけることはできません。