
Webデザインとフォトショップクイズの第10問目です。
第9問でカーニングの事を少しばかり紹介しましたがもう少しWebデザイン技術の向上のため深堀したいと思います。
というのは文字間(カーニング)にはその単語によって簡単なもの、うけいれやすいもの、逆に難しいもの、賛否が分かれるものがあります。今回クイズにするのは賛否が分かれそうな単語のカーニングについてです。
目次
Webデザインとフォトショップのクイズについて
週1ペースで1問だけWebデザインやフォトショップを題材にしたクイズを出題して、未経験からでもデザインを楽しく学んでいければと思い出題を続けているゆる〜いコーナーです。
過去のクイズは地味すぎて分かりにくいものもありますが、私が身につけておいてよかった事ばかりをクイズにしています。

Webデザインとフォトショップクイズの特徴は?
時短向きのクイズです。朝通勤の時間に記事を見てみるよか、トイレ中のスマホをポチポチする時とか、みなさんのちょっとした隙間時間を活用して学んでいただければと思います。主婦のみなさまにも最適で、家事や育児の合間でも無理の無い範囲ですすめれるのではと思います。
私が出題するクイズはベテランWebデザイナーさんや新米Webデザイナーにとってなんでもない技術ですが、ベテランさんも躓いた物ばかりを出題しています。今から勉強しておけば将来実務の時に役立つと信じています。
理想は、「今週は残業続きでフォトショプの勉強できてないから、ちょっとWebデザインの「ながら勉強」してみようかな」くらいで吸収してもらえれば幸いです。
それでは第10問をはじめます!
このテキストをカーニングしたのですが、機械的に確認したら正確率が38%でした。

画像はKERNTYPEというカーニングの練習ができるサービスではじき出されたものです。

正解率90%以上を目指そう!
では、次のテキストをKERNTYPEを使ってカーニング調整し正解率を90%以上にしてみてください。テキストはKERNTYPEの第5問目で出題されます。

KERNTYPEの使い方をレビュー形式の記事(カーニングの練習にぴったり!Webデザイナーのデザイン勉強ツールKERNTYPEを試してみた)にしました。
ざっくりしたイメージはこちらから確認してください。
第10問のヒント
今回はWebデザイナー未経験に人がつまづくポイントを題材にしました。カーニングは隣り合う文字を程よい間隔で置いてあげると高い正解率になります。アルファベットの形によっては間隔が変わってくるというのがヒントですね!
第10問の解答を見てみよう!
今回は練習ツールで確認できるのでやりやすかったのではと思います。
カーニング調整して100%の結果になりました。

何度もやりなおしてやっと100%です。
コツは「Y」と「V」との距離感の詰めすぎ離しすぎを気をつけながらやればできます。
少しでもカーニング調整してWebデザインをできるようにする為に
どうにかしてカーニングを簡単にできる方法がないかなと考えていたらたまたま考えついた方法があります。
フォトショップの境界線を外向きに重ならない程度までギリギリまで広げて、重なった所はカーニング調整していきます。

そして境界線を非表示にすると、そこそこいい感じでしあがりますよ。

Webデザイン構成のアドバイスがあればいいな
直接添削はできませんが構成やデザインの勉強をtwitterの中でもアドバイスを発信しています。
どんな活動をしているのかは「新しいチャレンジ」の記事を確認してください。
第10回はこれで以上です。
次回以降ですが、簡単なクイズからもう少しレベルを上げた内容にしたいと思い時間をかけるので定期掲載ではない方向でアップしていきます。
春と桜が大好きなcoffeebreakの中の人(@ra_cer_X)です。
第9問の解答を公開しました!