GitHub - 11ty/webc: Single File Web ComponentsYou 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
Web アプリケーションエンジニアのためのウェブアクセシビリティの基礎
ウェブアプリケーションエンジニアを対象に、アクセシビリティの対応について解説した記事。アクセシビリティを向上させるためには、正しいHTMLの書き方が必要である。HTML要素には、アクセシビリティに関する機能が元々備わっているため、適切なHTMLを選択し使用することが大切だ。複雑なUIの場合はWAI-ARIAを使用し、ARIA Authoring Practices Guideに基づき適切に実装する必要がある。UIライブラリ選びの際には、WAI-ARIAに従った実装を行っているかが基準の1つとなる。 この記事は、ウェブアプリケーションエンジニアとして仕事をされている方を対象に書かれています。日々のウェブフロントエンドの開発の中で意識しておきたい基礎的な内容をメインに記載しています。 そのため、ここでは以下に上げるような内容については取り上げておりません。 色や形などのデザイン面での観点や J
The Cleanest Trick for Autogrowing Textareas | CSS-Tricks
Earlier this year I wrote a bit about autogrowing textareas and inputs. The idea was to make a <textarea> more like a <div> so it expands in height as much as it needs to in order to contain the current value. It’s almost weird there isn’t a simple native solution for this, isn’t it? Looking back at that article, none of my ideas were particularly good. But Stephen Shaw’s idea that I linked to tow
textlint-plugin-html v1をリリースした
textlintでHTMLファイルを扱うtextlint-plugin-html v1をリリースしました！ Release v1.0.0 · textlint/textlint-plugin-html 自分が使うプロジェクトを持ってないのでずっと放置していましたが、textlint v13.0.0のリリースに合わせて全部書き直しました。 textlint v13.0.0 - ESMで書かれたルールを扱えるように 🔥 Breaking Changes textlint v13.0.0以降が必要になりました Pure ESMで書かれたプラグインなので、ESMで書かれたプラグインを扱えるtextlint v13.0.0以降が必要になります Node.js 16.6.0以降が必要になりました TypeScriptに書き直しました 🆕 Features HTMLのパーサにrehypeを使うように
Building a tooltip component | Articles | web.dev
In this post I want to share my thoughts on how to build a color-adaptive and accessible <tool-tip> custom element. Try the demo and view the source! A tooltip is shown working across a variety of examples and color schemes If you prefer video, here's a YouTube version of this post: Overview A tooltip is a non-modal, non-blocking, non-interactive overlay containing supplemental information to user
The 2022 Web Almanac
Web Almanac HTTP Archive’s annual state of the web report Our mission is to combine the raw stats and trends of the HTTP Archive with the expertise of the web community. The Web Almanac is a comprehensive report on the state of the web, backed by real data and trusted web experts. The 2022 edition is comprised of 23 chapters spanning aspects of page content, user experience, publishing, and distri
Building the main navigation for a website | Articles | web.dev
There are many different ways of building the main navigation of a website, in terms of styling, functionality, and the underlying markup and semantic information. If the implementation is too minimalist, it works for most people, but the user experience (UX) might not be great. If it's over-engineered, it might confuse users or even hinder them from being able to access it at all. For most websit
Avoiding <img> layout shifts: aspect-ratio vs width & height attributes
By default, an <img> takes up zero space until the browser loads enough of the image to know its dimensions: When you run the demo, you'll see the <figcaption> immediately. Then, after a few seconds, this paragraph and subsequent page content shifts downwards to make room for the image. This makes the user experience massively frustrating, as content moves out from under the user's eyes/finger/poi
縦書きHTMLにおける文字の向きはどのように定まるか - ドワンゴ教育サービス開発者ブログ
ドワンゴ教育事業Webフロントエンドチームの berlysia です*1。 はじめに この記事では、日本語の縦書きHTMLにおいて、「ある1文字が縦組みのなかで違和感なく縦書きとして表示される」とはどのように成り立っているのか、意図しない表記になりやすい文字とその理由について紹介します。 最後まで読むと、縦書き時の文字の縦横に関する問題をたちどころに分解できるようになるはずです。とりあえずフォントのせいだろうかと疑う日々には、これでおさらばしましょう*2。 はじめに N予備校における日本語縦書きHTML CSS の関連仕様 日本語の一般的な縦書きに設定する うまくいかないことが起こりやすい文字たち うまくいかない文字がうまくいかない理由を理解する 縦書きを考慮した文字の周りの方向の定義 CSS における縦書きでの文字の縦横 upright typesetting sideways type
ar5iv – Articles from arXiv.org as responsive HTML5 web documents
Converted from TeX with LaTeXML. Sources upto the end of March 2026. Not a live preview service. Available as a dataset, download here. For articles with multiple revisions, only a single version is made available. When in doubt, always use the main arXiv.org article page. Goal: incremental improvement until worthy of native arXiv adoption. Sample: A Simple Proof of the Quadratic Formula (1910.067
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Argos · Visual Regression for Playwright & Storybook
Popover API - JavaScript不要、HTMLのみでポップオーバーUI
GitHub - heapwolf/socket
GitHub - orf/html-query: jq, but for HTML
Meta Front-End Developer
GitHub - vercel/satori: Enlightened library to convert HTML and CSS to SVG
Learn Accessibility | web.dev
Learn HTML | web.dev
Prince - Convert HTML to PDF with CSS
GitHub - cloudflare/html-rewriter-wasm: WebAssembly version of HTMLRewriter