Autocomplete workshopというミーティングが今年1月に行われたようで、autocomplete方面が盛り上がりつつあるみたいです（whatwg/html#4986）。 このワークショップのノート（Google Doc）が公開されていますけれども、参加者にブラウザーベンダー*1がいるのは当然として、Eコマースのプラットフォーム方面（Shopify、WIX、Checkout.com、Shipper HQ）が参加しているのが興味深いところ。 箇条書きでまとめられているものを雑に引っ張ってみると actocomplete属性の拡張をこれから考えていくことになるが、目下で注目しているのは名前と住所 250サイトについて入力フォームを調べてみた 日本を含めたいくつかの国は、オートフィルがうまく機能しない どの情報を1つのフィールドに入力するかについて、サイトごとにまちまち 日本では氏
コピペで簡単に使用できる、HTMLとCSS（複雑なものはSVG）で実装されたWebサイトやスマホアプリ用のローディングアニメーションを紹介します。 さまざまなローディングやスピナーが揃っていますが、画像は一切使用されていません。必要な時にさくっと実装できるので、スニペットに登録しておくと便利です。 下記は静止画ですが、もちろん全部アニメーションで動きます。 Loaders -UI Ball Loaders -GitHub ほかにもCSSで実装されたローディングをチェックしたい人は、下記もどうぞ。 CSSで実装されたローディング・スピナーのアニメーションのまとめ UI Ballのローディングはすべて1Kb未満の超軽量で、依存関係はゼロなので、HTMLとCSSをコピペするだけで簡単に使用できます。カラー・サイズ・アニメーションの速度などはCSSで簡単にカスタマイズできます。 MITライセンスで
はじめに 突然ですがこのページを開いてCtrl+Fのページ内検索を開き、 x y z のいずれかの文字を検索してみてください。 https://codepen.io/babatakao/full/bNeBOwr このように、検索した結果がalertで表示されます。 言いたかったこと このように、ページ内検索したテキストはコンテンツJavaScriptから検知できます。 選択したテキストや、フォームに入力したテキストが検知できるのは当然なのですが、ページ内検索テキストは今まで知りませんでした。例えば得体のしれない怪しいウェブサイトで「自分のメールアドレスが漏洩していないかな」とページ内検索、などはやっては駄目なことになりますね。気をつけましょう。 仕組み こんなHTMLとJavaScriptを仕込んでいました。 <p hidden="until-found" id="x">x</p> <p
input[type="file"] 同じファイルを選んでもchangeイベントが発火しない問題をちょっとだけ深掘りするよ🎶 - カミナシ エンジニアブログ
「よし、これで完璧！」と思って実装したファイルアップロード機能。テストで同じファイルを2回選んだら...あれ？2回目は何も起きない。 // さっきまで動いてたはずなのに... <input type="file" onChange={(e) => { console.log('ファイル選択した！', e.target.files[0]); uploadFile(e.target.files[0]); }} /> 「え、なんでonChange動かんの...？」 Chromeのコンソールとにらめっこすること数分。これ、実は私の実装ミスじゃなくて、ブラウザの仕様に起因する面白い問題だったんです。今日は、この挙動を掘り下げて、Web標準とブラウザによる挙動の違いについて話してみたいと思います。 そもそもchangeイベントってさぁ 教科書的な説明を確認してみる MDNのchangeイベントのドキュ
![input[type="file"] 同じファイルを選んでもchangeイベントが発火しない問題をちょっとだけ深掘りするよ🎶 - カミナシ エンジニアブログ](https://cdn-ak-scissors.b.st-hatena.com/image/square/52fca391c648644607dcb0c6dc9553b785e1ad70/backend=imagemagick;height=288;version=1;width=512/https%3A%2F%2Fcdn.image.st-hatena.com%2Fimage%2Fscale%2Fa4c3cafc63f5a2e2ff57fa86a97d43b969b42b92%2Fbackend%3Dimagemagick%3Bversion%3D1%3Bwidth%3D1300%2Fhttps%253A%252F%252Fcdn-ak.f.st-hatena.com%252Fimages%252Ffotolife%252Fk%252Fkaminashi-developer%252F20251111%252F20251111100718.png)
はじめに みなさんは、CSSのdisplayプロパティを知っていますか？ CSSを扱う上で、一番使うのがdisplayプロパティではないのでしょうか？ 最近では、display: flex; や display: grid; が追加され、いろいろなレイアウトが作りやすくなったのは、記憶に新しいかと思います。 そんな中で、CSS Display Module Level 3で、displayプロパティに2つの値を入れることができるようになることがわかりました。 ※ まだ、Firefox 70以上・Safari 15以上でのみ再現できます。(2022年１月20日) そのため、この記事では、displayプロパティに2つの値を入れられることについて解説しようと思います。 背景 まずは、displayプロパティに2つの値を入れられるようにした背景について解説します。 最近displayプロパティに
HTML 出力は見やすくて自由度が高い Claude Code に成果物を出力させる際、プレーンテキストや Markdown ではなく HTML で出力させると、そのままブラウザ (Chrome など) で開くことができ、Markdown の本部プレビューと比べて人間にとって非常に見やすくなります。 HTML は見出しや箇条書きにとどまらず、各 HTML 要素や CSS, JavaScript, SVG などを組み合わせて多彩な表現ができます。Markdown と比べてはるかに自由度が高いです。 Claude Code チームも 2026/05 に、Markdown ではなく HTML を出力形式として推奨する記事を公開しています。 HTML での問題: 見た目やフォーマットがばらつく 一方で、HTML を出力するつど見た目やフォーマットにばらつきが生じて困るという問題があります。 出力の
どのような問題点があったか 日本語入力環境では「全角数字（１２３４…）」を入力するケースが多く存在します。ところが、 <input type="number"> は仕様上「半角数字のみ」を受け付ける設計となっており、主要ブラウザの実装でも全角数字は「非数値」と判断され、入力が拒否されてしまいます。
![input[type="number"]における全角入力対応をChromium/WebKitへ提案と実装をした話](https://cdn-ak-scissors.b.st-hatena.com/image/square/55ecc0e848ab90d979de1992913f8c379dc838f4/backend=imagemagick;height=288;version=1;width=512/https%3A%2F%2Fwww.fourier.jp%2Fstorage%2Fblog%2Fpost-outline%2F72p4chSEDv2ghmnU9xADoSgwBWvhGumO.jpg)
input[type=checkbox] 要素に switch 属性を指定することによる HTML 標準のスイッチ UI の提案
チェックボックスなどと同じく、スイッチ UI のデフォルトのスタイルを変更しカスタマイズしたい場合には、appearance: none を指定してデフォルトのスタイルを無効化する必要があります。スイッチがオンの場合のスタイルは :checked 疑似クラスを使って指定できます。 input[type="checkbox"][switch] { appearance: none; background-color: #e5e5ea; position: relative; width: 78px; height: 48px; border-radius: 8px; } input[type="checkbox"][switch]::thumb { width: 42px; height: 42px; margin-top: 2px; margin-left: 2px; border-rad
![input[type=checkbox] 要素に switch 属性を指定することによる HTML 標準のスイッチ UI の提案](https://cdn-ak-scissors.b.st-hatena.com/image/square/9f121bdc3c469d1c54d99740c84676715dade946/backend=imagemagick;height=288;version=1;width=512/https%3A%2F%2Fazukiazusa.dev%2Fblog%2Fogp%2Finput-type-checkbox-switch.png)
php-fpm の挙動を確認するために発行されるシステムコールを簡単に確認できる Docker Compose 環境を作りました。 github.com システムコール strace-php-fpm strace オプション php-fpm が発行するシステムコール例 ini ファイルの探索 nginx からの FastCGI リクエスト PHP ファイルの読み込み さいごに 参考 システムコール システムコールは、php-fpm のようなユーザプログラムが、ファイル操作やネットワーク通信、プロセス制御のようなカーネルが提供する機能を利用する仕組みです。PHP コードは PHP（ここでは php-fpm）で実行する必要があるので、php-fpm が発行するシステムコールを確認することで php-fpm や PHP コードがどのように動作しているかを知る手掛かりになります。 システムコールを
静的サイトジェネレータ「Astro 6.0」正式リリース。開発環境としてCloudflare Workers対応。Rust製コンパイラの実験的追加など
静的サイトジェネレータ「Astro 6.0」正式リリース。開発環境としてCloudflare Workers対応。Rust製コンパイラの実験的追加など 静的サイトジェネレータ「Astro」の最新版となる「Astro 6.0」正式版がリリースされました。 Astroを開発してきたAstro Technology Companyは今年（2026年）1月、CDNサービス大手のCloudflareに買収されています。Astro 6.0は買収後初めてのメジャーバージョンアップとなります。 参考：静的サイトジェネレータ「Astro」、Cloudflareによる買収を発表 Astro 6 is here! We completely rebuilt the Astro dev server and build pipeline onto a new, more powerful runtime-agno
CSSの進化が止まらない！ 自分でオリジナルの関数を定義できるようになります、Chrome 139で新しく追加された6個のCSSの機能
昨日アップデートされたChrome 139に追加された、CSSの新しい機能を紹介します。 今回のアップデートの目玉は、CSSでオリジナルの関数を定義できるカスタム関数、角を自由にスタイルできるcorner-shapeプロパティ（アニメーションもできます！）など、Web制作者は要チェックです！ New in Chrome 139 Chrome 139 beta 下記は各ポイントを意訳したものです。 ※元サイト様のライセンスに基づいて翻訳しています。基づいてというのは、貢献部分に関して同ライセンスも含みます。 はじめに CSSのカスタム関数 var()とattr()の短絡 CSSのcaret-animationプロパティ 角をスタイルできるcorner-shape 初期値に切り替えても、実行中のトランジションを継続する svg要素の幅と高さをプレゼンテーション属性としてサポート はじめに 8/
When servers were in Swiss basements, all they had to serve was static HTML. Maybe, if you were lucky, you got an image. Now, a webpage can be a full-blown app, pulling in data from multiple sources, doing on the fly manipulations, and allowing an end-user full interactivity. This has greatly improved the utility of the web, but at the cost of size, bandwidth, and speed. In the past 10 years, the
AI開発を手掛けるASReal（東京都目黒区）とHashLab（京都市）は10月4日、日本語で仕様を伝えるだけでコーディングするプログラミングAI「AI Programmer」（β版）を公開した。利用料は無料で、対応言語は14種類。 使いたいプログラミング言語を指定し、入力欄に「“Hello World”という文字列を表示する」などとプログラムの内容を日本語で書きこんで実行ボタンを押せばコードを出力する。 対応言語はSQL、Python、JavaScript、HTML・CSS、Solidity、C++、PHP、GO、R、Perl、Ruby、正規表現、Haskell、Lisp。コードを出力するのみで、コンパイルなどの機能は持たない。 AI生成のプログラムは動作するのか？ どのくらい使えるのかチェックしてみた。まずはC++で「Hello World」を出力するプログラムを書かせてみる。指示は「
Web 標準と、その限界
JavaScript、たくさんバックエンドで使われてますよね、あなたも使ったことはありませんか？ そんな バックエンドでも使われている JavaScript。そこに標準で組み込まれている Web 標準な API 。それを考えていきます。 Web 標準 とは何か Web を構成するための技術として、主に HTML/CSS/JavaScript があります。 どのブラウザでサイトを見ても同じ結果が得られるように、その HTML/CSS/JavaScript をまとめている仕様のことです。 例えば、 HTML の仕様は HTML Living Standard が主流で、 WHATWG という団体が決めています。 JavaScript では、構文や基本的な機能 (Arrayなどの言語使用) は ECMA という団体が ECMAScript を策定しています。この中にはfetchは含まれていないの
Intro 本サイトは自作の Markdown ビルダを使っていたが、色々と気に食わない部分があったのでフルスクラッチで作り直し、それにともなってサイトの刷新を実施した。 必要だった要件や、意思決定を作業ログとして記す。 Markdown 本サイトは、一般に使われている Markdown -> HTML の変換結果では要件を満たせないため、最も都合の良い AST を吐く Kramdown のパーサから AST だけを取得し、それを Traverser でカスタマイズしてから自前でシリアライズしていた。 その実装を、微修正を繰り返しながら、継ぎ足し継ぎ足しで 5 年くらいイジってきたので、そろそろ自分がブログを書く上での要件も固まっており、記事中の Markdown のスタイルも固定してきた。 一方、Kramdown の実装が原因でどうしてもワークアラウンドが必要だった部分に、フラストレーシ
2023 CSS
2023年に使えるようになったCSSでレイアウトや表現について紹介します。
【伝説の業務用SSD】「Intel Optane P5800X」を入手！5年前発売、既に”消滅”、なのに未だ最強の性能を試す。【500万円PC建造計画 #12】
今回はずっと気になっていたパーツを試してみます。〇音声読み上げ・VOICEROID2 https://www.ah-soft.com/product/series.html〇登場キャラクター・VOICEROID+：東北きりたん・VOICEROID2：音街ウナ〇動画内で使用させていただいているBGM・fun fun Ukelele：shimtone 様 https://dova-s.jp/bgm/play16650.html・Metal Jingle：shimtone 様 https://dova-s.jp/bgm/play16229.html〇その他素材・pixabay さま https://pixabay.com/ja/ ・効果音ラボ さま https://soundeffect-lab.info/〇投稿者のTwitter https://twitter.com/Saityo_Zunda
5月にリリースされたChromeとEdgeで、CSSのif()関数がサポートされました。これによりCSSでもif elseの条件文が使えるようなり、プロパティに対して条件付きで値を設定できるようになりました。 新機能なので、実際にどのように使えばよいのか分からないことも多いと思いますので、if()関数の便利な使い方を紹介します。 たとえば下記のCSSだと、ボタンの幅はマウスで操作できるデバイス（デスクトップなど）だと30px、タッチデバイスだと44pxになります。 CSS conditionals with the new if() function 下記は各ポイントを意訳したものです。 ※元サイト様のライセンスに基づいて翻訳しています。基づいてというのは、貢献部分に関して同ライセンスも含みます。 はじめに if()関数のデモ: インラインのメディアクエリ if()関数のデモ: インライン
HTMLやCSSをドラッグ＆ドロップするだけでウェブサイトとして公開できる「Cloudflare Drop」を使ってみた
CDN大手のCloudflareが「Cloudflare Drop」という静的サイトデプロイサービスを2026年7月8日にリリースしました。HTMLファイルなどをドラッグ＆ドロップするだけでCloudflareのCDNを用いたウェブサイト公開が可能で、アカウント作成せずとも60分間の期限付き公開を試せるとのこと。興味深いので使ってみました。 Cloudflare Drop · Changelog https://developers.cloudflare.com/changelog/post/2026-07-08-cloudflare-drag-and-drop/ Cloudflare Dropを使うには、まず以下のリンク先にアクセスします。 Cloudflare Drop https://www.cloudflare.com/drop/ Cloudflare Dropのトップページはこん
Floating UI - Create tooltips, popovers, dropdowns, and more
A JavaScript library to position floating elements and create interactions for them. Smart Anchor PositioningAnchor a floating element next to another element while making sure it stays in view by avoiding collisions. This lets you position tooltips, popovers, or dropdowns optimally.
Webサイトリリース前に確認すべきSEO内部施策10項目をご紹介！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、制作事業部WebディレクターのZIMAです。 みなさん、SEO内部施策やってますか？ やっていないわけないですよね。しかし「どこまでやってますか」と聞かれると……困っちゃう人多いのではないでしょうか。 実は自分もどこまでやればいいんだろう？ と思って、我らがづやさんに聞いてみたところ「ふむふむ、それなら、 ちょうどいいの作ってるから、勉強がてらZIMAがつくってみてよ」と、ひょんな流れから私がLIGのSEO内部施策チェックリストを作成することになりました。 せっかくなのでブログにして自分の学びをみなさまに共有したいと思います！ そもそもSEO内部施策ってなんだ？ Webサイトの中身をGoogleなどの検索エンジンに正しく伝えたり、ユーザーがストレスなく利用できるようユーザビリティを向上させるための施策のことです。 世界中のWebサイトをクローリングしているのは簡単に言えばロボッ
Web Platform Dive into the web platform, at your pace.
スムーススクロールの実装例 – TAKLOG
スムーススクロールの実装メモです。このブログの見出しのページリンクやトップへ戻るボタンで使われている実装と同じものになります。 そもそもスムーススクロールは必要か？という議論は置いておいて、現在ではCSSのみでスムーススクロールの実装はできますが、当ブログではそれを使用せずにJSで実装を行っています。 スムーススクロールのコードと実装例スムーススクロールの実装例
GitHub - abi/screenshot-to-code: Drop in a screenshot and convert it to clean code (HTML/Tailwind/React/Vue)
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
=>htmz> a low power tool for html htmz is a minimalist HTML microframework for creating interactive and modular web user interfaces with the familiar simplicity of plain HTML. [GitHub] plain🍦 Use straight up HTML. No supersets. No hz- ng- hx- v- w- x-; no special attributes. No DSLs. No <custom-elements>. Just vanilla HTML. lightweight🪶 166 bytes in total. Zero dependencies. Zero JS bundles to l
この記事では、ヘッドレスCMSを使ってHTMLコンテンツを生成する手順を紹介します。 前回の記事（MicroCMSと11tyで作るかんたん静的サイト）ではAPIデータの取得とHTMLの生成のみを行いましたが、今回はSassを使うためにビルドツールであるViteを導入して、より実制作に近い環境での検証をします。 ビルドツールであればGulpやWebpack等の選択肢もありましたが、Viteの設定が非常に簡便であるという噂を聞いたので試してみることにしました。 HTML CSS JS GulpやWebpack等のビルドツール利用経験 各ツールの役割 MicroCMS：ヘッドレスCMS。コンテンツのデータを登録できる、APIを提供している。 11ty：ヘッドレスCMSのAPIからコンテンツを取得できる静的サイトジェネレーターで、HTMLを出力することができる。複数のテンプレート形式に対応している
この記事は BASE アドベントカレンダー 13 日目の記事です。 はじめに こんにちは。 BASE BANK 株式会社 Dev Division にて Software Developer をしている永野(@glassmonekey)です。 普段はバックエンドエンジニアとして、Go/Python/PHP を主に書いてたりします。 最近はチームの分析基盤づくりとかもやってたりします。 そのことについて先日書いたりもしたので、もし良かったらご確認ください。 devblog.thebase.in 私達のチームでは、「BASE」でショップを運営しているショップオーナーが簡単に資金調達をできる「YELL BANK」というサービスの開発・運営しています。 thebase.in あるプロジェクトで、ショップオーナーへのコミュニケーション手段に HTML メール を新しく作ることになりました。その際に
命令は、無条件に従うべき当為として命令する「定言命法」と、条件付きで「こういうときはこうすべき」と命令する「仮言命法」に分けられる
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
CSSの変数（カスタムプロパティ）は、IEを除くすべてのブラウザでサポートされており、実際のプロジェクトで使用している人も増えてきたと思います。 CSSの変数は非常に便利で使いやすいのですが、期待通りに動作しないときの解決方法を紹介します。 The Big Gotcha With Custom Properties by Chris Coyier CSSの変数（カスタムプロパティ）の基礎知識、便利な使い方は以前の記事をご覧ください。 CSSの変数（カスタムプロパティ）便利な使い方を詳しく解説 CSS変数の優れた使い方、コンポーネントのバリエーションを実装するのに役立つ 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 CSSの変数（カスタムプロパティ）が期待通りに動作しない！ 解決方法 1: 変数を使用する場所にスコープを設定する
2024年、Web制作・デザインに役立つ記事の総まとめ
2024年、当サイトで公開した記事の中からPocketにたくさん保存された記事やXにポストされた記事をジャンル別にまとめました。今年を振り返りつつ、来年のWeb制作にも役立つオススメです。 Web制作全般 UI/UX関連 デザインのテクニック・インスピレーション Photoshop, XD, Figma, VSCodeなどツール フォント・タイポグラフィ カラー HTML CSS: 基礎知識 CSS: 実装テクニック JavaScript フレームワーク・ライブラリ 無料素材 便利ツール・サービス 当サイトの購読は、RSS Feedを利用すると便利です。 コリスのRSS Feed ※旧Feedに登録されている人がまだ多いので変更をお願いします。 Web制作全般 2024年の大きなニュースの一つは、CSSの進化です。IEのサポート終了にも慣れ、モダンCSSの新機能も今までよりも早くブラウザの
求職者の方々の仕事探しや日頃の業務に役立つコンテンツ等を展開しています。
Goodbye innerHTML, Hello setHTML: Stronger XSS Protection in Firefox 148 – Mozilla Hacks - the Web developer blog
Cross-site scripting (XSS) remains one of the most prevalent vulnerabilities on the web. The new standardized Sanitizer API provides a straightforward way for web developers to sanitize untrusted HTML before inserting it into the DOM. Firefox 148 is the first browser to ship this standardized security enhancing API, advancing a safer web for everyone. We expect other browsers to follow soon. An XS
AIがアプリケーションコードもテストコードも書く時代、UIを操作するE2Eテストは「通るか」だけでなく、「何を操作しているかが読み取れるか」という視点も重要です。 AIが生成したUIのテストコードは一見それらしく動いても、順番や見た目のテキストに依存していて、あとから読むと意図がわからないことがあります。 // 0番目の「削除する」をクリックする await page.getByText('削除する').nth(0).click(); たとえば、上のテストコードは、nth(0)で0番目の「削除する」を順番で決め打ちしています。今は通っていても、ボタンが増えたり順番が変わったりすると意図しない要素を操作する可能性があります。 本記事では、Playwrightで要素を取得する方法（ロケーター）を、「順番」や「文字列だけ」ではなく、ユーザーが認識する役割・名前・領域に沿って指定する方法を紹介しま
macOSのSafariでは、ボタンやリンクにTabキーでフォーカスを移動できないのがデフォルトの設定になっている Safariでは、「設定」画面の「詳細」パネル内にある「Tabキーを押したときにWebページ上の各項目を強調表示」のチェックを入れていないと、Tabキーを押したときにボタンやリンクにフォーカスが移動しません（Optionキーを押しながらTabキーを押すと移動できます）。デフォルトではチェックが入っていない状態になっています。 また、macOS版Firefoxでは、「設定（about:preferences）」内の「タブキーでフォームコントロールおよびリンク間のフォーカスを移動する」にチェックが入ってないと、Safariと同じくボタンやリンクにはTabキーでフォーカスが移動しないようになっています。これはSafariの挙動にあわせて追加されたようで、やはりデフォルトではチェック
本記事では、RAGの性能を高めるための「HtmlRAG」という手法について、ざっくり理解します。株式会社ナレッジセンスは、エンタープライズ企業向けにRAGを提供しているスタートアップです。 この記事は何 この記事は、WebページをRAGしたい時に回答精度を上げる「HtmlRAG」の論文[1]について、日本語で簡単にまとめたものです。 今回も「そもそもRAGとは？」については、知っている前提で進みます。確認する場合はこちらの記事もご参考下さい。 ※前提として、HtmlRAGは、Webから取ってきた文書を使ってRAGしたいときにだけ有効な手法です。PDFやWordでRAGしたい場合、今回あまり関係ないです。 本題 ざっくりサマリー HtmlRAGは、RAGの精度を上げるための新しい手法です。中国人民大学と百川智能（Baichuan Intelligent）の研究者らによって2024年11月に提
丁寧なDeno+JSX - laiso
*1 サーバーレスFunctionsぐらいの気軽さでサーバーアリのWebアプリをデプロイしたいという時がある。主に自分たちだけが使うようなツール系のやつ。 その時に今までのようにSPA+APIアーキテクチャではなく、モノリシックなサーバーサイドアーキテクチャにしつつもフロントエンド開発と同じツールチェインを使いたい、と前から思っていた。 これは単にReactメタフレームワークでも一気通貫に時短で作れそうだけど、個人の楽しみのための活動なので、一旦世間のトレンドからは離れて自分が本当に必要だと思った要素技術のみを最小限に使って理解しながら試行錯誤したい。 ※ただ第三者に提供するシステムとかは安全に作られた既存フレームワークに乗るのがいいというのもある しばらく考えてみたところ、私にとっては「TypeScriptでJSXをテンプレートエンジンに使ってHTMLを書けるだけでよい」という所に落ち着
「最新版どれですか」が戻ってきた Claude Code に調査レポートや比較表を頼むと、きれいな HTML を吐いてくれますよね。それを Slack に添付して送る。修正が入る。また添付する。数日後、チャンネルには comparison_final_v2.html と comparison_final_v2_fixed.html が並んでいて、誰かが聞くわけです。 「最新版どれですか?」 この問題、実は一度解決済みでした。エンジニアは git で、非エンジニアは Google Docs で解決していたはずなのに、AI が HTML ファイルを吐く働き方とともに戻ってきた。進歩すると、戻るものもあるんですね。 みんな一回、自作する で、エンジニアはどうするか。「S3 に置いて URL を配る君」を自作します。作りますよね。ぼくも作りました。 でも、この手の間に合わせは定着しません。アクセス
個人サイトを運営していたオタクに悲報「ウソだと言ってくれ」「さようならHTML」 - 女性向けアニメ情報サイトにじめん
Twitterサ終で、個人サイトにもどるインターネット歴が長いアラサーたちへ。 <font>タグはもうありません。 <center>も<marquee>も廃止になりました。 <bgsound>はビックリするのでやめてください。 <table>でレイアウトする時代は終わりました。 CSSでやりましょう。 — ほっくん (@dis_honest) November 18, 2022 Twitterにて、個人サイトに戻ろうとしているインターネット歴が長いアラサーオタクへ向けた投稿が注目されています。 投稿主は「<font>タグはもうありません」と、2000年代に個人サイトを作る上で必須だった<font>タグが意味をなさなくなったことを綴りました。 さらに続けて、「<center>も<marquee>も廃止になりました」「 <bgsound>はビックリするのでやめてください」「 <table>でレ
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
autocomplete属性のものすごく簡単なメモ - 水底の血
これならコピペで簡単！ HTMLはシンプル、CSSで実装された超軽量のおしゃれなローディング・スピナー -UI Ball
ページ内検索したテキストはWebサイト運営者にバレる｜TechRacho by BPS株式会社
【CSS】displayプロパティに2つ値が入るってマジ！？ どゆこと！？ - Qiita
Claude Code で HTML を出力する際に CSS フレームワークを指定すると便利 - Qiita
input[type="number"]における全角入力対応をChromium/WebKitへ提案と実装をした話
Docker Compose で php-fpm が発行するシステムコールを見る - Shin x Blog
The Future (and the Past) of the Web is Server Side Rendering | Deno
日本語の指示からプログラム自動生成「AI programmer」登場 C++とHTMLで試してみた
「Microsoft Edge」開発者ツールの3Dビューツールが強化／HTML構造の立体表示、Zオーダーだけでなく、合成レイヤーの情報まで取得可能に
自作 Markdown プロセッサベースの blog.jxck.io v2 リリース | blog.jxck.io
CSSでついにif elseの条件文が使える！ if()関数の便利な使い方を解説
Learn Performance | web.dev
htmz - a low power tool for html
MicroCMSとViteで作るかんたん静的サイト | DevelopersIO
MJMLでhtmlメールを楽にいい感じに書くことができた話 - BASEプロダクトチームブログ
空のdiv要素についての哲学的な話 - lacolaco
GitHub - orf/html-query: jq, but for HTML
CSSの変数（カスタムプロパティ）が期待通りに動作しないときの解決方法
お役立ち情報 | AKKODiS（アコーディス）コンサルティング株式会社
HTMLのセマンティクスを意識して、壊れにくいテストコードを書こう - ICS MEDIA
スクリーンリーダーの操作にはTab以外のキーも必要です - Qiita
WebページをRAGしたい時の精度向上手法「HtmlRAG」
AIが作ったHTMLの社内共有、みんな一回自作するやつをちゃんと作った
sre-magazine.net
daisuky.hateblo.jp
www.gqjapan.jp
www.afpbb.com
ganpeki2024.hatenablog.com
s-max.jp