滅びてほしい認証系の実装の話
こんにちは、富士榮です。 ちょっと前に某所でダメダメな認証系の技術実装ってなんだろうねぇ、、という話をしていたことをXで呟いたところ、色々とご意見を頂けましたのでまとめて書いておきます。 考えていると結局のところ、サービス提供側が意図していることとは全然違うことが起きている気がするので、この辺はしっかり考えて実装したいところですね。（実装ミスは問題外として） カテゴリ滅びてほしいもの実装側がやりたいこと利用者が感じること実際に起きていること代替手法認証CAPTCHAbot避けぐにゃぐにゃ文字が読めない バイクと自転車の違いとは？ユーザの離脱、カゴ落ちパスキーの利用 新しいタイプのCAPTCHA（通常は画面に出ない） リスクベース認証との組み合わせによる抑制認証パスワード誰でも使える認証手段の用意忘れる。複雑なパスワードをそれぞれのサービス毎に管理するのは無理パスワードの使い回し。パスワード
第三者が個人情報15万人分ダウンロード 労務管理クラウド「WelcomeHR」で漏えい マイナカードや免許証の画像も
カオナビ子会社のワークスタイルテック（東京都港区）は3月29日、同社の労務管理クラウドサービス「WelcomeHR」について、ユーザー情報が外部から閲覧可能な状態になっていたと発表した。16万2830人分の情報が閲覧可能だったとしており、うち15万4650人分の情報が実際に第三者にダウンロードされたという。 2020年1月5日から24年3月22日にかけて、ユーザーの氏名、性別、住所、電話番号、ユーザーがアップロードした身分証明書（マイナンバーカード、運転免許証、パスポートなど）や履歴書の画像が閲覧可能だった。情報がダウンロードされたのは23年12月28日から29日にかけてだったという。3月29日時点では二次被害は確認していないとしている。 「本来 ユーザーがストレージサーバに保存するファイルの一覧は外部からアクセスできない仕様とすべきところ、当該サーバのアクセス権限の誤設定により、閲覧可能
UIの色を変えただけで大量のクレームを頂戴してしまった話｜のなと
Webプロダクト開発をしていると様々な諸事情によりUI構成を変えたり機能を増やしたり減らしたりすることが多々あると思います。そんな時に避けられない事態として「UI変更に対するお怒りがユーザーからわんさか届いてしまう」ということがあります。今回はUI上の１要素の色を変えただけで虎の尾を盛大に踏んでしまった事件の話をしようと思います。差し当たりどういうUIをどう変えたのかを明示しておきます。変える前がこちら↓↓ beforeUIほんで変わった後がこちら↓↓ afterUIご覧の通り「作業カード」と呼ばれるコンポーネントの色を「緑＆黄」から「緑塗り＆緑枠線」に変更しました。「え、それだけ？」という声が聞こえてきそうですがそうなんです。それだけなのです。しかしここはレガシードメインのtoB SaaS。toB SaaSではUIの変更がユーザー業務への影響に直結するので軽微な変更を加えるのもハードルが
Designing for Web Accessibility: Tips for Getting Started｜Haruka Kawamura
こんにちは、RAKSULでデザインインターンをしている川村です。 今回はウェブアクセシビリティに対応したプロダクトをつくるために、デザインする上で達成すべきことについてまとめてみました。 また、自分がウェブアクセシビリティを勉強する上で参考にしているサイトもご紹介します。 ウェブアクセシビリティについて知りたいけど、何から手をつけたらいいかわからない方へ、ぜひ参考になれば幸いです。 ウェブアクセシビリティって何？ウェブアクセシビリティとは何か。デジタル庁が提供している「ウェブアクセシビリティ導入ガイドブック」より引用いたします。 ウェブアクセシビリティは、利用者の障害の有無やその程度、年齢や利用環境にかかわらず、ウェブで提供されている情報やサービスを利用できること、またはその到達度を意味しています。 デジタル庁「ウェブアクセシビリティ導入ガイドブック」アクセシビリティと聞くと、身体障害や知
スラド終了 「スラッシュドットジャパン」から23年の歴史に幕
コンピュータやOSS関連のニュース・話題を扱う老舗掲示板サイト「スラド」が2024年1月末に終了する。01年のオープンから約23年の歴史に幕を閉じることになる。運営元の変更に伴い閉鎖計画が進む中、受け入れ先が決まらなかったようだ。 スラドは、23年間ほぼ変わらないシステムを維持してきた老舗サイト。他人のコメントをユーザー同士で批評し合い、特定の管理者に依存しない仕組みは、オープン当初、画期的だった。 前身は「スラッシュドットジャパン」。米VA Linux Systemsが運営していたニュースサイト「Slashdot」の日本版として2001年5月、同社の日本法人が正式にオープンした。 VA Linux Systems日本法人は07年、スラッシュドットジャパンとOSS開発サイト「SourceForge.JP」を含むOSDN部門を分離し、07年にサンブリッジ子会社のOSDNに譲渡。15年にスラッ
スラド終了のお知らせ | スラド
皆さんに長年ご愛顧いただいたスラドだが、残念ながらこの度終了する運びとなった。 アピリッツが OSDN を OSChina へ譲渡する際、スラドを分離して別の受け入れ先へ譲渡する対応をお願いしていたが、対応が進まないまま時が過ぎていたようだ。最近になって OSChina からスラドと OSDN を閉鎖する計画があると聞いた編集部が交渉したところ、分離してかまわないとの回答を得たのだが、日本側受け入れ先の都合が悪く、分離計画は頓挫してしまった。 スラドはしばらく更新を続けるが、1 月末にはサービスを停止する。データを保存したい方は早めに進めてほしい。
あらゆるサービスの解約情報が募る「解約.com」を作りました
この記事は クソアプリ Advent Calendar 2023 の15日目の記事です。 作ったもの 各サービスの解約情報がまとまっている 解約.com を作りました。 解約.com: https://kai8ku.com 機能紹介 一番上に出ていたDAZNのコンテンツを元に機能紹介です 一覧ページ 一覧ページでは解約の手順が載っている公式リンクが載っています。あと検索もできます。適当に文字を入れると色々引っかかってくれるようになっています(したいです) 詳細ページ(少し下にスクロールしてます) 詳細ページでは情報が増えます 解約方法: 可能な解約方法を載せてます。Web,モバイルアプリ,店舗,電話 などです サービスカテゴリ: どのようなサービスかを載せています。同じサービスでも解約方法を比較できるようにしたいです(WIP) AIによる要約: 公式リンクの情報や後述するユーザーレビューを
ユーザーが迷わないトグルスイッチの使い方 | ベイジのUIラボ
トグルスイッチとは状態のON/OFFを切り替えるためのUIパーツです。選択肢が明確にわかり直感的に操作できるトグルスイッチは、ユーザビリティを高めるための重要な要素です。しかしそのシンプルさゆえに、不適切な使われ方をしているケースを見かけます。トグルスイッチの機能と適切な使用方法を理解し、ポイントをおさえて設計することが大切です。 トグルスイッチの定義 トグルスイッチはウェブページやアプリケーションのコンポーネントです。同時に選択できない2つのオプションからいずれかを選択し、現在の状態を視覚的に表します。ユーザーがトグルスイッチのON/OFFを切り替えれば、ボタンの操作結果やオプションの変更設定がすぐにシステムに反映されます。 一般的に「トグルボタン」や「トグルスイッチ」と呼ばれることが多く、Material Design（※1）では「スイッチ」、Human Interface Guide
ウェブコンテンツアクセシビリティガイドライン（WCAG）は何が難しいのか、あるいは難しさに立ち向かう方法 - 水底の血
LINEヤフーにおけるこれからのアクセシビリティというスライドで「WCAGはハードルが高い」という文言を見かけました。どうしてハードルが高い、言いかえるならば難しいとされるのか、その難しさはどこから来るのかをちょっと深掘りしてみようと思います。 WCAGという言葉について、改めて見ておきましょう。WCAGはもっぱら、Web Content Accessibility Guidelines（ウェブコンテンツアクセシビリティガイドライン）というW3Cの発行する技術文書を指すわけですけども、現時点でよく参照されるのがウェブアクセシビリティ基盤委員会（WAIC）が公開している日本語訳のWCAG 2.1でしょう。ちなみに本家のW3Cは、WAICが現時点で公開しているWCAG 2.1の改訂版を今年9月に公開し、さらにバージョンの進んだWCAG 2.2を先月に発行したばかりだったりします。 WCAG 2
「BASE」有料プラン、約3倍に値上げ 急な発表にユーザー悲鳴
「BASE」の有料プランが月額5980円から1万9980円と3倍以上に値上げ。突然の大幅値上げにユーザーは悲鳴を上げており、サービス乗り換えを検討する人も。 ネットショップ作成サービス「BASE」はこのほど、中規模以上の出店者向け「グロースプラン」の月額料金を、5980円から1万9980円と3倍以上に値上げすると発表した。2024年1月16日から適用する。突然の大幅値上げにユーザーは悲鳴を上げており、サービス乗り換えを検討する人も出ている。 BASEは月額料金無料の「スタンダードプラン」（サービス利用料3％、決済手数料3.6％＋40円）と、月額料金を課す代わりに決済手数料が下がる「グロースプラン」（決済手数料2.9％）がある。 スタンダードプランは月額無料を維持し、手数料も変えない。グロースプランのみ大幅値上げ。年払いの場合も5万9760円（月割りで4980円）から19万8960円（同1万
第3回 APCAを活用して文字の視認性を確保したデザインを実践する | gihyo.jp
しかし、実際のデザインではこの表にないフォントサイズやウェイトを使いたい場合もあるでしょう。その場合には、シミュレータやルックアップテーブルを参照することで、より精度の高い確認が可能になります。 ルックアップテーブルでフォントサイズとウェイトから必要なコントラストを確認する シミュレーションの説明の前に、より細かい基準がどのように定められているか見るために、APCAのルックアップテーブルを見てみましょう。 このルックアップテーブルは、WCAG3のシルバーレベルを満たすための基準を示しています。ブロンズレベルに追加して、この基準に準拠することでより精度の高いコントラストの確保が可能になります。 以下は、公式のシミュレーションサイトAPCA Contrast Calculatorにあるルックアップテーブルのスナップショットです。ページの下部、APCA Font Table: Silver Le
APCAコントラスト日本語フォント検証 - Qiita
先日APCA何もわからないという記事を書きました。 WCAG 3.0において、コントラスト比に関する新しい基準として提唱されているアルゴリズムについて、欧文フォントを基準にフォントサイズとウェイトの基準値が定められているので、日本語のフォントでどうなるのだろう？という問題提起の雑文でした（そうだったのか）。 まぁ、まだAPCAは開発中でもあり、WCAG 3.0が正式にリリースされるまでも結構かかりそうなので焦ることはない気はしますが、気になったものはしょうがないので、日本語フォントでシミュレーションできるツールを作成してみました。 APCAコントラスト日本語フォント検証 https://apca-ja.studio-ito.net/ 使いかた まずテキストカラーとバックグラウンドカラーを設定します。 すると、初期設定されているフォント（Noto Sans JP）とフォントサイズ（18px）
第2回 WCAG3のコントラスト基準APCAの考え方と実例 | gihyo.jp
デジタルコンテンツにおけるアクセシビリティ、特にコントラストの基準について解説する連載の第2回目です。前回の記事では、現在のWCAG2のコントラスト基準と課題について解説しました。今回はWCAG3で採用が検討されている新しいコントラスト基準、APCAについて解説します。 APCAとは WCAG 2.0でコントラストの基準が策定されて以降、ディスプレイやWebコンテンツ、CSSの機能、および視覚科学の進歩など様々な状況が変化しました。WCAGの基準についても、コントラストや視認性についてより知覚を正しくモデル化するガイドラインが求められるようになりました。 APCA（Advanced Perceptual Contrast Algorithm）はWCAG3にて現行のコントラストに代わる基準として開発・検討されている、新しいコントラスト基準です。前回紹介したようなWCAG2の基準の課題に応える
APCA Contrast Calculator
Click on a color patch next to "Text" or "Background" above to use the HTML5 color-picker (modern browsers). Otherwise enter color values in the text-box as a three or six digit hex value, the '#' is not necessary. Other valid entries are integer rgb(r,g,b) or an HTML color name (see bottom of page for list). PROBLEMS? Try a "Forced Reload" on your browser, and/or clear the cache. This is the APCA
The Myths of Color Contrast Accessibility
There’s a growing demand for designers to make their interfaces accessible to all users. It’s important to accommodate users with disabilities, but there are many myths to color contrast accessibility being perpetuated by misinformed people. They often parrot these myths to discredit a design, without understanding in which situations a color contrast standard applies. Not only that, but they assu
第1回 デジタルコンテンツの視認性とWCAG2のコントラスト比の課題 | gihyo.jp
はじめに サイオステクノロジーの伊藤と申します。今回から数回にわたりデジタルコンテンツのコントラストというテーマで、WCAG2のコントラスト基準とWCAG3で検討が進められている新しい基準APCAについて解説していきます。 対象読者としては、ウェブサイトやアプリケーションなどデジタルコンテンツの制作に携わるデザイナーやエンジニア、アクセシビリティに関心のある方を想定しています。 現在勧告されているWCAG2の達成基準では、テキストや視覚要素のコントラストが一定の基準を満たす必要があります。たとえば、レベルAAでは文字色と背景色のコントラスト比が4.5:1以上であることが要求されます。 図1 テキストとの視認性を確保するために、背景色とのコントラスト比を考える必要がある しかし、人間の目は明るい色と暗い色のコントラストを認識する際に、明るい色の相対輝度が高いほど視認性が高くなるという特性があ
WCAG 2.2の勧告とWCAG 2.1の更新 | アクセシビリティBlog | ミツエーリンクス
W3Cからアナウンスされたように、WCAG 2.2が2023年10月5日付けで勧告（Recommendation）となりました。 WCAG 2.1の最初の勧告が2018年ですから、そこから5年が経って達成基準（Success Criterion）が追加されたことになります。 WCAG 2.1の勧告について「最初の」とわざわざ言っているのは、WCAG 2.1が先月に更新されたことによります（W3Cのアナウンス）。 WCAG 2.1の更新の内容はもっぱらエラッタの適用ですが（WCAG 2.1のChange Logも参照）、その中でも達成基準4.1.1について注記が追加されたのが目立った変更点と言えます。 この追記は、端的にはWCAG 2.2では達成基準 4.1.1が削除されているように、達成基準 4.1.1についての評価は別の達成基準で行うようにするという内容です。 さて、WCAG 2.2の話
｢TweetDeck｣がついにTwitter Blueへの加入が必須に − 新デザインも正式提供開始 | 気になる、記になる…
Twitterが、公式クライアントサービス「TweetDeck」の新バージョンの提供を正式に開始しました。 「TweetDeck」の新バージョンは以前よりプレビュー提供されていたので、既に使用しているユーザーも多いと思いますが、カラムの設定を「デッキ」として複数保存でき、デッキを切り替えることで様々なカラム設定を利用することが可能なのが特徴となっています。 昨日に「TweetDeck」の旧バージョンでツイートが読み込めなくなったことが報告されましたが、これはツイート閲覧数の制限が原因ではなく、Twitterがデータスクレイピング（データ収集）を防ぐためにレガシーAPIを削除したことが原因で、この問題は新バージョンに切り替えることで解決し、全てのユーザーが今週中に新バージョンに強制的に切り替えられるそうです。 ただ、新バージョンの正式提供開始と同時に「TweetDeck」の利用には有料サービ
イラストレーション・アイコン素材｜デジタル庁
素材集の活用で、行政手続きをもっとわかりやすく専門的でわかりにくい行政手続きの改善へマイナンバーに関連するデジタル手続は専門用語が多く、イラストレーションやアイコンなどを活用して、ひと目でわかりやすく伝える必要があります。しかし、これまでは政府として公式に配布する専用の素材がありませんでした。 そのため、地方自治体や民間サービスの方々が独自に作成する必要があり、表現が伝え手によってバラバラになる課題を抱えていました。 コストを抑えて、わかりやすい表現が可能にイラストレーションやアイコン素材の作成には、専門的な知識と多くの時間が必要です。視認性が高く保たれているか？ 日本に暮らす人、訪れる人が理解しやすい表現になっているか？ など、さまざまな検討事項があります。どなたでもご利用できる素材を配布することで、別々の機関が同じものを制作したり、検討する時間を省くことができます。 また同時に、素材制
Webサイトを使いやすくするユーザビリティ11の施策 | BUILD Journal
Webサイトを使いやすくするユーザビリティ11の施策Update2023.10.22Release2023.06.08Design UI HatenaにシェアするTwitterにツイートするPocketにストックするFeedlyに登録する Webサイトを使いやすくする、私なりのユーザビリティ11の施策について紹介します。 本記事で紹介するのは一般的なユーザビリティの内容ですが、検討すべきタイミングがかならずくるはずです。制作前にチェックしておくことをおすすめします。 ユーザーが使いやすくなるユーザビリティ11の施策複雑なナビゲーションで迷わせないページ数が多い、3階層以上などのある程度大きな規模のサイトは、グローバルナビゲーションだけで誘導することが難しいです。 一昔前は、グローバルナビゲーションにドロップダウンメニューを設置しているサイトを見かけましたが、階層が深い、大きな規模のサイトに
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
