richard_rawのブックマーク - はてなブックマーク

2024年に最適なfont-familyの書き方 - ICS MEDIA

ウェブサイトのフォントは何を指定すればよいのでしょうか？　CSSのfont-familyプロパティーに指定可能なフォントは選択肢が多く、HTMLコーダーなら誰もが一度は迷ったことがあるはずです。 font-familyの組み合わせを紹介している記事は多々あります。しかし、必要のない指定や、考察不足なまま紹介している記事を見かけることは少なくありません。それもそのはず、フォント事情は日々変化するもので、古い情報は役立たないことが多いためです。本記事ではフォントに関わるここ最近のビッグニュースを取り上げつつ、教訓から学んだ変化に強い﹁無難﹂なフォント指定を紹介します。結論いきなり結論ですが、以下のフォントの組み合わせがオススメです。CSSのbodyセレクターなどにコピー＆ペーストして利用ください。 body { font-family: "Helvetica Neue", Arial,

richard_raw 2020/03/18

游ゴシックは読み辛くてびっくりしましたよね……。

リンク

エンジニアのための、いますぐ使える文章校正テクニック - ICS MEDIA

ウェブ制作や開発の仕事で文章を扱う機会は多いはず。書き手は不自然に思っていない文章でも、読み手は違和感をもっていることがあります。文章校正テクニックを覚えるだけでおかしな表現は少なくなり、読みやすい文章を書けるようになります。本記事では、ICS MEDIAで実践している文章校正の一例を紹介します。レベル1、基本的な校正ルールを使ういろんな場面で使える基本的な文章校正テクニックから紹介します。テクノロジー系の名詞は正しく記載しているかテクノロジー系の名詞を間違って使うと、﹁本当に技術に詳しいの？﹂と読者からの信頼度が下がります。名詞は大文字小文字、スペース有無含めて正確に記述しましょう。 Github → GitHub︵Hは大文字︶ Javascript → JavaScript︵Sは大文字︶ After Effect → After Effects︵複数形の﹁s﹂を忘れてはいけな

richard_raw 2018/10/09

VS Codeの拡張機能「テキスト校正くん」の会社か！

技術
clip

リンク

文章作成・メール作成に役立つ！　VS Codeの拡張機能「テキスト校正くん」を公開 - ICS MEDIA

文章の校正チェックを自動で行うVisual Studio Codeの拡張機能「テキスト校正くん」を弊社からリリースしました。無料で利用できます。テキスト校正くん – Visual Studio Marketplace 短い文章であれば目視でもチェックできますが、長文になるとチェックに時間がかかり見落としも多くなってしまいます。また、いくら内容のいい文章を書いても誤字や脱字が多く体裁が整っていないと、印象が悪く読みづらい文章になってしまいます。そんなとき、「テキスト校正くん」を利用することで、文章チェックの手間を軽減でき、文章の品質を高めることができます。 ▲VS Codeの拡張機能「テキスト校正くん」「テキスト校正くん」でできることこの拡張機能は、VS CodeでテキストファイルやMarkdownファイル等の日本語の文章をチェックします。編集時に自動で校正のチェックを行い、エディタ

richard_raw 2018/09/03

textlintにデフォルトルールが同梱されたやつ？

リンク

文字詰めできるCSSのfont-feature-settingsが凄い！日本語フォントこそ指定したい自動カーニング - ICS MEDIA

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

richard_raw 2016/12/15

文字詰めやリガチャもできるのか！

リンク

コーディングに最適な日本語対応の等幅フォントSource Han Code JPとは – ICS MEDIA

コーディング向けの日本語対応の等幅フォント﹁Sourceソース Hanハン CodeコードJPジェイピー︵和名‥源ノ角ゴシック Code JP︶﹂が、2015年6月4日に公開されました。﹁源ノ角ゴシック Code JP﹂は、プログラミングやHTML/CSSのコーディング、ターミナルでのテキスト表示など、和欧表示用フォントとしての利用を想定されたフォントです。ダウンロードはこちらから Release Fonts (OTF, OTC) · adobe-fonts/source-han-code-jp · GitHub ※このフォントは無償でダウンロード可能です。OTCとTTFの両方のフォーマットで配布されているので、Windows/macOSともに簡単にインストールできます。 ※上記リンクの﹁Fonts version ﹇バージョン番号﹈ (OTF, OTC)﹂となってい箇所の﹇Sourc

richard_raw 2015/06/16

「半角3文字に対して全角2文字」/インストールしたらEmacsが自動的にSource Han Code JPになってた……。

リンク

SourceTreeの使い方 | コミットの取り消し方法まとめ（amend, reset, revert, cherry-pick） - ICS MEDIA

SourceTreeの使い方 | コミットの取り消し方法まとめ（amend, reset, revert, cherry-pick）高機能Gitクライアントの「SourceTreeソースツリー」（無料）や「Tower」（有償）は導入しやすく機能が豊富なため人気があります。Gitにはコミットやプッシュだけではなくさまざまな機能が存在するので、使いこなすことで効率よく開発を進めていけるでしょう。本記事ではGitを使う上で必須となるcommitコミットの取り消し方法をテーマに、次の4つの機能を解説します。コミットの修正・やり直し（amend）コミットの取り消し（reset）コミットの打ち消し（revert）別ブランチからのコミットの取り込み（cherry-pick）本記事では次の機能をSourceTreeとTowerの両方のソフトウェアの操作方法として解説します。コミットの修正・や

richard_raw 2014/10/18

コミットの修正関連。おっちょこちょいなので助かります。

リンク

GIFアニメからAPNGの時代に！次世代画像形式APNGを使いこなそう - ICS MEDIA

APNG（エーピング）とはアニメーションするPNG画像のことで、アニメーションGIFに取って代わる次世代の新しい画像形式です。もともとブラウザベンダーのMozillaが提案した規格で、ウェブサイトのアニメーション表現に利用できます。従来はアニメーションGIFが主流でしたが、アニメーションGIFは色数の制限や輪郭のジャギーなど品質面の制限が多いファイルフォーマットです。その制限を払拭してくれると期待されるのがAPNG形式です。データ容量・品質から比較する画像形式〜APNGは容量が軽くて綺麗上図ではアニメーションGIF・APNG(8bit・32bit)・PNG連番画像をデータ容量・データ品質でマトリクス図にしました。APNG 8bitはアニメーションGIFと同じ256色のサポートなのでAPNG 8bitの方がデータ容量は若干小さいものの、差はほとんどありませんでした。APNG 32bitは

richard_raw 2014/10/01

久し振りに思い出しました。……MNGとの差異がよく分かっていない私。/Chrome未対応ですか。 ●アニメ ●PNG ●画像 ●safari ●clip ●firefox

リンク

SourceTreeの使い方 - 初心者が習得すべき基本操作(diff, stash, tag, revert, cherry-pick) - ICS MEDIA

SourceTreeの使い方 - 初心者が習得すべき基本操作(diff, stash, tag, revert, cherry-pick) GitクライアントのSourceTreeソースツリーは無料で使えるGitアプリケーションとして人気があります。﹁SourceTreeの基本的な使い方はバッチリ！　だけど、まだまだ使っていない機能があるなぁ﹂なんて人も多いのではないでしょうか？　そんな人へオススメの知っておくと便利な機能を5つ紹介します。 ※本記事は2024年4月現在のmacOS 14.4.1、SourceTree 4.2.7で解説しています。Windows版のSourceTreeでも同じ手順で利用できます。はじめに - SourceTreeとは？ SourceTreeはGit / MercurialのGUIクライアントで、Atlassian社から無償で提供されています。Windows

richard_raw 2014/05/30

ああ、そういう風にDiff取れるんですね。/stash使ってないなー。

リンク

クロスプラットフォーム開発の大本命!? HTML5もアプリもFlashも開発できる「OpenFL」とは？ - ICS MEDIA

クロスプラットフォーム開発の大本命!?HTML5もアプリもFlashも開発できる﹁OpenFL﹂とは？﹁インタラクティブコンテンツをワンソースでクロスプラットフォームに対応させたい﹂、それはフロントエンドのデベロッパーであれば誰もが望むことではないでしょうか。一昔前はAdobe Flashが﹁Open Screen Project﹂と題して一歩手前まで実現していましたが、iPhoneからFlashを締め出そうとするAppleの強硬な姿勢によって頓挫することになりました。尾野さん(しっぽさん)からの勧めもあり調べたのですが、﹁OpenFL﹂︵オープンエフエル︶というテクノロジーはさまざまな形式にインタラクティブコンテンツを出力できます。つまりOpenFLを使えばワンソースでクロスプラットフォームを実現できるのです。今回はOpenFLからHTML5とFlashを出力することによってクロス

richard_raw 2014/01/31

Haxe言語ですか……。

リンク

HTML5 CanvasとCSS3のスマホブラウザでの描画性能 - ICS MEDIA

スマートフォンのブラウザでどの程度のグラフィック表現が可能なのか、性能が気になりませんか？　近年、HTML5を利用できる分野はウェブサイトのみならず、ゲームやSPA（シングルページアプリケーション）など多岐に渡っています。そこで、本記事ではiOSやAndroidの新旧さまざまな端末を使ってパフォーマンスを検証。記事の前半では描画性能を、後半ではJavaScriptの計算性能を測定しています。描画性能の検証ビデオをご覧くださいさまざまな端末を使って、描画検証の様子を録画しました。この80秒の動画では画像のオブジェクトの表示可能な個数を測定しています。ビデオの後半が見どころで、iPhone 5のパフォーマンスが良すぎてビデオを早送りするほどスコアがでるまで時間がかかっています。さまざまな端末のスコアを測定しました次の表に、2012年までに発売されたスマートフォンのスコアを掲載しました。

richard_raw 2013/05/28

iPhone5くらい速ければWebViewでいろいろ問題なく出来そうですな。

リンク

モバイルアプリ開発者必見！初期型から最新のAndroid端末まで、Adobe AIR製アプリのパフォーマンス徹底検証 - ICS MEDIA

モバイルアプリ開発者必見！初期型から最新のAndroid端末まで、 Adobe AIR製アプリのパフォーマンス徹底検証 Adobe AIRの技術を使えば、FlashでAndroid/iOS向けアプリを作成できます。それもPCブラウザ向けに作っているFlashコンテンツもコード︵設定ファイル関係︶を少し変更すれば、モバイルアプリに容易に移植できるので、ワンソース・マルチプラットフォームとしてFlashは幅広くコンテンツ・アプリ制作に役立てることができます。しかし、気になるのはAIRアプリのパフォーマンスではないでしょうか。そこでAndroidの新旧さまざまな端末を使ってパフォーマンスを検証してみました。 2Dゲームのパフォーマンスまずは2Dゲームでのパフォーマンスの紹介です。Stage3Dのフレームワーク﹁Starling﹂のサンプルとしてソースが配布されている﹁Whack﹂を使って、

richard_raw 2013/02/15

もっとガラスマっぽい端末でもやって欲しいところ（無茶）。iOS版はまた後で。

リンク

はてなブックマーク

タグ

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

お知らせ

今週のはてなブックマーク数ランキング（2024年7月第3週）

今週のはてなブックマーク数ランキング（2024年7月第2週）

はてなブックマーク透明性レポート（2024年 2月-2024年4月）

公式Twitter

キーボードショートカット一覧

はてなブックマーク

公式Twitter

はてなのサービス