タグ

関連タグで絞り込む (1)

タグの絞り込みを解除

フォームと*web制作に関するokudenのブックマーク (6)

  • 人に優しいフォームを作ろう、特に日本人に

    皆さん、フォーム作ってますか? Webサイトやアプリを作るにあたって避けられないのがForm作成、多くの方が autocomplete を設定するなど、より使いやすいフォームを作成するために尽力されていることと思います。 一方で、悪気なく書いたコードでより使いにくいフォームになってしまっている例が世の中には多く見られます(特に銀行系) 今回は、よくあるフォームの実装を例に、(特に日語話者にとって)より使いやすいフォームにするためのちょっとした仕様や私が考える対策を書いていこうと思います。 忙しい方のために最初に書いておくと、この記事に書いてあることの多くは autocomplete の仕様を意識した実装をしましょう の一言に集約されます。 多くの方にとっては「何を当たり前のことを」と思われる項目も多いかとは思いますが、当たり前のことがされていないフォームが世の中には多すぎるので、少しでも

    人に優しいフォームを作ろう、特に日本人に
  • フォームをデザインするときのポイント

    前提 自分が嫌だと思う項目を作らない。 曖昧を許容できるようにする。 なぜその項目が必要なのかを説明する、もしくは予想できるようにする。 倫理的に、そして法的に問題ないものか確認する。 HTMLの仕様とブラウザの挙動を活用する。 システムの都合が優先される場合があるが、なるべくそれに引っ張られないように工夫したい。 分割しない 姓名、郵便番号、電話番号、年月日、時分など、入力フィールドが分かれていることがあるが、なるべくこれを避ける。フォーカスの移動が、面倒だからだ。なるべくユーザーの手間を減らしたい。 フォーム送信後のデータベースの都合や、事務処理、または運用にて必要不可欠である場合を除いて、分割しないようにしよう。 年月日や時分などは <input type="date"> <input type="time"> <input type="datetime-local"> のように標準

    フォームをデザインするときのポイント
  • 今、お問い合わせフォーム(メールフォーム)が危ない! 不正アクセスの増加と対処方法 | さくらのナレッジ

    メールフォームへの不正アクセスが急激に増えてきています この半年~1年の間に、メールフォームを悪用した迷惑メール送信の被害が相次いでいます。これはどのような事かというと、まずメールフォームには、記入した内容を記入者にメールで自動返信する機能が備わっていることが多いです。このとき、メールフォームのメールアドレス欄には記入者自身のアドレスを入力するのが正しい操作ですが、悪意のある第三者がこれを利用し、メールアドレス欄に他人のアドレスを入力して迷惑メールを送信するという攻撃手法です。(参考記事: サイトの「問い合わせフォーム」を悪用する攻撃に警戒を) 少なければ一日に5~10件、多いケースでは一日に数千件の迷惑メールが送信される事がありますが、このような問題が起こると他人に迷惑がかかるだけではなく、サーバが持つIPアドレスの評価が下がったりブラックリストに登録されたりしてしまいます。IPアドレス

    今、お問い合わせフォーム(メールフォーム)が危ない! 不正アクセスの増加と対処方法 | さくらのナレッジ
  • Webサイトのフォームで悪用被害急増中!加害者にならないためのフォーム設置講座 | さくらのホームページ教室

    Webサイトのフォームで悪用被害急増中!加害者にならないためのフォーム設置講座 商用のWebサイトでは欠かすことのできない「お問い合わせフォーム」。顧客との重要な接点ですので設置しているWebサイトは多いはず。今、そんなお問い合わせフォームが狙われています。「え、WordPressプラグイン最新にしてればいいんじゃないの?」と思われるかもしれませんが、今回は違いますよ! 急増しているお問い合わせフォーム攻撃の手口 昨今、Webサイトのお問い合わせフォームを狙った大量メール送信攻撃が急増しています。手口は非常に古典的で、フォームから問い合わせをした際に送信される「お問い合わせありがとうございました」メールを悪用します。 お問い合わせした人のメールアドレス欄に、スパムメールを送りたいメールアドレスを入力お問い合わせ内容にフィッシングサイトや広告のリンクを入力送信ボタンをクリックお問い合わせあり

    Webサイトのフォームで悪用被害急増中!加害者にならないためのフォーム設置講座 | さくらのホームページ教室
  • Vue.jsを使用してさまざまなフォームを簡単に実装できる -Vue Formulate

    Vue.jsを使用して、Webページやスマホアプリでよく使用されるフォームを簡単に実装できるVue Formulateを紹介します。 サインアップ、ログイン、メールアドレス、ファイルのアップロード、アンケートなど、さまざまなフォームをサポートしており、バリデーション機能も備えています。 Vue Formulate Vue Formulate -GitHub Vue Formulateの特徴 Vue Formulateのデモ Vue Formulateの使い方 Vue Formulateの特徴 Vue Formulateは、Vue.jsを使用してフォームを構築する最も簡単な方法です。主な機能は、フォームとフィールドの検証、ファイルのアップロード、フォームの生成、ラベルをサポートする単一要素の入力、ヘルプテキスト、エラーメッセージ、プレースホルダーなど、さまざまなプロジェクトで使用するための包

    Vue.jsを使用してさまざまなフォームを簡単に実装できる -Vue Formulate
  • フォームをより幅広いユーザーや文化に対応させるためには

    現在のWebサイトは整然としていてモバイルフレンドリーで、さまざまな手段で来訪する方のアクセシビリティを考慮したデザインをされています。しかし、ユーザーから情報を集めるフォームの作成においては、自分たちの選択が間違っているかもしれないと立ち止まる方は少ないでしょう。 Webのフォームでは、「John」と 「Smith」というように、姓と名に分けて尋ねるものがあまりにも多いです。しかし問題になるのは、そのように二分割できない名前を持つユーザーに対して、フルネームや好きな名前を記入する欄を設けていないことです。 姓と名という慣習は、アメリカ人にとっては文化的にも個人的にも大多数の期待に沿っているかもしれません。しかしほかの国々に出身地や家族のルーツがあるユーザーも考慮に入れるなら、多様な文化に敏感になるべきです。少し視野を広げて簡単な調整をするだけで、どのような人にも対応するフォームを作ること

    フォームをより幅広いユーザーや文化に対応させるためには
  • 1