タグ

ブックマーク / www.dtp-transit.jp (15)

  • CSSでのフォント指定について考える(2014年)|DTP Transit

    結論1:アルファベットでウエイトなしだけでも、すべてのモダンブラウザに対応可能です。ただし、旧バージョンのSafariやFirefoxでは対応がまちまちであったため、それらに対応するには併記します。 游ゴシック体と游明朝体はWinodws 8.1では日語名、OS X Mavericks(10.9)ではアルファベット名のみの対応であるため、両名の併記が必要となります。 疑問2:「ヒラギノ明朝 Pro」と「ヒラギノ明朝 ProN」のどちらを記述すればいいのでしょうか。 「ヒラギノ明朝 Pro」を改訂し、JIS X 0213:2004の例示字体に対応させたものが「ヒラギノ明朝 ProN」です。 参考: ウィキペディア - ヒラギノ 「ヒラギノ明朝 Pro」と「ヒラギノ明朝 ProN」の違い CSSのfont-family指定はこれで決まり!(2013春) 結論2:新しい字形に対応をしている「ヒ

    CSSでのフォント指定について考える(2014年)|DTP Transit
  • Web向けにIllustratorを使う上でのコロンブスの卵的なアプローチ|DTP Transit

    2010年にリリースされたIllustrator CS5でのWeb向けの機能強化以降、Web向けにIllustratorを使う上では、次のアプローチが基とされてきました。 ドキュメントプロファイルに「Web」を選択し、[新規オブジェクトをピクセルグリッドに整合]にチェックを付ける [ピクセルプレビュー]をオンにする 先週末に行われたdot-ai, Vol.2において、黒葛原 道さん(eater)が、次のアプローチを発表され、「なるほど!」と思ったのでご紹介します。 [新規オブジェクトをピクセルグリッドに整合]はオフにする グリッドを1ピクセルに設定し、[グリッドにスナップ]をオンにする [線の位置]は外側に設定する 次の図は、左が従来のもの。右側が黒葛原さん方式です。 Illustratorの「ピクセルグリッドに整合」は、3px x 3px、線幅1pxの図形を描画する際、ピクセルグリッド

    Web向けにIllustratorを使う上でのコロンブスの卵的なアプローチ|DTP Transit
  • Illustratorでプラグインを使わずに、角を丸くする|DTP Transit

    Illustratorで文字の角を丸めるとき、[角を丸くする]効果を利用すると、次のように意図しない形状になってしまうことがあります。 これを避けるために、有料のプラグイン、Xtream Pathの[スマートラウンド]を使う方法をご紹介してきましたが、Illustratorだけで実現する方法をご紹介します。 なお、この方法は、日のセミナー(「クリ☆ステVol.6」)終了後、参加者の方から教わったものです。お名前を失念してしまいましたが、ありがとうございます(※追記あり)。 実現方法 実現方法は、[パスのオフセット]効果の二度がけ。 一旦、負の値でかけてから、同じ数値で正の値でかけます。 なお、この際、両方とも正の値を設定する効果に[角の形状]を「ラウンド」にしておくのがポイント。 正直、なぜ、これで丸くなるのかよくわからないのですが、結果オーライで。 ただし、細かいところをいうと、"墨だ

    Illustratorでプラグインを使わずに、角を丸くする|DTP Transit
  • フォント管理2011(10.6対応)|DTP Transit

    フォント管理については、DTP Transitでたびたび取り上げてきましたが、総集編です。 パレートの法則よろしくインストールされているフォントの中で使うものは一握りです。フォント数を少なくすると、スピーディにフォントを選択できるだけでなく、OSやアプリケーションの起動時間が短くなるという効果も得られます。 フォント管理を行った最小限の状態 「システム/ライブラリ/Fonts」や「ライブラリ/fonts/」内のフォントを最小限にした状態でのIllustrator CS5のフォントメニュー デフォルトの状態でのIllustrator CS5のフォントメニュー フォント管理については、Extensis/ソフトウェア・トゥーが配布している『Mac OS X 環境のフォント管理活用ガイド』(PDF)が参考になります。 フォントのインストール場所 「インストールされたフォントを整理し、最小限のフォン

    フォント管理2011(10.6対応)|DTP Transit
  • DTP Festa in Tokyo 2012 December「あなたの知らない奥深いマスクの世界と、Illustrator CS6の強化ポイント」フォローアップ|DTP Transit

  • Illustratorをインストール後にやること|DTP Transit

    「あ〜、インストールしたばかりのIllustratorって使いにくい!!!」ってことで、CS6に限らず、まず、行うことをまとめてみました。 Macのシステム環境設定 Mac OS X 10.6(Snow Leopard)でIllustratorを使うときに変更しておきたいキーボードショートカット Illustrator CS5:開いてるドキュメントを切り替えるキーボードショートカット Caps lockキーを無効にする Illustratorの環境設定 [キー入力]を「0.1」mmに変更する [ガイド]の[カラー]を「ライトブルー」に、スタイルを「点線」に変更する [ユーザーインターフェイス]の[カンバスカラー]を「ホワイト」に変更する(CS6のみ) [タブでドキュメントを開く]のチェックをはずす アプリケーションバーを非表示にする([表示]メニューの[アプリケーションバー]をクリック)

    Illustratorをインストール後にやること|DTP Transit
  • カラーバリエーションを作る以外にも、Illustratorのライブカラーは最強|DTP Transit

    ライブカラー(正式名称はオブジェクトを再配色)は、Illustrator CS3から搭載されているので、かれこれ5年近くになりますが、なぜか認知度が低いようです。 紹介の仕方のひとつとして「ライブカラーは、カラーバリエーションを作るのに便利」という切り口がありますが、それだけではありません。Illustratorでの着色(カラーリング)作業のワークフローを覆してしまうほど、ぶっとんでいるのがライブカラーです。 従来のIllustratorでの着色(カラーリング)作業のワークフロー あえて説明するまでもありませんが、Illustratorでの着色(カラーリング)作業は次のような流れで行います。 オブジェクトを選択する カラーリングを行う 異なるオブジェクトを選択する カラーリングを行う この際、ちょっと面倒なのが、 グループ化がかかっているとオブジェクトの選択が面倒 グラデーション内に同じカ

    カラーバリエーションを作る以外にも、Illustratorのライブカラーは最強|DTP Transit
  • 作業効率をアップするIllustratorのキーボードショートカット|DTP Transit

    作業効率をアップするIllustratorのキーボードショートカットを書き出してみました。 ツール選択(1) [選択ツール]と[ダイレクト選択ツール]の切り替え: command+option+tabキー [ダイレクト選択ツール]から[選択ツール]への一時的な切り替え:commandキーを押したままにする サブツールの選択:長押ししてメニューを開かずに、optionキーを押しながらクリックすればツールが切り替わる (例:[長方形ツール]→[角丸長方形ツール]→[楕円形ツール]...) ツール選択(2)テキストツールと選択ツールの切り替え テキストツールへの切り替え:文字上でダブルクリック テキストツールから選択ツールへの切り替え:Escキー(command+enterキーでもいけます) テキストツール(およびほかのツール)から選択ツールへの一時的な切り替え:commandキーを押したままに

    作業効率をアップするIllustratorのキーボードショートカット|DTP Transit
  • Illustratorのドキュメントプロファイル(プリント/Web)の差違 - DTP Transit

    実験る〜むさんにピクセルグリッドちゃん気をつけてというエントリーが上がっていました。 これまで「Illustratorといえばプリントメディアのもの」でしたが、Illustrator CS5での機能強化によって、Webにも使用する人が増えそうです。 Web用のドキュメントプロファイルでスタートしたAiファイルを、カラーモードや単位を変更してプリント用に使うというケースが出てきまので、あさうすさん(実験る〜む)が指摘されているような問題が起こる可能性は十分に出てきます。 「数値入力でオブジェクトサイズを設定しても、その数値通りになってくれない」というのがその理由。きっちりmmやptの整数値で作るような場合、ピクセルグリッド整合機能が有効になっていると、勝手に数値が変わる。 ドキュメントプロファイルは新規ドキュメント制作時のみでなく、後からも変更できるように仕様変更されることが一番の解決策です

    Illustratorのドキュメントプロファイル(プリント/Web)の差違 - DTP Transit
  • Web向けの作業を行うときのチェックリスト - DTP Transit

    Illustratorで既存の書類を、そのままWeb向けとして作業する場合、次の操作を行います(新規にスタートするときには、ドキュメントプロファイルで「Web」を選択すると、このリストの多くはクリアされます)。 カラーモードをRGBに([ファイル]メニューの[ドキュメントのカラーモード]→[RGB]) 単位をピクセルに(環境設定の[単位]タブ、またはルーラー上でcontrol+クリック) ピクセルプレビューをオンに([表示]→[ピクセルプレビュー]) ピクセルグリッドに整合をオンに([変形]パネルのパネルメニュー内の[新規オブジェクトをピクセルグリッドに整合]にチェックをつける) ラスタライズ効果設定で解像度を72dpiに([効果]→[ドキュメントのラスタライズ設定]) 環境設定の[キー入力]を「1px」に設定 これにより、shiftキーを押しながら矢印キーを押すと10ピクセル移動します。

    Web向けの作業を行うときのチェックリスト - DTP Transit
  • Illustrator CS6は久々の

    かつて、DTP業界には"奇数バージョンのIllustratorは買うな(使うな)"という格言がありました。 ある意味、Illustratorは5.5(CSでなく、1994年発売のIllustrator 5.5)で完成しているといえますが、チャレンジングな改良を行うことでバギーだったりしたことを揶揄したものです。 Illustrator 7.0(RGBサポート) Illustrator 9.0(透明・アピアランスのサポート) Illustrator CS(テキストエンジンの刷新) いうなれば、奇数バージョンで公開ベータテストを行い、次の偶数バージョンで安定、というサイクルを繰り返していたのです。 Illustratorのバージョン(の歴史)をざっくり理解する CS2以降、複数のアートボードという強化ポイントはあったにしろ、ずっと安定してきましたが、Illustrator CS6は、久しぶりの

    Illustrator CS6は久々の
  • Illustratorで文章を扱うとき(文字組版) - DTP Transit

    Illustratorで文章を扱うとき、矩形エリアに文字を流し込んだままではなく、次の4点は、最低限設定します。 行送りの設定 均等配置(行頭行末揃え/ジャスティファイ) 禁則 文字組み(約物前後や和欧間のスペースの設定) 逆を言えば、Illustratorではポイントテキスト(文字ツールでクリックして入力したテキストオブジェクト)を前提としています。 デフォルトの[行送り]は、文字サイズの175%に設定されています。「(14.4pt)」のように()付きで表示されているときには「自動」行送りになっています。1行あたりの文字数に応じて調整します。 CS以前のIllustratorや、バージョン互換を行ったドキュメントによっては自動行送りが欧文に準じた120%になってしまいます。120%では行送りは狭すぎます。日語では150-190%程度に設定します。 [段落]パネルの[均等配置(最終行左揃

    Illustratorで文章を扱うとき(文字組版) - DTP Transit
  • Illustrator|DTP Transit

    2018年1月26日(金)、ベルサール神保町で第192回 バンフーセミナーが開催され、『インバウンド向け制作物のための多言語とフォントの基』をテーマに、鷹野 雅弘(スイッチ)が出演しました。 アンケート回答のお願い ご参加いただいた方は、ぜひ、アンケートへの回答をお願いします(スライドなどをお送りします)。 アンケートの回答期限は、1月30日17時です(セミナーの感想などをフィードバックいただきたいので、アンケートにはセミナーに参加された方のみご回答ください)。

    Illustrator|DTP Transit
  • アップグレード?Adobe Creative Cloud?迷う方への試算|DTP Transit

    グラフにすると、こんな感じで、Adobe Creative Cloudが一番割高になってしまっています。 そもそも、Design & Web Premiumと、全部入りのAdobe Creative Cloudを比べているので、Adobe Creative Cloudのお得感が少ないのは仕方がありませんMaster Collection 0.5アップデートを追加しました。 それでも、Adobe Creative Cloudを選択する理由は次のあたりにあります。 アップグレード費用を分割して支払うことができる(初期投資が少ない) Touch Apps(タブレット用アプリ)なども、これから使いそう Muse/Edgeなど、これから追加されるアプリも使いたい 共有スペースなどが魅力的 よさげな感じもしますが、人気が出ないと、アドビはさりげなくサービス/開発をやめてしまうので、どうかな〜とも思った

    アップグレード?Adobe Creative Cloud?迷う方への試算|DTP Transit
  • アップルのロゴの美しさの秘密 - DTP Transit

    アップルのロゴの欠けている部分は「bite」(かじる)と「byte」(コンピュータで使う単位。1バイト=8ビット)をかけているそうです。 この欠けている部分は、正円の一部分なわけですが、上の葉っぱ部分も2つの円の組み合わせです。よく見ると、3つの円はすべて同じ大きさなんですね。 ぱっと見た目はわからなくても、同じ円の一部だということを、きっと私たちは感じてしまうのでしょう。このあたりに20年以上使われて、飽きられないロゴの秘密なのかしら。 Illustratorのパスファインダー(前面オブジェクトで型抜き、交差)を勉強したり、また、トレースの勉強をするのに格好の素材ということで、10年以上、Illustratorの講習時のネタとして使ってきましたが、ふと思い出したのでエントリーしてみました。 ご参考: あの企業のロゴの秘密いろいろ - かちびと.net アップルロゴは私がデザインした・・・

    アップルのロゴの美しさの秘密 - DTP Transit
  • 1