オドフラン ~いつもどこかに「なるほど」を~

誰かのためになるようなことを、書き込んだり、書き込まなかったり

ちょっと待った!それスマホ対応サイトじゃないですよ!~わざわざボタンを押さないといけないサイトは要注意~

2017-08-30 19:45:58 | 日記

 

スマホ対応サイトは今の世の中「必須」というのは
かなり多くの人に認知されています。
最近の主流は「レスポンシブレイアウト」といって、
画面の幅に応じてサイトが伸び縮みするタイプです。

 

これは、1つの画面がPCサイトにもなるしスマホサイトにもなるし、
という優れもののため、非常に重宝されています。

もちろん、他にも作り方は色々あるので、レスポンシブレイアウトじゃなくても
スマホ対応のサイトは沢山あります。

ところが、スマホ対応だと思っているものが「実はスマホ対応じゃない」としたらどうでしょう。
主な例がこういうやつです。

 

 

スマホでアクセスすると、
最初にPCと同じ画面が出てきて、「スマホ版はこちら」っていうボタンを押さないと
スマホサイトへ飛ばないサイト。
これ、要注意です。

「スマホページへのリンクがある」というだけで
厳密にはスマホ対応(モバイルフレンドリー)ではありません!

 

モバイルフレンドリーかどうかは、人間の目で判断するのではなく
Googleなど検索エンジンがそうであると認識してくれる方が大事なのです。

Googleが「モバイルフレンドリーテスト」というサイトで
そのサイトがスマホ対応(モバイルフレンドリー)かどうかを診断してくれるサイトがこちら

▼あなたのウェブページはモバイル フレンドリーですか?
https://search.google.com/test/mobile-friendly

 

このページはモバイル フレンドリーではありません

と表示されたら、あなたがどれだけスマホ対応だと思っていても
「モバイルフレンドリー」という意味でのスマホ対応ではありません。

これを知ってか知らずか、HP制作会社が
「スマホ対応ですよ」といって料金を上乗せして請求するケースがあったりするようです。
あなたのサイトは大丈夫ですか?
今すぐモバイルフレンドリーテストで、試してみてください。

 

リニューアルのご相談も応じます!笑

制作費:5万円、月々5000円、スマホ対応HPにリニューアル

 

 


【ワードプレス】特定のテーブル(表)だけ枠や罫線を消す方法

2017-08-30 10:52:04 | 日記

最近は、使用するテーマによって
スタイルシートにもともとテーブルの罫線が記述されているものが増えました。
今までのように、わざわざ枠や罫線を付け加える手間が省けて便利・・・
の一方で、枠や罫線が必要ない時はなんとかしたい。

そういう時はhtmlに直接「線を消す」記述を書いてあげればいいんです。
具体的には
<td>

<td style="border: hidden;">
にします。



【実例】
▼html
<table>
<tbody>
<tr>
<td>りんご</td>
<td>ばなな</td>
</tr>
<tr>
<td>ケーキ</td>
<td>いちご</td>
</tr>
</tbody>
</table>

▼表画面

----------------------

▼罫線を消すコードを記述
<table>
<tbody>
<tr>
<td style="border: hidden;">りんご</td>
<td style="border: hidden;">ばなな</td>
</tr>
<tr>
<td style="border: hidden;">ケーキ</td>
<td style="border: hidden;">いちご</td>
</tr>
</tbody>
</table>


▼表画面

 


以上!

 

 

 


こんな写真も無料でダウンロード
商用可能なフリー素材、フリー素材ドットコム
http://free-materials.com/

 

新人発掘オーディション。
未経験OK、年齢制限なし。興味のある方、詳細は下記画像クリック