未経験のwebサイト制作の勉強

未経験からwebサイト制作の勉強をし、現在制作会社で働いております。

Photoshopでの文字ツールの使い方

文字ツールを使う

  • 文字入力(配置したい位置ではなく、別の開いているスペースで入力する)
  • 入力後、移動ツールで配置したい位置に置く
  • 見出しを書く時はクリックして文字を書き始める
  • 段落文を書きたい場合はドラッグで段落文の範囲を決める(禁則処理を「強い禁則」に選択すると、句読点などが行頭に来てしまうことを防ぐことができます)

行間・字間を調節する

  • 行間は文字サイズより少し大きめにする程度(例:23px/25px)
  • 字間を調節する際は、カーニングを「オプティカル」に設定

色々なツールを使い文字を見せる

  • 縦書
  • 自由変形
  • ワープテキスト
  • 境界線

f:id:study-aaa:20190922214112p:plain

Webの文字組み

Webの場合、紙媒体に比べると細かい文字組みは出来ませんが、それでも基礎に則って文字組みをおこなうことはデザインを行ううえでとても重要です。気をつけるポイントは多数ありますが、
最低限のことだけでも注意すれば、今より格段に文字を美しく見せることができます。
特に日本語の場合、1つの文章内にひらがな・カタカナ・漢字・全角英数字・半角英数字など様々な形の文字が混ざっている事があり、それぞれの特徴を知り、それに合わせた文字組みが必要になってきます。

  • ひらがな、カタカナは原則として詰める
  • 句読点などの記号も詰める
  • 括弧は一番細いフォントを選ぶ
  • 単位は小さな文字サイズにする
  • 助詞は一回り小さいフォントサイズにする

stocker.jp