タグ

ブックマーク / ics.media (3)

  • 覚えれば一生もの! ウェブエンジニアのための正規表現活用入門 - ICS MEDIA

    正規表現は文字列の検索や置換を行うための強力で便利なツールです。基をマスターすれば開発から日常の事務作業までさまざまな場面でラクをできる魔法の道具ですが、見た目がちょっと分かりづらいので、避けている方もいるのではないでしょうか? 筆者の個人的観測ですが、とりわけフロントエンドエンジニアには正規表現に苦手意識を感じている方が多いようです。 この記事では正規表現の基と、正規表現がどこで使えてどれだけ便利になるのかを紹介します。 正規表現の基:正規表現ってそもそも何? 正規表現(regular expression)は、ごく簡単にいえば「さまざまな文字列のバリエーションをひとつの文字列で表現したもの」です。たとえば、郵便番号の7桁の数字には(実際に使われていないものも含めれば)一千万通りのバリエーションがありますが、正規表現を使えば次のようにひとつの文字列で表現できます。 ▼「7桁の数字

    覚えれば一生もの! ウェブエンジニアのための正規表現活用入門 - ICS MEDIA
  • 文字詰めできるCSSのfont-feature-settingsが凄い! 日本語フォントこそ指定したい自動カーニング - ICS MEDIA

    游ゴシックではプロポーショナルメトリクスは効果的 WindowsmacOSに搭載されている游ゴシック体は、仮名が漢字に対してかなり小さめにデザインされています。游ゴシック体ではヒラギノ書体より字間が開いて見えてしまうため、プロポーショナルメトリクスを活用する効果は大きいです。 Webフォントにもプロポーショナルメトリクスは効果的 デバイスフォントだけでなく、Webフォントでもプロポーショナルメトリクスに対応したOpenTypeフォントがたくさんあります。Webフォントに関しては記事「Webフォントサービスの徹底比較! 和文フォントが使える5つのサービスの利点まとめ」を参考ください。 ▲左側は未指定(和文等幅)の状態でカタカナの開きが大きい。右側はプロポーショナル字形を適用した状態で、カタカナが詰まっている。 対応環境:ほぼすべてのブラウザで利用可能 これだけ便利なCSSですが、どれだけの

    文字詰めできるCSSのfont-feature-settingsが凄い! 日本語フォントこそ指定したい自動カーニング - ICS MEDIA
  • Web用保存は古い!? JPEG画質が改善したPhotoshop CC 2015の新方式の画像保存機能まとめ – ICS MEDIA

    みなさんはAdobe Photoshopでどのように画像を書き出してますか? 最新のPhotoshopではさまざまな画像書き出し機能が搭載されていますが、どれを選択するかで手間が異なります。 記事ではPhotoshopのさまざまな画像書き出し機能を紹介し、最適な画像書き出し方法を検証します。 この記事はPhotoshop CC 2022 (23.5.0)で検証しています。 この記事のポイント 新しい画像保存方式(書き出し形式、クイック書き出し)は手間が少ないので、作業効率が良い 新しい画像保存方式はデフォルト設定で、小さなファイルサイズの結果を得られやすい アニメーションGIF保存は「Web用に書き出し(従来)」を使う Photoshopの画像書き出し方法一覧 Photoshop CCにおいて、画像を書き出す方法は分けて5種類あります。 書き出し形式 [ファイル]→[書き出し]→[書き出

    Web用保存は古い!? JPEG画質が改善したPhotoshop CC 2015の新方式の画像保存機能まとめ – ICS MEDIA
  • 1