MovableType(ムーバブルタイプ)で構築されたWEBサイト本文の文字サイズを大きくするためにスタイルシートを編集した

MovableTypeの文字サイズを大きくする当サイトはMovableTypeで構築されている。レスポンシブデザインになっているので同じURLのままでPCでもスマホでも見やすいはずである。しかし、最近ではスマホでの閲覧のほうが増加してきたため、スマホでの見やすさをより重視する必要性を感じていた。というのは、スマホで当サイトを見ると文字サイズが小さいという苦情を時々聞くようになったからである。そこで、文字サイズを大きくするためスタイルシートを編集した。

▼MovableTypeのスタイルシートに追記

mojisizeupmt.jpg

MovableTypeでは、管理画面の「デザイン」→「テンプレート」→「スタイルシート」で、標準のスタイルシートが編集できる。

今回は

/* サイト全体 */
body {
font-size: 14px;
font-size: 1rem;
text-rendering: optimizeLegibility;
color: #333;
}

/* 記事本文の文字 */
.entry-content {
font-size: 16px;
font-size: 1.14285714rem;
}

を追記しただけである。

これでスマホでの文字サイズが大きくなった。PCでは少し大きすぎるかもしれないが、しばらく様子をみることにする。

このページはTwitter、はてな、Google+、FacebookなどのSNSで以下のような反響があります。
なお、コメントはFacebookにログインしている状態でのみ受け付けております。セキュリティ上の観点からこのようにしております。ご了承願います。
このエントリーをはてなブックマークに追加  
 

この記事のURL「https://dm2.co.jp/2017/09/movabletypemojisize.html」をQRコードで表示
この記事のURL「https://dm2.co.jp/2017/09/movabletypemojisize.html」をQRコードで表示「https://dm2.co.jp/2017/09/movabletypemojisize.html」
パソコンで表示されたページをスマフォでも見たい場合は、このQRコードをリーダーで読むと表示されます。