Webデザインとフォントに関するnorip44のブックマーク (5)

  • フォント選びに迷ったら見返したい、おすすめ定番フォント31選まとめ (欧文編)|原田 佳樹 Harada Yoshiki

    こんにちは!トライブグループという会社でCDOをやっています、原田佳樹 @yoshigorouu といいます。前回はこんな記事を書きました! 今回の記事では、デザイナーが抑えておくべき定番欧文フォント31個(+おまけ)をまとめました。世の中で使われている大体のフォントをまとめてあるので、何かデザインするときの辞書的な感じになれば嬉しいです。 1. フォントの世界に魅入ったきっかけ私のデザイナーとしてのキャリアはスタートアップ歴が長いので、スキルセットがサービスデザインに寄っています。客観的に見てもグラフィカル領域(特にサービスロゴ)が弱く、それを強化したい気持ちは前からありました。 世の中にある様々なサービスロゴを見ていくと、大体のロゴはシンボル+タイポグラフィで構成されています。なので、フォントについて多少なりとも詳しくなれば、ロゴ制作の半分は出来るのではと思うようになりました。 リサー

    フォント選びに迷ったら見返したい、おすすめ定番フォント31選まとめ (欧文編)|原田 佳樹 Harada Yoshiki
    norip44
    norip44 2019/11/03
    欧文書体。 #積ん読ページ消化
  • Webサイトの見出しデザインまとめ13選!デザインの参考に | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    こんにちは、デザイナーの藤田です。 デザインをやっていると、見出しのデザインに悩むことって結構ありますよね! 自分のデザインストックを増やすためにも、今回のブログでは今っぽい見出しデザインをタイプ別にまとめてみました! 独学でつまずいていませんか? 現場で活かせるWebデザインを効率的に学びたい、誰かに教えてもらいたい……という方は、「スクールでの勉強」もおすすめです。LIGではWebクリエイター育成スクール「デジタルハリウッドSTUDIO by LIG」を運営しております。 詳細を知りたい方は、ぜひスクールの詳細をチェックしてみてください! →スクールの魅力が分かる資料はこちら!(資料請求) ※この記事は2022年3月に編集部が情報を更新しました ジャンプ率パターン ミニマムなデザインでは見出しに過度な装飾を加えずに、文に対し見出しの文字サイズを大きくすることで見出しを目立たせるサイト

    Webサイトの見出しデザインまとめ13選!デザインの参考に | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
    norip44
    norip44 2019/11/03
    さり気ない見出しデザイン色々。 #積ん読ページ消化
  • Webにおいて明朝体はNoto Serif CJKを使うべし -IE11対応版|TechRacho by BPS株式会社

    こんにちは。5月に産休育休から復職したデザイナーのニシです。 最近、健康と体力作りのために筋トレを始めました。毎日昼休みにコヤマさんと一緒に10分ほど筋トレしてます。皆さんもいかがですか。 今回は、レスポンシブサイトをデザイン・コーディングする際に明朝体の指定は何にするのが一番いいのか、試行錯誤した結果得た最適解を書きます。 最初に:結論 先に結論をいうと、 Google FontsのNoto Serif CJK(源ノ明朝)を使う IE11対応のためGoogle Fontsの設定で「Japanese」を必ず選択する です。Japaneseを選択しなかったというだけでかなり、右往左往してしまいました(後述)。 Google Fontsとしては他にも明朝体の選択肢はありますが、癖のない良い感じの明朝体というとやっぱりNoto Serif CJKかなーと思います。しかしいずれ、さわらび明朝も使っ

    Webにおいて明朝体はNoto Serif CJKを使うべし -IE11対応版|TechRacho by BPS株式会社
  • 良くあるメニュー・アイキャッチのアイコンに使えそうなFontAwesomeのまとめ

    たくさんのWEBアイコンフォントが使えるFontAwesomeですが、種類が豊富故に『あのアイコン使いたいけど名前なんだっけ・・・』ということも増えてきました。 htmlコードと、擬似要素で使いたい場面もあると思うのでcontentで指定する文字コードもまとめていきます! 5.0とは合わないようですが、検索のコツは同様に学ぶことができます。 FontAwesomeの使い方まとめようかと思いましたが、こちらのサイト様より丁寧にできる自信がありません! 使い方については↓を! http://h2ham.net/font-awasome おんなじWEBアイコンフォントはGenericonsを使っていたのですが、いまいち文字とのベースラインが合わないのが気になって、最近はAwesomeをよく使っています。 Genericonsについての記事はこちらをどうぞ! Twenty Fourteenに標準装

    良くあるメニュー・アイキャッチのアイコンに使えそうなFontAwesomeのまとめ
    norip44
    norip44 2016/04/26
    英語であれなんていうの、ってよくなったので助かった。ちなみに今回は「外部リンク飛ぶアイコンってなんていうの?」。答えはexternal-link
  • Webデザイナー(私)によるタイポグラフィーレイアウトの注意書き

    私は DTP デザインが苦手です ...。でもときどきお客さんから、フライヤーとかポスター、名刺なんかの紙のデザインを頼まれます...。そこでもっと勉強しなくちゃいけないなーと感じていたのが、タイポグラフィーについてのこと。今回はタイポグラフィーとそのレイアウトについて学んだことをまとめてみました。 以前グラフィックデザインをしている先輩に、グリッドシステムや揃えるだけがデザインじゃないし、もっとタイポグラフィーやレイアウトのことを勉強しなさいと言われました …。私は普段、Webデザインしかしていないんですけど、ときどきフライヤーやポスターのデザインを、ついで仕事のような形で頼まれる事があります …。 でも、Webデザインしかしてこなかった私は、紙媒体 – DTP デザインが苦手です …。ちょうど 1年くらい前にも同じような記事、Webデザイナー(私)によるDTPデザイン注意書き:Webと

  • 1