フォーム要素やチェックボックスの状態変更を検知するchangeイベントはJavaScriptで動的な処理を実現するための基本機能です。しかし、使い方を誤ると意図しない結果を引き起こすことがあります。本記事では、changeイベントの正しい使い方を具体例とともに解説し、発生しがちな問題を防ぐためのヒントを紹介します。 c...
ウェブデザイン技能検定の記事一覧
データベース設計において効率的で一貫性のあるデータ管理を実現するためには「正規化」が欠かせません。本記事では非正規形から始まり第3正規形（3NF）までの正規化のプロセスを順を追って解説しその役割や利点を詳しく説明します。 非正規形（UNF: Unnormalized Form）とは？ 非正規形（UNF）は、まだ正規化さ...
HTMLのリストはul（順不同リスト）やol（順序付きリスト）の中にli（リストアイテム）を配置するのが基本ですが、それ以外の要素でもliを直接の子要素として使用できる場合があります。本記事ではHTML5仕様に基づきliを子要素として許可される要素について解説します。 li要素とは？ li要素は、リストの各アイテムを表...
ウェブアクセシビリティはすべてのユーザーが快適にウェブコンテンツを利用できるようにするための重要な概念です。特に「キーボードトラップなし」という達成基準はキーボードでウェブを操作するユーザーにとって不可欠です。本記事では、キーボードトラップの具体例とその解消方法について解説します。 キーボードトラップとは？ キーボード...
画像圧縮は、ウェブデザインやメディア管理において不可欠な技術です。その中でよく用いられる「ディザ法（Dithering）」は特に色数を減らした画像でも視覚的な品質を保つための重要な手法です。本記事ではディザ法の仕組みとその役割について詳しく解説します。 ディザ法（Dithering）とは？ ディザ法は、表示可能な色を組...
CSSのbackgroundプロパティは背景を設定する際に不可欠なプロパティです。しかし、誤った指定をすると意図したデザインが反映されなかったり予期しない結果になることがあります。本記事ではbackgroundプロパティ全般について解説し特に間違いやすいbackground-positionの正しい指定方法を詳しく説明...
HTML文書の先頭には必ずDOCTYPE宣言が必要です。この宣言はブラウザに対して、文書の種類とレンダリングモードを示す重要な役割を担っています。本記事では、HTML5のDOCTYPE宣言について、その役割や仕組みを詳しく解説します。 DOCTYPE宣言とは？ DOCTYPE（Document Type Declara...
コメントアウトはコードの説明やデバッグに役立つ重要な機能です。本記事では、HTML、CSS、JavaScript、PHPなど、Web開発に関係する多種多様な言語のコメントアウト方法をまとめました。 HTMLのコメントアウト HTMLでは、<!-- -->を使用します。クライアントに送信されても表示されず、ブ...
JSP（JavaServer Pages）は動的なウェブコンテンツを生成するためにJavaをベースとした技術です。サーバーサイドで動作しユーザーのリクエストに応じてHTMLやその他の形式の応答を生成します。本記事ではJSPの仕組みや特徴用途について詳しく解説します。 JSPとは？ JavaServer Pages（JS...
HTMLの要素を操作する際JavaScriptのNodeListオブジェクトを扱う場面は頻繁にあります。本記事ではNodeListから各要素のテキストを抽出する方法について解説し正しい記述例とよくある間違いを取り上げます。 NodeListとは？ NodeListは、document.querySelectorAll(...
インターネット通信の基盤技術であるTCP/IPはウェブ開発者やネットワーク技術者にとって不可欠な知識です。このプロトコルはデータを送受信する際の信頼性と効率性を支える重要な仕組みを提供しています。本記事ではTCP（Transmission Control Protocol）とIP（Internet Protocol）の...
2022年4月施行の個人情報保護法改正の背景 日本の個人情報保護法はデジタル化とグローバル化の進展に伴い個人情報の取り扱いに対する法規制の必要性が増しています。 2022年4月に施行された「個人情報の保護に関する法律等の一部を改正する法律」では、個人情報の保護を強化するための新しい要件が追加されました。 新たに追加され...
メディアクエリはCSSでレスポンシブデザインを実現するための強力なツールです。 特定の条件に基づいてスタイルを適用することで、さまざまなデバイスや画面サイズに対応したデザインを作成できます。 現在のウェブデザインにおいては必須といっても過言ではない内容になりますので、知っている方も是非この機会に見直していただけたらと思...
JavaScriptでは、ユーザーの操作に応じてイベントを処理することができます。内容的にはWEBのジャンルのような気もしますが、ウェブデザイン技能検定の過去問に出てきた内容になりますので、STUDYのジャンルで記事を紹介したいと思います。 今回は、クリックイベントのハンドラ関数を使用して、マウスポインタの水平座標値と...
HTML5になってから随分とたちますが、改めてa要素がどのように変化したのかと現在ではどのように使用できるかを紹介していきたいと思います。 HTML4以前の仕様 HTML4およびそれ以前の仕様では、a要素はインライン要素として扱われ、他のインライン要素やテキストのみを子要素として持つことができました。ブロックレベル要素...
