タグ

ブックマーク / pecopla.net (2)

  • 【検証】スマートフォンで読み易いfont-sizeとは? | SEO対策なら株式会社ペコプラ

    フォントサイズと行間は、ユーザーにコンテンツをストレスなく読んでもらう為の重要な要素のひとつです。 PCサイトでは、読みやすさはもとより、デザインも考慮した文字の使い方が多いと感じる一方、スマホ化されているサイトでは比較的どれも同じぐらいのフォントサイズが使われている為、ここは改めてどれぐらいのフォントサイズが読みやすく、よく使われているのかを検証しました。 読みやすいフォントサイズとは?読み物系30サイトを検証 検証するにあたり、まず「読みやすい」とは? 読みやすい=多くの人が読んでいる=有名・人気サイト! と言うことで、今回は記事を読ませる事を目的とした、ポータルサイト、バイラルメディア、キュレーションサイト、WEB系のブログなどから30サイトをピックアップしました。 検証方法は、文と見出しのフォントサイズと行間をWhatFontというgoogle拡張機能を使い調べます。 1番多か

    【検証】スマートフォンで読み易いfont-sizeとは? | SEO対策なら株式会社ペコプラ
  • レスポンシブも対応!綺麗で見やすい表のデザイン11個[HTML&CSS] | SEO対策なら株式会社ペコプラ

    表中のテキストの揃えの基 まずデザインを見ていく前に、表中のテキストの一般的なルールをおさらいしたいと思います。 何気なく作成してた人はここを見直すだけでグンと見やすい表に変わりますよ 内容によっては変える必要もありますが、基はこの3点です。 また、タイトルや、強調する値などは、太文字にしたり背景に色を入れたりと、他と差別化する事で見やすい表になります。 綺麗で見やすい表のデザインいろいろ それでは早速表のデザインを見ていきましょう! なお、今回はプラン表をイメージし、見出しが縦と横に入っているパターンの表をベースで作成しています。 それに合わせ、レスポンシブ時ではdata-labelの値をcontent:attr()で取得し、表示させる方法で実装しています。 また基的に比較表以外のパターンは全てhtml共通(行を増やしているものはありますが)にし、CSSのみ変えています。 <tab

    レスポンシブも対応!綺麗で見やすい表のデザイン11個[HTML&CSS] | SEO対策なら株式会社ペコプラ
  • 1