概要 Web ブラウザではすっかりお馴染みの Google Chrome ですが、開発者ツール（DevTools）だけでなく、拡張機能にも導入すると非常に便利なものがたくさんあります。 その中でも、Web系の開発をするエンジニアなら、是非入れておきたいオススメの Google Chrome 拡張機能について紹介します。 尚、いずれも無料で利用可能です。 IT エンジニア界隈では、既にどれも有名なものばかりですが、これから Web 系の開発をする方は是非お試しください。 本当はもっとたくさんオススメしたい拡張機能がありますが、ひとまず今回は３つ紹介します。 Wappalyzer（ワッパライザー） 「Wappalyzer（ワッパライザー）」は、現在表示している Web ページで使われている技術（言語、フレームワーク、プラットフォーム、分析ツール、その他のサービス）を一覧表示してくれる拡張機能で
2024年のブラウザならCSSの:has()疑似クラスが使えます。この:has()疑似クラスは非常に強力なポテンシャルをもっています。というのも:has()疑似クラスを使えば、どんな関係のセレクターも指定可能になります。これを使えば多彩なセレクターが記述できるようになり、より表現力豊かなCSSを実現できます。この記事では:has()疑似クラスを使ったCSSの表現手法やテクニックを紹介します。 サンプルを別ウインドウで開く コードを確認する :has()疑似クラスの基本的な使い方 :has()疑似クラスの使い方について簡単に説明します。:has()疑似クラスは渡したセレクターを持つ親要素を選択します。たとえば、次のようなHTMLとCSSがあるとします。 <p class="text"> <strong>メロス</strong>は激怒した。必ず、かの邪智暴虐の王を除かなければならぬと決意した。
1. はじめに こんにちは、「信頼性は可用性ではない」を標語にしているnwiizoです。 近年、サービスの信頼性向上に向けた取り組みとして、SLI（Service Level Indicator）、SLO（Service Level Objective）、エラーバジェットという概念が注目を集めています。これらは、Google発祥のSRE（Site Reliability Engineering）プラクティスの中核をなす考え方であり、多くの組織がこのアプローチを採用し始めています。また、関連するツールも成熟し始めており、実践的な導入がより容易になってきています。 本ガイドでは、SLI、SLO、エラーバジェットを導入する前に知っておくべき重要なポイントについて詳細に解説します。各概念の定義から実践的な導入ステップ、さらには組織文化の変革まで、包括的な情報を提供します。 2. SREにおける基本
はじめに：なぜ今、ユーザビリティが重要なのか？ みなさん、こんにちは。日々Figmaと格闘しながら画面設計に励むイェンです。 「使いやすい」と言われるアプリやWebサイト。実は、その裏には綿密に計算された設計があるんです。今回は、私が実際のプロジェクトで学んだ、ユーザビリティを向上させるための5つの鉄則をご紹介します。 これらの鉄則を押さえておけば、ユーザーから「使いやすい！」と絶賛されるデザインが、きっと作れるはずです。さあ、一緒に探検してみましょう！ 【1】 シンプルイズベスト：余計なものは思い切って削ろう ユーザーが迷わず操作できる画面を作るには、シンプルさが鍵となります。 ・不要な要素を削除し、本当に必要な情報だけを表示する ・情報の優先順位を明確にし、重要な要素を目立たせる 具体例： ナビゲーションメニューは5-7項目に絞り、よく使う機能をトップレベルに配置します。 Figmaで
リクルートは8月9日、新卒エンジニア向け研修資料を無料公開した。公開したのは、2024年度に実際行った研修の内容と資料の一部。エンジニアの心構えからデータベース設計、JavaScript研修、Webアクセシビリティー入門など、26種類の資料を無償公開している。 例えば、エンジニアの心構えを学べる資料「ソフトウェアエンジニアとしての姿勢と心構え」は、プログラマー向けの技術書を複数出版している、ソフトウェア開発者の和田卓人さんが作成したもの。エンジニアとしてどのように技術を学んでいけば良いのか、「技術の学び方を学ぶ」ために作成した資料だという。 同社は例年、新卒エンジニア向けの研修資料を無償公開している。23年度は24種類の資料を公開していたが、24年度は「実践データベース設計」などの資料を追加した。この資料を使った講座では、具体的なデータベースの設計方法や、実際の開発プロセスを実践に沿った形
はじめに 最近、ソフトウェアアーキテクチャを改めて勉強しようと2冊の本「ソフトウェアアーキテクチャの基礎 ―エンジニアリングに基づく体系的アプローチ」と「アーキテクトの教科書 価値を生むソフトウェアのアーキテクチャ構築」を読んだので要点と感想を備忘としてまとめます。 ソフトウェアアーキテクチャの基礎 ―エンジニアリングに基づく体系的アプローチ アーキテクトの教科書 価値を生むソフトウェアのアーキテクチャ構築 概要とポイント ソフトウェアアーキテクチャの基礎 ―エンジニアリングに基づく体系的アプローチ アーキテクチャには正解も間違いもない。ただトレードオフがあるだけだ。 この本はアーキテクチャを考えるための思考から、代表的なアーキテクチャスタイルの紹介やアーキテクトとしてのソフトスキル（対人スキルやチーム運営、キャリアパス等）まで網羅的にまとめられているものとなります。 アーキテクチャの技術
2024年度リクルート エンジニアコース新人研修の講義資料です
Webのアクセシビリティの確認としてスクリーンリーダーを使った動作確認もしてもらうと 「リンクとかボタンしか読まれず、見出しや説明文がスキップされてしまいました」 という報告をされることが時々あります。 これは大抵、スクリーンリーダーを起動して、Tabキーだけを繰り返し押してしまっていることによって起こります。スクリーンリーダーの操作方法を伝えると、読み飛ばしたと思っていたところもちゃんと読みあげてくれたということがほとんです。 アクセシビリティをかなり意識したページであっても、Tabキーだけでスクリーンリーダーを操作しているかぎり、ページの隅々まで読めることはほとんどありません。スクリーンリーダーにはTabキーを押す以外にもいろいろな操作が存在して、それを憶える必要があるわけです。私はアクセシビリティチェックのやり方を説明するときには、必ずその操作方法のうち最低限のものを紹介しているつも
こんにちは、JADEブログ編集部です。 ある日、こんな投稿を拝見しました。 聞こえると震えてしまうSEOに関わる10の死語【2024】 ってコンテンツをJADEはんに書いてもらいたい。 — 寺倉タイシ｜THE MOLTS (@taishi_molts) 2024年7月19日 JADEはんに書いてもらいたい、と言われたら書かないわけにはいきません。て言うか書きたい。 社内チャットで「SEOの死語募集。集まれば記事化します。」と依頼したところ、瞬時に集まりました。どこか鼻の奥がツーンとなるワードから、記事化できそうにない香ばしいワードまでその数30強。定員オーバー。 世界は常に変化し、かつては絶対的だと信じられていた手法や概念でも、懐かしい思い出となるものもあります。インターネットを良くするために、知識は正しい方向にアップデートしていかねばなりません。 歴代のSEO戦士たちの苦労と工夫、そして
box-shadow で実装されたフォーカスリングはハイコントラストモードで表示されない 2024.08.11 フォーカスリングとは、キーボード操作でフォーカスが当たった要素を視覚的に示すための UI デザインのことです。フォーカスリングのカスタマイズに `box-shadow` プロパティを使うことがありますが、ハイコントラストモードではフォーカスリングが表示されない問題があります。この記事では、ハイコントラストモードでフォーカスリングを表示する方法について解説します。 フォーカスリングとは、キーボード操作でフォーカスが当たった要素を視覚的に示すための UI デザインのことです。フォーカスリングはキーボード操作をしているユーザーにとって現在のフォーカス位置を把握するための重要な要素です。このことは WCAG 2.2 の 2.4.7 項目で要求されています。 (レベル AA) キーボード操
Next.js App Router / React Server Components(RSC)を紐解いてみた - estie inside blog
デザインエンジニアの表(@HirokiOmote)です。 Next.jsでApp Routerがリリースされて、1年が過ぎました。 弊社では、@hiroppyさんを技術顧問に迎え、Frontendを中心とした長期的な技術選定にご協力いただきました。 本日は、そこで得た学びをご紹介したいと思います。 App Routerについて 2023年5月にNext.js 13.4がstableとしてリリースされ、App Routerが登場しました。 ツリー構造でのファイル配置が基本となりました。 ディレクトリ構成とルーティング page単位・feature(機能)ごとに切り分けたディレクトリ構成が可能になったため、より直感的で再利用性の高い構造が実現しました。 // App Router . ├── dashboard │ ├── components │ │ ├── button.tsx │ │ └
はじめに 今回のDeveloper Siteリデザインの目的は英語のコーポレートサイト（https://nulab.com/ ）とのUIを合わせることでした。旧Developer Siteのヘッダーやフッターなどの共通パーツは古いデザインのままだったため刷新する必要がありました。 旧Developer Siteのトップページ Developer Siteのトップページ 使用した技術 今回使用した技術は、静的サイトジェネレータであるAstroとユーティリティファーストのCSSフレームワークであるTailwind CSSです。 旧サイトはHugoとSCSSを用いて構成されており、今回はコンテンツはそのままで見た目のみを変更する制作だったため仕様の変更は不要でした。しかし、パフォーマンスの向上を目指し、かつ新しい技術に挑戦するためAstroとTailwind CSSを採用することにしました。 A
弥助関連史料とその英訳 / English translated historical documents related to Yasuke - 打越眠主主義人民共和国
はじめに Introduction 筆者の連絡先 How to contact me 信長公記 The Chronicle of Nobunaga 池田家本『信長公記』Shinchoko-ki Ikeda-hon 尊経閣本『信長公記』Sonkeikaku-bunko manuscript 尊経閣本の信頼性に関する議論 Discussion of the reliability 天正9年のイエズス会史料 Jesuit Documents in 1581 天正9年3月11日の書簡 Letter of April 14, 1581 天正9年9月11日の書簡 Letter of October 8, 1581 家忠日記 Ietada Diary 弥助に関する最後の記録 Last record of Yasuke 天正10年10月20日の書簡 Letter of November 5, 1582 書
「Xbox Adaptive Joystick」は，Xboxのアクセシビリティへの考えが詰まったコントローラ用アクセサリ。ドイツで実機をお試し［gamescom］
「Xbox Adaptive Joystick」は，Xboxのアクセシビリティへの考えが詰まったコントローラ用アクセサリ。ドイツで実機をお試し［gamescom］ 編集部：Junpoco Microsoftが2024年8月21日（海外時間）に発表した新プロダクト「Xbox Adaptive Joystick」は，身体の動きに制約のあるゲーマーのニーズに応える形で設計されたジョイスティックだ。 本製品は，Xbox用コントローラやXbox Adaptive Controller向けに作られた有線接続のアクセサリで，扱いやすい形状や重さ，Xboxアクセサリアプリでのボタンの再マッピングなど，さまざまなプレイ環境を想定したデザインやカスタマイズ性の高さが特徴となっている。 この新製品について，ドイツで開催中のgamescom 2024のMicrosoftビジネスブースで，8月22日に行われたプレゼ
@axe-core/playwright によるアクセシビリティテストの自動化 2024.08.18 axe-core は axe というアクセシビリティテストツールのコアエンジンで、オープンソースとして提供されています。この記事では、E2E テストフレームワークの Playwright と axe-core を組み合わせて使用して、アクセシビリティテストを自動化する方法について紹介します。 今書いているコードがアクセシビリティ上の問題を持っていないかどうかを確認するために、Lint ツールによる機械チェックが有効です。eslint-plugin-jsx-a11y や Markuplint といったツールを導入することで、コンポーネント単位で静的にコードを解析してアクセシビリティの問題を検出できます。このような Lint ツールは、code を書いている最中に即座にフィードバックを受けるこ
freeeアクセシビリティー・ガイドライン Ver. 202408.0を公開しました & アクセシビリティー関連の問い合わせもしやすい体制作りを始めました - freee Developers Hub
こんにちは、freeeのアクセシビリティー・ガイドラインおじさんの中根です。 1年ほど前にこちらで書いた記事で触れた健康年齢、1年後の健康診断の結果によると10歳くらい下がって、実年齢とほぼ一致しました。こんなに値がぶれるものに一喜一憂するのは馬鹿馬鹿しいので、今後は気にせず暮らしていくことにしました。 さて、こちらに書くのは久しぶりですが、例によってfreeeアクセシビリティー・ガイドラインの更新情報です。 そして、今回はそれに加えて、freeeのプロダクトをご利用いただいている方や導入を検討してくださっている方などからの、アクセシビリティーに関連するお問い合わせをしていただきやすくなることを目指して始めた施策についても、簡単に紹介します。 最新版はVer. 202408.0 freeeアクセシビリティー・ガイドライン Ver. 202408.0リリース・ノート こちらで最後に更新情報を
Microsoft、新たなアクセシビリティコントローラー｢Xbox Adaptive ジョイスティック｣を発表 ｰ 来年初頭に発売へ | 気になる、記になる…
Microsoftが、Xbox向けの新しいアクセシビリティ製品として「Xbox Adaptive ジョイスティック」を発表しました。 「Xbox Adaptive ジョイスティック」は、長年にわたる研究とテスト、そして障碍のあるプレイヤーやアクセシビリティの専門家の協力のもと、特に動作に制約のあるプレイヤーのための、Xbox コントローラーの有線共用デバイスとして設計されました。 前面に4つのボタン入力、標準的な Xbox サムスティック、および従来のコントローラーの LB / RB とトリガーの配置を模した2つの追加ボタンを備えており、これらのボタンはすべてカスタマイズ可能で、最も快適な方法でプレイできます。 片手で操作したり、テーブルに取り付けたり、手以外の部分で使用したりすることが可能で、プレイ方法の一例が下記の通り。 Xbox Adaptive コントローラーに接続し、完全にアダプ
Note reading-flow プロパティは 2024 年 8 月現在 Editor Draft として提案されている機能です。W3C によって標準化されておらず、将来仕様が変更される可能性があります。Chrome Dev または Canary バージョン 128 以降で試すことができます。 Flex や Grid などの CSS レイアウトを使っている場合や、ドラッグアンドドロップで自由に要素を配置できる UI を実装している場合、要素の見た目上の並び順と、DOM 上の並び順が異なることがあります。このような状態はキーボード操作やスクリーンリーダーなどの支援技術を使うユーザーにとって混乱を招く可能性があります。見た目とは異なる順番で要素にフォーカスがされるためです。 例えば、Flex コンテナ内の要素は flex-direction: column-reverse; を指定すると要素
この発表はすでにアクセシビリティに興味を持っていて、ソフトウェア開発の現場にアクセシビリティを取り入れたい人を対象としています。 開発チーム全体でアクセシビリティに意識を持つ状態が理想ですが、全員が詳細な実装を行うのは実際には難しいでしょう。そこで、特に意識をせずともある程度のアクセシビリティを保…
Googleが大規模言語モデル「Gemma 2」をベースとしたパラメーターサイズがコンパクトな「Gemma 2 2B」、AIモデルの入出力をフィルタリングする「ShieldGemma」、モデル解釈ツール「Gemma Scope」を発表
Googleは2024年6月に大規模言語モデル(LLM)の「Gemma 2」を発表しました。当初発表されたGemma 2のパラメーターサイズは90億(9B)と270億(27B)の2つだったのですが、これらよりもコンパクトなパラメーターサイズでありながら優れたパフォーマンスを発揮できる「Gemma 2 2B」や、Gemma 2をベースとしたAIモデルの入出力をフィルタリングしてユーザーの安全を守ることができるという「ShieldGemma」、モデルの内部動作に関する比類ない洞察を提供することができるモデル解釈ツールの「Gemma Scope」を発表しています。 Smaller, Safer, More Transparent: Advancing Responsible AI with Gemma - Google Developers Blog https://developers.goo
皆さんこんにちは、こんばんは！ 本日も気まぐれおやじのブログにご訪問ありがとうございます おいらは今日も「日々楽しく、自由きままに！」 先月末、やっちまったぁ～！（涙） 長年愛用の愛本2号のホームボタンを、破損してしまった タッチID機能が全く使えない 即ち、表示した画面を消す事も、表示したい画面を出す事も出来ない これは困ったどうするべきか… ネットで色々調べていると、ホームボタンを画面に表示させる方法があるそうだ 設定→アクセシビリティ→タッチ→･･････ おぉ～何とか復活 やれやれと、この時はそう思っていた しかし、今にして思えば･･･あの日 何かを訴えていたのかも知れない… そうだ、あいつは確かに何かを訴えようとしていた koulog.hatenadiary.com 金の価格が上昇し、ネックレスを売ればぼろ儲けやんと浮かれていた一週間前･･･ 突然、顔を黒くして りんごマークを点
【2024年最新動向】日本発の「いけてる」デザインシステム事例10選｜Goodpatch Blog グッドパッチブログ
こんにちは！グッドパッチUIデザイナーのharuです。 この記事では、2024年時点の最新のリサーチをもとに、国内のデザインシステム10事例をグッドパッチの解説つきでご紹介します。 「良いデザインをサポートするための仕組み」であるデザインシステムは、ものづくりの現場において、作り手の共通認識となることで価値を発揮します。「どうすれば、チームに浸透し、ものづくりに一貫性やスピードを生み出すデザインシステムを構築できるのか？」このように悩んでいる開発組織は少なくありません。 こうした悩みに対してグッドパッチがお伝えするのは、「デザインシステムで最も重要なのは、組織とその目的にフィットしているか」ということです。 そこで今回の事例集では、単なる有名どころではなく、「組織や目的にフィットしているな」「こんなデザインシステムあるんだ！」と私が思った魅力的なデザインシステムを紹介します。 「デザインシ
✴︎公共図書館の利用状況の今まずはこの画像を見てほしい。 図1: 図書館の今：公共図書館の数と貸し出し登録者の推移、および都道府県別1人当たりの年間図書貸し出し冊数. 出典：産経新聞. (2024年6月22日). 図書館の今 公共図書館の数と貸し出し登録者の推移、都道府県別1人当たりの年間図書貸し出し冊数(画像) この画像は、日本図書館協会の資料に基づいており、日本の公共図書館の現状および、地域による図書館利用状況の差異を示している。 ✴︎目的近年、図書館の利用状況と地域の特性、さらには学力との関連性について、興味深い傾向が浮かび上がってきている。特に、東京都・・・や滋賀県・・・など、特定の地域で図書館利用率が突出して高いという事実は、教育や文化政策の観点から注目に値する。本レポートでは、これらの現象の背景にある要因を多角的に分析し、図書館利用と地域特性、さらには学力との関係性、図書館の展
Qlikは2024年8月7日、「Qlik Talend Cloud」の提供を始めた。企業のAI導入を促進させる統合ソリューションで、データの信頼性とアクセシビリティーを向上させ、大規模なAI価値創造を実現するとしている。 Qlik Talend Cloud は、企業がデータの整合性を維持しながらAI導入を加速できるよう支援する。AIで強化したデータパイプラインを使ってデータ品質と信頼性を確保できる。 Qlik Talend Cloudの主な特徴は次の6つだ。 データの信頼性強化：AIを活用したデータパイプラインを展開できるよう、データ統合と品質機能の統合パッケージを提供し、AI導入に伴うリスクを低減させる 接続性の拡張：AIでコネクターを強化し、400超のSaaSデータソースと接続可能に 価値創造の迅速化：Qlikの分析機能と統合することで、構造化・非構造化データをエンドツーエンドでビジネ
Chrome 128で追加された、CSSの新しい機能4つを紹介します。 今回のアップデートでは、ruby要素によるルビのレイアウト強化、ドロップダウン内のoptionの最小サイズ、zoomプロパティのスタンダード化など、Web制作者は要チェックです！ New in Chrome 128 Chrome 128 beta 下記は各ポイントを意訳したものです。 ※元サイト様のライセンスに基づいて翻訳しています。基づいてというのは、貢献部分に関して同ライセンスも含みます。 はじめに CSSのruby-alignプロパティ ルビが改行可能に <select>ドロップダウン内の<option>の最小サイズ CSSのzoomプロパティのスタンダード化 はじめに 8/21にリリースされたChrome 128で4つのCSSの新しい機能が追加されました。対象となるChrome 128は、Android、Chr
実は画期的で好評だった？ 『ミシシッピー殺人事件』再評価論：後編 - アライコウのノベルゲーム研究所
前編では『ミシシッピー殺人事件』（原題：Murder on the Mississippi）の各機種の比較をし、オリジナル版が移植版より比較的優れており、システム的にも凝った作りであることを見てきた。 この後半では、『Murder～』が発売されるまでのアドベンチャーゲームシーンの流れ、当時の記事での批評家たちの評価を見ていき、そしてなぜ日本では受け入れられなかったのかを論考していく。 アドベンチャーゲームの形式 当時の記事を振り返る 当時のユーザーの声は？ ファミコンユーザー層には合わなかった その後、良作アドベンチャーゲームがいくつも生まれた 結論 アドベンチャーゲームの形式 1975～1976年頃にウィリアム・クラウザーが開発し、ドン・ウッズが改良を加えた『Adventure』*1は、アドベンチャーゲームというジャンル名の由来ともなったゲームだ。「GET LAMP」といったコマンド入力
Appleは、アクセシビリティ機能を活用し、障がいの有無を問わずアスリートたちが競い合う様子を描いた動画「The Relay」を公開しました。8月28日からのパリパラリンピックを前に、障がいを持つアスリートが、障がいのない選手と同じ条件で練習し、戦う様子が印象的です。 障がいの有無でチーム分けしたアスリートたちが競う 「The Relay」では、障がいの有無をミックスした2チームに分かれた8名のアスリートたちが、4種目で競い合う様子を描きながら、障がいがあるユーザーにも使いやすいアクセシビリティ機能が紹介されています。 動画の中でアスリートたちが、障がいがあっても競技への情熱は同じであり、同じように練習して試合に臨んでいると語っています。練習や日常生活で、iPhoneやApple Watchのアクセシビリティ機能が有効活用されています。 拡大鏡のPoint and Speakは、iPhon
2024年8月15日 更新 ウェブアクセシビリティ基盤委員会（WAIC） 作業部会1 副査 有限会社時代工房 柴田 宣史 これはウェブアクセシビリティ基盤委員会のコラム第10回です。今回はウェブアクセシビリティに関してよく誤解されることについて、例を集めてみました。 1. ウェブアクセシビリティは障害者や高齢者のためだけのものである ウェブアクセシビリティは障害者や高齢者のためだけのものではありません。対象には、さまざまな能力や環境の制約を持つ人々も含まれています。それには、一時的な怪我や、使っている端末の不具合等も含まれます。ウェブアクセシビリティの対象は、ウェブサイトにアクセスするすべての人々です。 2. ウェブアクセシビリティを確保するとビジュアルデザイン（見た目）が犠牲になる たしかに、ウェブアクセシビリティの求める要件の中には、ビジュアルデザインに関する項目も存在します。それらの
こんにちは、iOSアプリエンジニアの茂呂（@slightair）です。 この記事はLUUP iOSアプリ開発環境の現状確認と題して、我々の開発環境の状況を紹介するものです。1年半くらい前にも自分がiOSアプリ開発環境に関する記事を書きましたが[1]、それからのアップデートになります。 LUUPのサービスを成長させながら、同時に開発環境をどのように前進させているのか紹介させてください。 開発体制について 現在、LUUPのiOSアプリ開発に関わっているiOSアプリエンジニアは、正社員3名と業務委託2名になっています。フルタイムでアプリ開発にコミットしているのは正社員の3名であり、業務委託2名は副業という形で本業の合間に関わっていただいています。 また詳細は省きますが、アプリ開発に関わるエンジニアには、WebAPIの開発を担当するサーバサイドエンジニアなどもいます。前回報告した時期に比べ、サーバ
はじめに 就職や転職を考えているWebエンジニアのみなさん、どんなことを勉強していますか。プログラミング言語を勉強した後の悩みといえば、どのフレームワークを使用すれば良いかではないでしょうか。フレームワークの選択はキャリアに影響する大切なポイントです。そこで今回は、フロントエンドとバックエンド開発などで需要が高いフレームワークを4つピックアップしました。それぞれのフレームワークの特徴などを解説していきます。あなたのスキルアップの参考にしてみてください。 フロントエンドで人気なフレームワーク 1. React ReactはFacebookが開発したJavaScriptのライブラリで、ウェブのフロントエンド開発で広く使われています。動的なWebアプリケーションを手軽に作ることができるため、特に人気のあるフレームワークの一つです。Reactは他のライブラリやフレームワークに比べて学習が難しいとさ
Moi! ヌーラボに入社してから3年目のUXエンジニアのヨーナスです。久しぶりのブログ投稿ですごく緊張しています。 今回は、アクセシビリティに特化することを決める前に色覚特性について知りたかったことを書こうと思います。このブログは、ヌーラバー真夏のブログリレー2024の8日目のブログとして更新しています。 まずは言っておきたいのは、私は色覚特性（色弱、色覚異常と呼ばれることもありますが、このブログでは色覚特性と表記します）を持っていないため、この投稿に書いてあることは間接的に得た情報に基づいています。色のアクセシビリティの判断は、できるだけ当事者に相談しましょう。 最初は、色覚特性について解説しようと思います。そのあと、ありがちな誤解をいくつか紹介します。最後に、基本的な対応方法を紹介します。 目に見えない障害としての色覚特性 さまざまな障害について考えるときによく頭に浮かぶのは、車椅子や
ユーザーインターフェース（UI）とは、製品とユーザーとを繋ぐ架け橋になる部分です。 優れたUIをデザインするということは、製品やサービスの魅力を高めることに直結します。その印象や使い勝手を良くするのはもちろんのこと、副次的には製品や会社のブランドイメージを向上させたり、競合製品との差別化を図るなど、中長期目線では製品の使い勝手のみに限定しない、より大きな効果をも期待することができるでしょう。 近頃流行りの魅力的な製品には、大抵優れたUIが備わっています。もしもコンシューマーの「当たり前品質」というものがそのような水準にまで上がっているのだとしたら、当然のごとく、市場の優れた製品と肩を並べても遜色無いような高品質のUIが求められますから、その実現のためにも確かなUIデザインが欠かせません。 「優れたUIとはどういうものなのか？」「UIデザインとは何なのか？」「UIとUXの違いとは？」「UIデ
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Web系エンジニア最低限入れておくべき Chrome 拡張機能３選 - Qiita
has()疑似クラスでコーディングが変わる！ CSS最新スタイリング - ICS MEDIA
SLI、SLO、エラーバジェット導入の前に知っておきたいこと | sreake.com | 株式会社スリーシェイク
5つの基本原則で実現する、ユーザビリティの高い画面設計 - Qiita
リクルート、新卒エンジニア向け研修資料を無料公開 「実践データベース設計」など全26種類
「ソフトウェアアーキテクチャの基礎」と「アーキテクトの教科書」の備忘と感想
Webアクセシビリティ入門_2024
スクリーンリーダーの操作にはTab以外のキーも必要です - Qiita
聞こえると震えてしまうSEOに関わる10の死語【2024】 - ブログ - 株式会社JADE
box-shadow で実装されたフォーカスリングはハイコントラストモードで表示されない
AstroとTailwind CSSを使ってDeveloper Siteをリデザインした話 | 株式会社ヌーラボ(Nulab inc.)
@axe-core/playwright によるアクセシビリティテストの自動化
CSS の `reading-flow` プロパティで要素の読み上げ順を制御する
チームで開発する際にアクセシビリティを保つ施策
ある日の朝･･･愛本2号は死んだ - 日々楽しく、自由きままに！
図書館利用と地域特性：東京都と地方の比較分析｜藍沢迷@読書と創作
AIの大規模導入を支援、「Qlik Talend Cloud」登場 6つの特徴を解説
Chrome 128で新しく追加された4つのCSSの機能、ルビのレイアウト強化、optionの推奨最小サイズなど
Apple、障がいの有無を超え戦うアスリートを称える動画「The Relay」公開 - iPhone Mania
ウェブアクセシビリティでよく誤解されること
LUUP iOSアプリ開発環境の現状確認 2024年8月
駆け出しWebエンジニアへ勧める〜人気フレームワーク4選〜 - Qiita
色覚特性について学んだことをざっくりとまとめてみた #ヌーラボ真夏のブログリレー2024 | 株式会社ヌーラボ(Nulab inc.)
Windows版「Word」にアクセシビリティの複数の問題をまとめて修正する機能が追加／画像の代替テキストもまとめて自動生成可能に
UIデザインとは？ 大切な5つのポイントや取り組み事例を紹介｜Goodpatch Blog グッドパッチブログ