スポンサーリンク

「初心者向けレザークラフト」サイトを見やすくなるように作り直しました

スポンサーリンク
スポンサーリンク

私が運営しているレザークラフトの作品紹介や技法を紹介している「メカ好きおじさんの初心者向けレザークラフト講座」(サブタイトルは「はじめてのレザークラフト」)のサイトを作り直しました。
今まで運用していたサイトだと、スマホやタブレットなどのパソコン比べると狭い画面で見た時に、サイトの左右が切れてしまっていました。
レザークラフトのサイトを訪れてくれる方の55%はモバイルで、パソコンの39%より多いのでサイトの見え方に注意する必要がありました。
今年になってGoogleの検索も「モバイル フレンドリー」を重視すると発表されていて私のサイトはモバイルから見るのに優しくないと思いました。

以前運営していたサイトをパソコンで見た時は問題ないのですが、

それをスマホ等で見た時は、こんな感じで画面の右の方が切れてしまっていました。

私のサイトはプロバイダ提供のプログラムでなく、自宅サーバーにhtmlで作ったサイトをアップしています。
パソコンとスマホを自動的に切り替えるのは「レスポンシブ」対応といいますがそれをすべて自分で書くのは大変なので、無料で使わせてもらえるサイトのものをアレンジして作りました。

パソコンから見た時はこんな風に見えます。

各作品ごとにサイトが開き、型紙を掲載しているものはすべて無料でダウンロードできます。

作品や技法をテキストで一覧にしていますので探しやすいと思います。

スマホやタブレットで見た時も、画面が切れたり小さくなったりすることなく、画面サイズに合わせてぴったりの横幅で表示出来ていると思います。

Googleのモバイルフレンドリーテストをやってみても「このページはモバイル フレンドリーです このページは、モバイル デバイスでの使い勝手に優れています」と表示されました。

今後さらにレザークラフトの基本的な技法を紹介した動画や、作品を作ったらサイトに追加していくつもりです。

コメント

タイトルとURLをコピーしました