トップへ

更新日時:

Webに関する技術

Web技術の基本であるHTML、CSS、JavaScriptとサーバとプロトコルについての概要

HTTP、HTTPS/TCP/IPとサーバとUser Agent

Webサイト製作の流れと解説

Web技術の基本であるHTML、CSS、JavaScriptの総合的な学習を行うためのページ

JavaScript jQueryで数学と物理jQueryをライブラリとしてSVGの要素にアクセスし数学と物理の応用を行うJavaScriptを練習するためのファイルです。

HTML

HTMLとは

HTMLの種類

現在、HTML5 の仕様は、WHATWG と W3C という2つのグループで策定が行われています。

WHATWGW3C で公開している HTML5 の仕様書は、以下の場所から入手可能です:

HTML5と関連仕様を日本語で読む – 読み解くHTML5 http://html.yomitoku.net/

HTML5が、これまで利用されてきたHTML4とどのような違いがあるのかを、分かりやすく解説したものです。HTML5では、どんな要素・属性がなぜ追加・変更・削除されたかが、一通り説明されています。

HTML5では、要素からプレゼンテーション的な意味を取り除き、さらに、HTML4では定義されていなかった語義を新規の要素として追加しています。プレゼンテーションはCSSに任せ、HTML要素に明確なセマンティクスを与えることで、タグスープを避けようとう考え方がはっきりと表れています。

なお、HTML5そのものがまだ策定中でどんどん変更・改良が行われていますので、このドキュメントも時とともに情報が古くなり、最新のHTML5を正確に表さなくなってしまう点にご注意ください。

W3C - 『HTML 5 differences from HTML 4』日本語訳 - HTML5.JP

テキスト

a要素はリンクをつける場合に使います。また、href属性が無い場合はリンクになりません。q要素、cite要素は引用文と引用元を表します。徹底解説 HTML5 マークアップガイドでは、cite要素は、引用元のタイトルや作品名を表します、とあります。dfn

aem要素は文章の中で特定の部分強調する場合に使い、strong要素は強い重要性、意味を持っている場合に使います。HTML4では特に違いがありませんでしたが、HTML5では明確にem要素とは役割が違います。

smallsubdelinstexttexttext

リスト

リストを表現する要素には基本となる

  • ol
  • ul
  • dl

の3つがあり、

ol
ul
dl
li
dt
dd
  1. 基本となるリスト要素
  2. 従属する項目要素
  3. 項目の中身

表/テーブル

要素
要素スタイル
1tablecaption,summary,thead,tbody,tfoot,tr,colgroup,col
2trth,td
3thフロージングコンテンツ
4tdフロージングコンテンツ
5theadtr
6tbodytr
7tfoottr
8caption
9colgroupcol
10col#empty
テキスト
atext
em
strongtext
citetext
qtext
dfntext
samptext
kbd
var
abbrtext
html
head
body

メディア

実写素材 ススキ 動画素材(ハイビジョン)1280×720 を無料ダウンロード111/動画素材.com

CSS

CSSとはHTMLに色や大きさなど、主に視覚的な情報を付加するための形式としてできたテキストです。

JavaScript

JavaScriptとはプログラミング言語の一種でウェブクライアントで実行されるほぼ唯一の言語として人気がある。

ES5

ES6(ES2015)以降

jQuery
Vue.js
D3.js
Underscore

HTMLとJavaScriptの組み合わせ

HTMLの入力

text:
email:
password:
date:
time:
file:
button
url:
checkbox

詳細
詳細を表示する

製作

  1. 企画
  2. 要件定義
  3. ワイヤーフレーム
  4. デザインカンプ
  5. 製作

SVG

sample

MathML

MathMLとは。