ウェブページに「数値の入力欄」を実装する際はテンキーの存在を考慮する必要あり

2024/04/27 103 users テンキー ウェブページ 挙動 数値 ウェブページ上

ウェブページ上には「クレジットカード番号」「郵便番号」「電話番号」といった数値の入力欄が存在することがありますが、実装方法によってはブラウザの挙動によって入力内容が変化してしまったり、テンキーでの入力を受けつけなくなってしまったりします。そこで、数値入力欄の実装時に気を付けるべき点をまとめてみま... 続きを読む

｢これは間違えるよ...｣日本医師会の適正体重計算サイトの仕様で体重がすごいことに→入力欄でコードを実行できることが発覚しセキュリティの議論へ発展

2024/04/08 39 users 議論 体重 セキュリティ 発展 仕様

私もこのサイトで間違えたことあります 続きを読む

郵便番号入れるなら都道府県いらんやろ…って思う入力欄に遭遇→世の中には一筋縄ではいかない住所が結構ある

2024/02/13 49 users 一筋縄 fladdict 貴之 深津 遭遇

深津 貴之 / THE GUILD @fladdict 画期的すぎるUIに遭遇した。 郵便番号いれるなら都道府県いんやろ…というか、郵便番号が縦なの新しすぎる pic.twitter.com/VUSCxXPIw3 2024-02-12 15:08:37 続きを読む

コピペで簡単！ CSSのみで、フォームの入力時にフロートする入力欄のラベルを実装するテクニック

2023/07/09 28 users CSS コピペ ラベル span テクニック

フォームの入力欄のラベルが入力時にふわりとフロートして移動するのをCSSのみで実装するテクニックを紹介します。 HTMLはinputとlabelで非常にシンプル、余計なspanなどはありません。ラベルのフロートはCSSで...記事の続きを読む 続きを読む

AIがメール書いてくれる　Gmailに返信お助け機能「Help me write」　近日公開

2023/05/10 17 users Gmail 近日公開 欠航 飛行機 テキスト

米Googleは5月10日（現地時間）、年次開発者会議「Google I/O 2023」で、Gmailの新機能「Help me write」を発表した。入力欄にテキストを入れると、AIでメール本文を自動生成する。 イベントでは、例として飛行機の欠航に伝える連絡の返信に活用する使い方を披露した。返信時に「ask for a full refund for this cancele... 続きを読む

マクドナルド、謎バーガー画像生成AIを公開　どんな食べ物もバーガーにしてイラスト化

2023/02/17 27 users バーカー マクドナルド 画像生成AI 食べ物 日本マクドナルド

日本マクドナルドが、画像生成AIを活用した特設サイト「AIバーガージェネレーター」を公開した。入力欄に好きな食べ物の名前を入力すると、オリジナルハンバーガーのイラストを生成できる。 「好きな食べ物を入力するだけで！　AIがあなただけのバーガーをつくってくれるよ」──日本マクドナルドは2月17日、画像生成AIを... 続きを読む

日本語の指示からプログラム自動生成「AI programmer」登場　C++とHTMLで試してみた

2022/10/04 13 users HTML 指示 登場 C++ 日本語

AI開発を手掛けるASReal（東京都目黒区）とHashLab（京都市）は10月4日、日本語で仕様を伝えるだけでコーディングするプログラミングAI「AI Programmer」（β版）を公開した。利用料は無料で、対応言語は14種類。 使いたいプログラミング言語を指定し、入力欄に「“Hello World”という文字列を表示する」などとプログラム... 続きを読む

文章から画像を生成するAI「DALL・E2」を使ってみた｜柞刈湯葉 Yuba Isukari｜note

2022/07/30 245 users Note 柞刈湯葉 Yuba Isukari 行列 職業 文章

文章から画像を自動生成する DALL・E2 が先日一般公開された。画像の商用利用も可能とのことなので、うまくすれば note 記事のアイキャッチ作成に使えるかもしれない。 使用は基本無料だが申請制である。かなり待ち行列が長いらしく、僕は7月6日に申請したら7月30日に通った。住所や職業や使用目的などの面倒な入力欄は... 続きを読む

「全ての住所フォームがこうなってほしい」　SIerが公開した“使いやすい入力欄”の作り方が話題　ソースコードも掲載

2022/03/01 305 users SIer 知見 ひとまとまり ソースコード 住所フォーム

SIerのオープンコレクターが公開した、使いやすい住所入力フォームを作る知見をまとめたブログ記事が話題だ。「郵便番号を入れる枠はひとまとまりに」といった機能の必要性などを説明しており、デモページやソースコードも掲載している。 「郵便番号を入れる枠はひとまとまりに」「郵便番号を基にした住所の自動入力を搭... 続きを読む

1文字ごとに区切られたExcelフォームの入力欄→Excel方眼紙かと思ったら狂気の仕様だった - Togetter

2021/03/05 18 users Togetter Excel方眼紙 狂気 Terry 仕様

