WWW WATCH - Web デザインやテクノロジーの話題がメインのブログ
人気記事
カテゴリーリスト
ブログについて
検索フォームを開く
検索フォームを閉じる
サイト内検索
最新記事
著書 「できるポケット HTML&CSS 全事典」 が 3 度目の全面改訂、「改訂 4 版」 の発売が決定しました
オープンソースのヘッドレス CMS 「Strapi」をさくらの VPS でセルフホストしてみる
details 要素の name 属性によるグルーピングが全ブラウザで利用可能に
X（Twitter） API を使用して、投稿データ用の JSON から定期的に自動投稿する Python スクリプトを書いてみた
CSS Pseudo-Elements Module Level 4 に追加された ::details-content 疑似要素はブラウザサポートされると便利そう
font-size-adjust プロパティのブラウザサポートが足並みそろった件
Dify を さくらの VPS でセルフホストしてみる
Telegram 上で猫さんを育てる Catizen
Dify をアップデートしたらナレッジのデータソースで 「Web サイト」 を指定可能になっていた件
ごく普通のクリエーター、個人事業主、零細企業社長のための投資戦略
popover 属性 （含む関連属性） がすべてのモダンブラウザで利用可能に
Raspberry Pi 4 で運用中の umbrelOS 0.5.4 を umbrelOS 1.0 にアップデートする
Windows で npm run dev したときに listen EADDRINUSE エラーが出た場合の対処法メモ
Vercel AI SDK を使用して、Claude 3 と、ChatGPT ライクにチャットする Web UI を作る
Safari 17.4 が input type=checkbox の switch 属性に対応したので簡単に試してみる
Node.js で X（Twitter）、Bluesky、Mastodon に JSON データから同時投稿（クロスポスト）する
さくらの VPS で Bluesky PDS （Personal Data Server） をセルフホストしてみる
DMARC レポートの XML ファイルを HTML 形式のレポートに変換するスクリプト
Bluesky で自分が所有しているドメインをハンドルにする （カスタムドメインの設定）
スマートフォンのタップ操作成功率を算出するツール「Tappy」を試してみた
すべての記事を見る
人気記事
Hot Entries
著書 「できるポケット HTML&CSS 全事典」 が 3 度目の全面改訂、「改訂 4 版」 の発売が決定しました
Chatbot UI （オープンソースの ChatGPT UI クローン） を Vercel でホストする
Astro.js と Movable Type Data API を使用して Jamstack な Blog を作ってみる
「できるポケット HTML&CSS 全事典」 が全面改訂、「改訂 3 版」 の発売が決定しました
さくらの VPS を使用してオープンソースのアクセス解析ツール 「Umami」 をホストしてみる
CSS 条件付き規則 （CSS Conditional Rules） Level 5 仕様 （草案） に追加された @when と @else 規則について
人気記事をすべて見る
カテゴリ別最新記事
Browse Categories
Web Development
著書 「できるポケット HTML&CSS 全事典」 が 3 度目の全面改訂、「改訂 4 版」 の発売が決定しました
オープンソースのヘッドレス CMS 「Strapi」をさくらの VPS でセルフホストしてみる
details 要素の name 属性によるグルーピングが全ブラウザで利用可能に
X（Twitter） API を使用して、投稿データ用の JSON から定期的に自動投稿する Python スクリプトを書いてみた
Web Topic
Raspberry Pi 4 で運用中の umbrelOS 0.5.4 を umbrelOS 1.0 にアップデートする
OpenAI TTS（Text to Speech） を Node.js で試してみた
Stable Diffusion による AI 画像生成を Google Colaboratory （Colab） で試してみた件
Movable Type の XMLRPC API における OS コマンドインジェクションの脆弱性 （CVE-2021-20837） を悪用した攻撃被害に関する対応メモ
Accessibility
複数の色の組み合わせを簡単にコントラスト比チェックできる Color Contrast Auto Checker を作ってみました
axe-auto-reporter というアクセシビリティ自動テストのためのスクリプトを公開しました
ChatGPT の画像認識機能を使って画像内のコントラスト比チェックができるか試してみた件
アクセシビリティ試験で補助的に使えるブックマークレット集
Web Service
X（Twitter） API を使用して、投稿データ用の JSON から定期的に自動投稿する Python スクリプトを書いてみた
Dify を さくらの VPS でセルフホストしてみる
Dify をアップデートしたらナレッジのデータソースで 「Web サイト」 を指定可能になっていた件
さくらの VPS で Bluesky PDS （Personal Data Server） をセルフホストしてみる
HTML/CSS
著書 「できるポケット HTML&CSS 全事典」 が 3 度目の全面改訂、「改訂 4 版」 の発売が決定しました
details 要素の name 属性によるグルーピングが全ブラウザで利用可能に
CSS Pseudo-Elements Module Level 4 に追加された ::details-content 疑似要素はブラウザサポートされると便利そう
font-size-adjust プロパティのブラウザサポートが足並みそろった件
HTML
著書 「できるポケット HTML&CSS 全事典」 が 3 度目の全面改訂、「改訂 4 版」 の発売が決定しました
details 要素の name 属性によるグルーピングが全ブラウザで利用可能に
CSS Pseudo-Elements Module Level 4 に追加された ::details-content 疑似要素はブラウザサポートされると便利そう
popover 属性 （含む関連属性） がすべてのモダンブラウザで利用可能に
CSS
著書 「できるポケット HTML&CSS 全事典」 が 3 度目の全面改訂、「改訂 4 版」 の発売が決定しました
CSS Pseudo-Elements Module Level 4 に追加された ::details-content 疑似要素はブラウザサポートされると便利そう
font-size-adjust プロパティのブラウザサポートが足並みそろった件
popover 属性 （含む関連属性） がすべてのモダンブラウザで利用可能に
JavaScript
Node.js で X（Twitter）、Bluesky、Mastodon に JSON データから同時投稿（クロスポスト）する
DMARC レポートの XML ファイルを HTML 形式のレポートに変換するスクリプト
Astro で details 要素に name 属性を使うと型チェックでエラーになる件を解決する
Astro と Movable Type Data API でページネーション （ページ分割） を実装する
Next.js
Vercel AI SDK を使用して、Claude 3 と、ChatGPT ライクにチャットする Web UI を作る
Next.js （SSG） + Vercel + GitHub Actions を使用した定期デプロイ
Next.js から Feedly API を叩いて記事データを取得する
Next.js から Qiita API v2 を叩いて人気記事のデータを取得する
Tool
X（Twitter） API を使用して、投稿データ用の JSON から定期的に自動投稿する Python スクリプトを書いてみた
Dify をアップデートしたらナレッジのデータソースで 「Web サイト」 を指定可能になっていた件
DMARC レポートの XML ファイルを HTML 形式のレポートに変換するスクリプト
Chatbot UI （オープンソースの ChatGPT UI クローン） を Vercel でホストする
Browser
popover 属性 （含む関連属性） がすべてのモダンブラウザで利用可能に
Firefox 121 が正式リリース、やっと :has() 疑似クラスに対応
Internet Explorer 11 がついにサポート終了、2022年 6月 15日でお別れへ
Google Chrome が4週間隔にリリースサイクルを高速化、Edge も同様に
Security
Movable Type の XMLRPC API における OS コマンドインジェクションの脆弱性 （CVE-2021-20837） を悪用した攻撃被害に関する対応メモ
Let's Encrypt で発行するサーバ証明書の暗号方式を RSA から ECDSA （楕円曲線 DSA） に変更する
Firefox 83 に 「HTTPS-Only モード」 が追加、Web サイトへの接続時、HTTPS 接続を強制可能に
パソコンやスマートフォンが得意ではないという人でもわかるオススメのパスワード管理方法（2020年10月版）
Application
Dify を さくらの VPS でセルフホストしてみる
Telegram 上で猫さんを育てる Catizen
Dify をアップデートしたらナレッジのデータソースで 「Web サイト」 を指定可能になっていた件
Raspberry Pi 4 で運用中の umbrelOS 0.5.4 を umbrelOS 1.0 にアップデートする
CMS
オープンソースのヘッドレス CMS 「Strapi」をさくらの VPS でセルフホストしてみる
Astro と Movable Type Data API でページネーション （ページ分割） を実装する
さくらの VPS （Ubuntu 22.04 amd64 + nginx） で Movable Type 実行環境を作る
Astro.js と Movable Type Data API を使用して Jamstack な Blog を作ってみる
Gadget
Raspberry Pi 4 で運用中の umbrelOS 0.5.4 を umbrelOS 1.0 にアップデートする
Umbrel で立ち上げた Lightning ノードに Alias （エイリアス） と Color （カラー） を設定する
Windows 11 にアップグレードするための 「PC 正常性チェック」 で NG になったので、BIOS の設定から TPM 2.0 を有効にする
Raspberry Pi 4 + Umbrel で Bitcoin フルノードを立ち上げ、Lightning Network （Diamond Hands プロジェクト） に参加してみる
Blog
ごく普通のクリエーター、個人事業主、零細企業社長のための投資戦略
Blog から広告 （Google AdSense） を全部削除してみた
MovableType.net サイトサーチを Google カスタム検索エンジン使用中サイトに 5 分で導入する
スクールでは （多分） 教えてくれない、フリーランスとして駆け出す前に知っておきたいこと
SNS
X（Twitter） API を使用して、投稿データ用の JSON から定期的に自動投稿する Python スクリプトを書いてみた
Telegram 上で猫さんを育てる Catizen
Node.js で X（Twitter）、Bluesky、Mastodon に JSON データから同時投稿（クロスポスト）する
さくらの VPS で Bluesky PDS （Personal Data Server） をセルフホストしてみる
Cloud
日本語化して、ダッシュボードへのベーシック認証を追加した Pa11y Dashboard を作ってみた
DigitalOcean （Ubuntu 20.04） で Pa11y Dashboard を簡単に立ち上げる
Mastodon インスタンスの画像や動画の保存先をクラウドストレージ （Amazon S3） に移行した話
Dropbox が 「Project Infinite」 を発表、ローカルのディスク容量が少ない環境でも使いやすく
Event
1990 年代後半から CSS を触っている私が当時の記憶を振り返る、CSS 昔話
「アクセシビリティ」 を当たり前にするために制作者はどう考えればよいのか
Web アクセシビリティを身近に感じてもらうためのごく簡単なお話
Happy birthday W3C - World Wide Web Consortium が設立から 20周年
Book
著書 「できるポケット HTML&CSS 全事典」 が 3 度目の全面改訂、「改訂 4 版」 の発売が決定しました
「できるポケット Web 制作必携 HTML&CSS 全事典 改訂 3 版」 3 度目の重版 （第 4 刷） が決定しました
「できるポケット Web 制作必携 HTML&CSS 全事典 改訂 3 版」 2 度目の重版 （第 3 刷） が決定しました
「できるポケット Web 制作必携 HTML&CSS 全事典 改訂 3 版」 の重版が決定しました
Product
動画 （Netflix） 視聴目当てで Oculus Go を購入したら正解だった件
Surface Pro 3 が 「Surface」 ロゴ表示で固まって起動しなくなった時の対処方法
Microsoft が Surface Pro、Surface Pro 2 等の電源コードを自主回収
Windows 7 のメインストリームサポートが終了、延長サポート期間へ
HTML5
「できるポケット HTML&CSS全事典」 の重版が決定しました
AMP の実装で 「要素に class 付けて開閉する」 みたいな UI は amp-bind を使うと超簡単で手軽だった件
Firefox 75、HTML の指定のみで動作する画像遅延読み込み （loading="lazy"） に正式対応
W3C と WHATWG、HTML/DOMの仕様策定で協力し、共通の仕様を共同管理すると発表
Mobile
優れた UX を提供する Web サイトを強調するため、Chrome for Android に 「Fast Page」 ラベルが導入される
AMP ページで Font Awesome を使用する
AMP の実装で 「要素に class 付けて開閉する」 みたいな UI は amp-bind を使うと超簡単で手軽だった件
次期 Android では 「DNS over TLS」 がサポートされる
New Service
Tailwind CSS を使用した日本語ウェブサイト向け UI サンプル集 「バーンワークス UI ライブラリ」
フロントエンド開発に関連する技術系記事をまとめてチェックできる 「TechDeck」 という Web サイトを作ってみた
ボタンを押したら商品が届く、「Amazon Dash Button」 を早速試してみた
Amazon が Kindle for PC をリリース、和書も PC で閲覧可能に
Podcast
世界初の Firefox OS 商用端末、ZTE Open が発売開始
Vodcast 対応 PSP MM
Yahoo! Podcasts BETA
iTunes で Podcast を公開
XML
DMARC レポートの XML ファイルを HTML 形式のレポートに変換するスクリプト
IFTTT から Blog の更新を自動で画像付きツイートするためにフィードを少し直した件
SVG のフォールバックは結局 Modernizr に落ち着いた件
ブラウザから SVGO で SVG ファイルを最適化できる 「SVGOMG」
Item
Kindle Voyage 買ったけど 1点だけどうしても納得いかないことが......
国立競技場の座席 （自由席 / 指定席） からスツールを作ってみた
Surface Pro 3 買ったら Surface Pro 2 で不満だったところをほとんど解消してくれた件
Anker 5ポート USB急速充電器 ACアダプタとまな板スタンドの組み合わせがいい感じな件
