レスポンシブデザインのブログに変更

2020年01月11日
2
0
あれこれ
2010年に不知火Ⅱ購入をきっかけに、漕ぎ記録を残そうと始めたこのブログも10年が経ちました。10年間デザインを変更することはありませんでしたがやっぱりちょっと古さを感じてきたので、最近はスタンダードになったレスポンシブデザインに変更しました。
old_blog.jpg

レスポンシブデザインというのはパソコンの広い画面で見ても、スマホの小さい画面で見ても、見る画面のサイズに応じて見やすい表示に自動で切り替える仕組みを持つデザインを言います。
今回使用したテンプレートはページのトップ画像も自分の好きな物が使えるので、奄美の画像にしてみました。
通常のブラウザのサイズで見ると記事が横に4つ並びますが
new_blog1.jpg

少し狭くしてみると2つの記事が横並びになります。
new_blog3.jpg

これまで左側にあったサイドバーはブログの一番下に移動しました。
new_blog2.jpg

ちょっと手を加えて記事の上にマウスを載せると、そこがふわっと浮き上がるようカスタマイズをしてみました。これから少しずつ変更していこうと思います。
過去の記事の表示が変だったりしますが、ボチボチ修正していこうと思います。
トップページ - 外へ出ようヨ!



にほんブログ村 アウトドアブログ カヌー・カヤックへ    よかったらクリックしてネ!
にほんブログ村
関連記事
スポンサーサイト



びん
Posted by びん
キャンプ、スキー、カヌーOutdoor大好きおやじ
最近はシーカヤックに夢中
棲息地:愛知県

Comments 2

There are no comments yet.

ぼっちん

はじめまして ^^

びんさん、はじめまして ^^
ここ数日弊ブログ「Webテク倉庫」をご参照してくださっていてありがとうございます ^^

テンプレートをAkiraさん作の「lilting」に模様替えなさったんですね~ ^^
私も、今利用中のテンプレ「Ample」の前にはこの「lilting」を使わせて戴いていたものですから、お仲間意識を感じてしまいます(笑)
トップページの記事要約部分(grid)にマウスを置くと、ふわっと浮き上がるカスタマイズもなさってお洒落になってますよね ^^
Akiraさんのレスポンシブテンプレートはとてもカスタマイズがし易く設計されておりますから、いろいろと楽しめるのに、とても高機能で私も一押しで推奨させて戴いております ^^

これからびんさんのWebテクニックに注目させて戴きますね~ ^^

2020/01/12 (Sun) 08:10
びん

びん

はじめまして

ぼっちんさん
はじめまして。ご挨拶が遅くなりすみません、勝手に使わせていただいております。とても参考になります。
Yahooブログを使っていた仲間がドメインを取得してWordpressのブログに移行したのに触発されました。
今まで10年間、ずっと同じデザインのFC2公式テンプレートを使ってきてやっと今風のblogになりました。
ただhtmlの知識もほとんどありませんのでコピペで対応するだけです。

現在過去の記事をどうしようかちょっと悩んでおります。
基本、画像は800*600でアップしてありますが、記事は500*375のサムネイルを使って書いていたので
左に寄った状態で表示されてちょっと見栄えが悪いですが、1300もの記事に手を加えるのは面倒なので
今年からの記事を見直そうと思っております。

これからも参考にさせていただきます。

2020/01/12 (Sun) 15:38