TERRY @terry_u16 Excelのフォームで1文字ごとに区切られた入力欄があって、「はは～ん、これはいつものExcel方眼紙でござるな～？」と思ったらExcel方眼紙ですらなく、でかいセルの上に縦横にラインオブジェクトが置かれているだけの代物で怖くて泣いてしまった 2021-03-04 12:08:12 続きを読む

知っておくと便利！レイアウト・コンポーネントの実装で役立つ、flexプロパティの実践的な使い方を徹底解説 | コリス

2020/08/27 12 users コリス 垂直方向 実装 アイコン テキスト

Webページやスマホアプリのレイアウト・コンポーネントを実装する際に知っておくと便利なflexプロパティの基礎知識と実践的な使い方を紹介します。 スペースいっぱいにアイテムを伸縮させて配置したり、画像・アイコンとテキストを並べて配置したり、フォームの入力欄とボタン、複数カラムの垂直方向の揃えなど、実践的... 続きを読む

ぼく「嫌な予感がするから警告いっぱい出したれ」データ削除は三重確認設計に→？？「なんかデータ消えたんですけど？」 - Togetter

2020/03/13 353 users Togetter Delete Yes 予感 警告

ぼく「なんか嫌な予感がするから警告いっぱい出したれ」 『このデータを削除すると復活できませんが本当に削除しますか？YES／NO』 『あなたは削除データが復活できないことを確認しました。YES／NO』 『以下の入力欄にDELETEと入力して削除を実行』 ？？？「なんかデータ消えたんですけど？」 続きを読む

Slack の WYSIWYG を無効にしたい - Qiita

2019/11/22 70 users WYSIWYG Markdown Qiita Slack 悲鳴

Slack のテキスト入力欄に WYSIWYG エディタが実装され、Markdown のまま編集したい派は悲鳴を上げている人が多数。 苦情もたくさん来ているみたいなので、そのうち無効にできるようなオプションが付きそうですが。 Aa ボタンがあるじゃん。ちがう、そうじゃない ※ 入力欄よこにある Aa というボタンを押すと、スタイル... 続きを読む

Amazon SumerianとWebRTC(SkyWay)で簡単な全天球カメラビデオチャット(1:1)を作ってみる

2018/08/22 24 users WebRTC SkyWay ビデオチャット 球面 作成手順

Amazon SumerianでWebRTC(SkyWay)を使って簡単な全天球カメラビデオチャットを作ってみたので作成手順をメモしておく。 実行すると自分のpeer idが表示されるので相手に知らせて入力欄に入れてもらいconnectボタンを押すとビデオチャットが行える。 お互い全天球カメラをWebカメラとして接続していれば相手に球面に貼り... 続きを読む

日本語のフリーフォントを試せる「ためしがき」登場　見栄えを一覧で比較 - ITmedia NEWS

2018/07/04 27 users フリーフォント nabettu 見栄え フォント ナベさん

商用利用可能な日本語のフリーフォントを、好きな言葉や文章を入力して試せるWebサイト「ためしがき」が7月3日、公開された。55種類のフォント（3日時点）の見栄えを、一覧で比較できる。個人開発者のナベさん（＠nabettu）らが開発した。 トップ画面の入力欄に好きな言葉を入れると、フリーフォントで表示された結果を... 続きを読む

日本語のフリーフォントをまとめて試せる神サイト「ためしがき」爆誕　フォント遊びが捗りそう - ねとらぼ

2018/07/04 90 users フリーフォント nabettu なべ とらぼ 作者

さまざまな商用利用可能の日本語フリーフォントをまとめて試せるサイト「ためしがき」が7月4日にオープンしました。作者はナベ（@nabettu）さん。あなたが神か……！ 日本語のフリーフォントを試せる「ためしがき」オープン 使い方は非常に簡単。トップ画面にある入力欄に好きな言葉や文章を入力すると、フリーフォントで... 続きを読む

Twitterの新UIで使用されているような、丸みがあって可愛いシンプルタイプのアイコンセット 10＋ | NxWorld

2017/07/04 51 users アイコンセット Twitter NxWorld 丸み ご存じ

ご存じの方も多いように少し前にTwitterのデザインがリニューアルされ、大きな特徴のひとつとして入力欄・ボタン・アイコンなど全体的に丸みを帯びた印象のデザインになりました。全く同じものでなければTwitterのアイコンに比べると丸みが少なめなものもありますが、同じようなアイコンを使いたいときに利用させてもらえそうな、丸みがあって可愛いシンプルタイプのアイコンセットを集めてみました。 ※以下で紹介... 続きを読む

生年月日の入力欄のレスポンシブ対応についていろいろ考えてみた – Rriver

2017/01/31 37 users マルチデバイス レスポンシブ Rriver 要件 実装

