記事タイトルを合成した OGP 画像を画像処理機能が充実した CDN、「imgix」で生成してみる

OGP(Open Graph Protocol) の記述は Web ページを作成する際にほぼ確実に行うと思いますが、その中で og:imageog:image:secure_url に指定する画像に関しては何らかの形で用意しなければなりません。

一部の Blog サービスなどでは特にユーザーが OGP 用の画像を用意しなくても、記事タイトルなどのテキスト情報から自動で OGP 用の画像を生成して設定してくれたりしますが、同じ事を自前のサーバで運用している Web サイトでもできないかなと思い立って、そういえば 「imgix」 ってテキストデータからの画像生成機能があるじゃんってことでやってみました。

「imgix」 は、画像処理機能に特化した CDN で、その基本的な使用方法については以前、記事を書いていますので詳しくは下記をご覧ください。

... more

Firefox 75 が CSS の min()、max()、clamp() 関数に対応、メディアクエリ不要でサイズの出し分けなどが可能に

1つ前のエントリーでも触れたのですが、4月 7日に正式リリースされた Firefox 75 が、CSS における min()max()clamp() 関数に対応しました。

Firefox 以外のモダンブラウザではすでに実装済み (Microsoft Edge も Chromium 版 Edge で対応します。とはいえ日本では現在 Windows Update での自動配信が保留になっていますけども......) だったこともあり、Firefox の正式対応で主要なブラウザ環境では実装の足並みがそろったということになります (IE? そんなブラウザありましたっけ?)。

... more

Firefox 75、HTML の指定のみで動作する画像遅延読み込み (loading="lazy") に正式対応

以前、Chrome で loading 属性を用いたネイティブ実装の遅延読み込みが実装された際にも書いたのですが、Firefox でも先日正式リリースされた Firefox 75 で、同じく、HTML の loading 属性を使用した画像の遅延読み込みが可能になりました。

Chrome での実装により(日本では現在 Windows Update での自動配信が保留になっていますけども)、Chromium 版 Microsoft Edge も loading 属性に対応しますし、今回 Firefox が正式に対応したことで、あとは WebKit が対応してくれれば足並み揃う感じですね。

200764 - Main implementation for lazy image loading」 を見る限り、WebKit での実装も近そうですが。

... more

jQuery 3.5.0 がリリース。セキュリティ修正あり

jQuery 3.4.1 のリリースから、約 1年程経ちましたが、先日、jQuery 公式サイトにて jQuery 3.5.0 のリリースがアナウンスされました。

すでに npm などでは使用可能になっています。Google など、サードパーティの CDN から配信開始されるまでにはまだ少し時間がかかる可能性がありますが(本記事執筆時点ではまだ配信されていません)、順次使用可能になると思われます。

今回のリリースには セキュリティ関連の修正も含まれているため、早めの対応が必要かと思います。

... more

大幅改定されて生まれ変わった「できるポケット HTML&CSS全事典」が2月14日に発売されます

もうずいぶん前の話ですが、2015年の 3月に 「できるポケット HTML5 & CSS3/2.1 全事典」 をインプレスさんから上梓しました。

コンパクトサイズの B6 判で、手元に置いておきやすい HTML / CSS のリファレンス本ですが、おかげさまで初版の発売から約 5年が経過した今でもコンスタントに売れてるらしく、昨年の末に改定版 (増刷に合わせて細かい改定は何回か入っていますが、今回は完全に内容を見直しましょうくらいのレベルで) を出しませんかというお話を頂き、つい先日まで執筆と校正をやっていました。

先週、やっとその作業が終わって入稿され、あとは発売を待つだけという状態になりましたので、告知をさせて頂こうと思います。

Amazon さんなどでの販売ページはすでに用意されていますので予約は可能ですが、実際の発売日は 2020年 2月 14日。たまたまですがバレンタインデーの発売です。これはチョコといっしょに買えということですね(違う

... more

all entries