読者です 読者をやめる 読者になる 読者になる

Webサービスを作って潰すのが趣味な人のブログ

とりあえず作ってから怒られよう

【ブログ】はてなブログのおすすめテーマ「DUDE」を導入した後は最低限レスポンシブ対応をしよう

すごく……夏バテです……ktです……

 

先日DUDEがおすすめ!って記事と一緒に「カスタマイズも必要」みたいな事書いたんですが実際にどこをすべきかというと、やっぱりいちばんはレスポンシブ対応ですね。

 

blog.3oku.net

 

色々考えたんですがmain部分の幅とかは好みの問題もあるしとりあえずレスポンシブ対応の説明だけしておけば許されるかな?許されますよね?許してください

 

 

さて、本題

 

レスポンシブ化する方法

DUDEは(はてなブログは、かも)デフォルトではスマートフォンで見てもPCと同じデザインが使われます

 

それを解消するためにはCSSをいじる必要があるのですがそこらへんはこちらのブログを参考にさせて頂きました(thank you id:cruller!)

yaritakunai.hatenablog.com

 

デザイン設定→デザインCSSに下のコードを突っ込めばレスポンシブ化されます

f:id:vu2:20160805055113p:plain

gist3b5aea3b42ae3dc11622e0ffa110173d 

 

上の方の設定を2点変更しています。1点目がマージンを15px固定に、2点目がグローバルヘッダーの削除です。

f:id:vu2:20160805063143p:plain

 

PCの方も消したいんですけど、記事更新の時とかわりと使うので消すのは断念しました。ワードプレスみたいにログインしているかどうかフラグとれたら楽なんですけどね……

 

その他にも個人的には、本文の文字サイズ調整やタイトルの文字間調整とかはやったほうがいいと思ってます。デフォルトだと小さすぎて読むのに疲れちゃうかもしれません

 

がっつり読ませたいサイトだったら背景色をつけたほうがいいし、スタイリッシュにしたいなら枠線引いたほうがいいですね

 

色々カスタマイズの方向性があって楽しいDUDEですが公式でも情報を沢山公開しているので是非作者のid:tsukuruiroiroさんのブログも確認してみてください

tsukuruiroiro.hatenablog.com

 

またね~