先日、生年月日の入力欄をレスポンシブに最適化する良い方法はないか検証してみたら、想像以上に大変だったのでメモを残しておきます。 日付の入力と言えど実はいろいろな実装方法があって、マルチデバイスに対応しながら要件にあった実装をするにはどうしたらいいのか、改めてゼロベースで考えてみました。結局、最終的には振り出しに戻った感じなんですけどね（結論を先に見たい方は こちらから どうぞw）。 近い将来、レス... 続きを読む

男ｘ男の風俗店。ウリ専での遊び方について書いてみた。（下ネタ＆BL要素） - 夜と朝のあいだ

2017/01/20 16 users Twitter あいだ Ｕターン あきら 風俗店

2017 - 01 - 21 男ｘ男の風俗店。ウリ専での遊び方について書いてみた。（下ネタ＆BL要素） 自分のこと 日常 土曜日なんでね、お約束の 下ネタ でも書こうか。 苦手な人は、いつものように Uターン ね。 先日なんだけど、 Twitter で面白い診断を見かけたんだよね。 こういうやつだ。 面白そうだからやってみたぞ。 名前の入力欄にアキラと入力。 結果が・・・。 これは、かなりウケたぞ... 続きを読む

Facebookがプロフィール欄を刷新、7秒動画が設定可能に | TechCrunch Japan

2015/10/01 26 users Facebook セク 刷新 上部 オプション

もう10年ほど運営しているSNSを活性化するため、Facebookは一日に40億回視聴されるユーザープロフィールに5つの大幅な変更を行う。 プロフィールの上部に「Features Photos（注目写真）」を設定するオプションを追加 期間限定のプロフィール写真が設定可能に 基本データの公開設定の簡単に変更する機能、100文字の自己紹介の入力欄を追加 プロフィール写真を中心に配置し、写真や友人のセク... 続きを読む

国勢調査「名前入力できない」続出 （web R25） - Yahoo!ニュース

2015/09/17 149 users 国勢調査 続出 困惑 Yahoo ツイッター

5年に一度実施される国勢調査がスタート。今年は、初めて全世帯を対象にインターネット回答を実施しており、ネットでの回答期間は9月10日から20日までとなっている。ツイッター上には、実際にネットで回答したという人からの報告が続々とあがっているところだが、困惑する声も散見される。 その困惑のひとつは、「名前の入力欄」に関するものだ。ツイッターには、 「国勢調査をインターネット対応しました。名前入力欄でい... 続きを読む

WordPressのカテゴリー、タグ、カスタムタクソノミーに独自の入力欄を追加する方法 | 今村だけがよくわかるブログ

2015/07/12 29 users カスタムタクソノミー 今村 カスタムフィールド コード タグ

WordPressのカテゴリーやタグ、カスタムタクソノミーにそれぞれ独自の入力欄を追加する方法を調べていたんですが、webopixelさんの記事「WordPressのカテゴリーにカスタムフィールドを追加する」がわかりやすくて、とても参考になりました。 そこで、掲載されているコードを参考にさせて頂いて自分なりにカスタマイズして扱いやすくしました。 もし似たようなことをされたい方は、ご参考ください。 ... 続きを読む

分かりやすいWeb入力フォームのための十戒 | デザイン | POSTD

2015/06/24 587 users POSTD ユーザフレンドリー ユーザネーム 十戒 デザイン

Web入力フォームを、読みやすく、入力しやすく、ユーザフレンドリーにデザインするために注意すべきことはなんでしょう？本記事は、その問いの答えとなる十戒(+1)について、実際の適用のグラフィカルな例を示しつつ詳しく紹介していきます。1. 各々の入力欄に、常に見えて分かりやすいラベルを付けよ 記入する前の入力欄にだけ、フォームのラベルを表示するのがWebデザインの主流になっています。これはユーザネーム... 続きを読む

パスワード用途以外にinput要素のtype="password"を使うのは間違っていない | 富永日記帳

2015/05/03 41 users password F.Ko-Ji セキュリティコード 挙動

パスワード用途以外にinput要素のtype="password"を使うのはどうやら間違っている - F.Ko-Jiの「一秒後は未来」(blog.fkoji.com)に対する返信記事です。当該記事では Chrome の挙動をもとにセキュリティコードの入力欄に type="password" を使うというのが意味的にも間違っていると Chrome は言いたいのだなと解釈しました。と締めていますが、 ... 続きを読む

[CSS]フォームを入力する際、気持ちいいアニメーションで入力欄をちょっとだけ目立たせるスタイルシートのテクニック | コリス

2014/07/22 94 users コリス some active CSS フォーカス

ユーザーがフォームの入力欄をフォーカス・アクティブした際、アニメーションを加えて入力欄をちょっとだけ目立たせるスタイルシートを紹介します。 アニメーションでおっと思わせるだけでなく、入力欄が複数並んでいる時にアニメーションで目立たせるとフォーカスを失わずに入力できる効果もありますね。 実際の動作は下記ページで楽しめます。 上記以外にもたくさんのアニメーションがあります。 Some :active ... 続きを読む