Top > Place > Next

製作前に

■ お急ぎで無ければ、読んでください。

◆ はじめに

必要と思われるタグをコピー&ペースト(貼り付け)出来るように、下のようなテキストボックスを用意しました。

←コピー(C)&貼り付け(P)に、ご利用ください。

基本的なホームページ作りには、高価なソフトは必要ではありません。 Windowsなら「メモ帳やワードパット」、Macintoshなら「SimpleText」のOSに組み込まれているテキストエディターがあれば、ホームページ作りは可能です。(ただし、ソフト費用の代わりに勉強が必要になります。)

最初に少しばかりのやる気・根気・負けん気を出していただければ、HTMLの入門自体は、それほど難しいものではないのです。(中・高学生の単語ぐらいです、後は失敗こそ成功の一歩!!)。

ここで憶えたHTMLの知識は、便利なホームページ作成ソフトを使う上でも、より上手に使いこなせます。(ホームページ作成ソフトでも、解釈の間違いは、犯している。)

最後までこの HTML 入門を理解すれば、サイトのWeb-master.(管理人)になっているはずです!

 本サイトは、ホームページ作りを……
  • メモ帳で出来るのに……、これ以上お金をかけたくない方!
  • フリーウェアのソフトでホームページを作りたい方!
  • 高価なソフトを使う前に、基本を身に付けたい方!
  • HTMLの初歩を勉強したい、 aspiration. or skill-UP.したい方!
  • コミュニティ系の簡単ホームページを卒業したい方!
上記の様な方々に向けて、HTMLを簡単に、わかりやすく解説することを目的としています。
そのため、細かい解説、利用頻度の低い部分の解説は、割愛・省略することがあります。
もし、詳しくお知りになりたい方は、リンク集に関連の場所があります。

ページの文章(レイアウト)

あなたは、「ホームページを立ち上げよう」と考え 「今」 行動しようとしてるわけです、そのときに「皆さんに、見てもらえるホームページを…」と考えたはずです。

【これから】のコトを踏まえ、W3C の HTML4.01 (Transitional & Framesetを含む)CSS 、のタグを基本に説明しました。XHTMLを意識した説明もいしました。 CSS は、簡単に説明すると、W3C から Deprecated =非推奨、不適切、廃止予定に伴い推奨され、HTML文書の構造外のデザイン的な見栄えを中心に設定する規格です。

一つのテーマで、見出し・段落・文章・背景を同じ見栄えに統一するほうが、見やすいのは当然です。同じテーマに、アンバランスなスタイルを決めるのは、良い方法だともいえません。最近のページを見ると、背景色・背景画像の原色多用、背景と文字の色が同系色(色目が近い・薄いパステル)だったり、見る側は健常者だけではありません。

残念な事に「私は、Windows.-IE の使用者ですので、Macintosh.-NN の事なんて考えません。」と、主張されるwebマスターの方もいらっしゃいました。独自拡張タグの多用はやめましょう。

いろいろな方に(Global)「見てもらう」意識と「見やすいページ作り」が、大切です。Webサイトは、有意義な情報発信を目的とするページで、インターネットでアクセスする方々に分け隔て無く閲覧できるようにしたいものです。

ページの重さは、1ページあたりの総バイト数は、80,000バイトが限界、それを超えると超重い!!便利なフリーソフトVector.に“HTML体重計”がありました。

“ホームページ”“HP”と一般的に呼ばれていますが実際は「Webサイト」といいます。その中の一つを「ページ」と呼ぶことが正式名称です。外国の人に、“Home Page”や“HP”等と書くと違う意味に取られますので当サイトでは、あまり使いません。
因みに“HP”は、米コンピューター大手会社ヒューレット・パッカードや英国製ソースの略式名称になります。

Webブラウザ Internet Explorer.(IE) IEマークNetscape Navigator.(NN)NNマーク 、バージョンとかの違いで、折角立ち上げをしたホームページなのに、正しく閲覧出来ない(見苦しい)現状は、避けたいものです。Webブラウザは、十数%ですが他にもあります。例えば:Windows.の軽量型「Lite.」、Macintosh.軽量型「i-Cad.」のテキストベースの「Lynx」、話題の最速ブラウザoperaマークOpera(公式ja)」やOpera Japanese User's Groupの有志5名による日本語化ツール無料ベータ版MoonStone'S Laboratoryがあります。

視覚・身体障害者の方のために 日本 IBMの「バリアフリーの扉⇒Webアクセス」に詳しく書いていますが、その中の「i-checker」をご利用になり、Webアクセシビリティーを考える、ご自分のページがどのように音声だけでホームページを理解されているのか試して見ましょう。

また、Hiro さんのサイト「バリアフリーWebデザインガイド」を、ご覧になることを推奨します。(Webページで、目の不自由な人も「音声」を使ってWebを閲覧してることを再認識して、どうすればいいのかを優しく教えてくれます。)

もう少し言わせてもらえれば、

ここ数年で、HTML の世界は飛躍的な進歩をし、更なる発展 CSSバージョン や XHTMLバージョン に向かっています。また、「画像、動画、音楽、音声、FLASH、Shokwave、DynamicHTML、 Perl 、CGI 、ActiveX 、Scriptlets、JavaScript 、JavaApple 、その他」 が、 HTML に登場し無料で提供されたり ご自分で製作されて使用されています。

提供された画像 や音楽を PC にダウンロードし HTML に画像 ・音楽の File名をページに記述し使用するのは簡単です。しかし、あまり訳のわからない段階でのプログラム/言語の自作使用は、避けた方が良いと考えます。(レンタルものは、別ですが。)

皆さんも経験あると思いますが、やさしい方で例にあげると「構文エラー」「開けた瞬間マウスやキーボードが反応しない」とか、それ以上のトンでもないブラクラや泥棒サイトに出会います。
もし、言語を勉強するなら、DynamicHTML> JavaScript> Perl > CGI と簡単な入門段階をとっていっても良いでしょう。

あっ\(◎o◎)/! そうだった、 XHTML 、XML が基本ですが HTML と CSS を理解したうえで勉強したほうが解りやすいです。 XHTML or CSS がさらにバージョンアップ!
勉強中…ø(;^_^Aアセアセ...........

HTML ( Hyper Text Markup Language. )
読んで字のごとく、電子文章にしるし付けした言語。
HTMLはSGML(Standard Generalized Markup Language)の書式を踏襲したマークアップ言語の1つで、WWWサーバでのドキュメントを記述するための言語として広く知られています。WWWサーバのドキュメントでは、このHTMLにより文書の構造や体裁などの要素(SGMLやHTMLでは、これらをエレメントと呼んでいる)を定義し、イメージやURIを貼り込んで、ハイパーテキストを実現しています。
W3C ( World Wide Web Consortium. )
通称:ダブリュー・3・シー。Web の為のブラウザ/サーバーに関係する技術の標準化を推進する団体。欧州素粒子物理学研究所(CERN)とマサチューセッツ工学大学(MIT)が設立し、現在 欧州では、仏国立コンピュータ科学研究協会(INRIA)が中心となり各国に窓口を作り活動しています。日本では、慶応義塾大学(湘南藤沢キャンパス)等が窓口になり参加し活動されています。
WAI( Web Accessibility Initiative. )
障害をもつ人たちのウェブへのアクセスを向上させるという考えが実行に移され、技術、ガイドライン、及び、ツールに関して研究する機関で、ブラウザやマルチメディアプレーヤの開発者及びサイト構築者(ホームページ製作者)に対し、障害者にも利用しやすいサイト構築方法や製品の開発に必要な情報を提供します
CSS ( Cascading Style Sheets. )
通称:スタイルシート。とは、HTML のページのデザイン規格(配置・色・文字・その他)のスタイル構成・構造・機能を細かく指定できる言語。また、Level-1.〜Level-3があり、明細なスタイルが可能になりました。( W3C で、築定・推奨されています。)
Deprecated
W3Cの勧告(Recommendation):HTML4バージョンから、非推奨/廃止予定のタグや属性の扱いを一般的にスタイルシートが普及するまでの処置としたものを言います。(下記にW3Cの引用文があります。)
今後、数年の間にCSSが普及すれば、HTMLのRecommendation.の扱いは、Unsupported(Abolition.)になると考えます。
Perl ( Practical Extraction and Report Language. )
通称:パール。UNIX 用のテキスト処理言語。 awk(オーク)、std (セッド)、grep (グレップ)、等の機能を取り込んでいます。
CGI web用( Common Gateway Interface. )
通称:シージーアイ。 ユーザーのWeb ブラウザからの要求によって、外部プログラム( Web サーバー)との間で連携処理を行うためのインターフェースで、処理結果はユーザーのWeb ブラウザに HTML 形式で表示されたりします。
Dynamic HTML
Webページ上でインタラクティブな表現を可能にする技術。ポインタをあてることで指定した画像を表示させたり、イラストを回しながら弾ませたり、背景色をフェイドイン・フェイドアウトさせたり、といった動的なWebコンテンツを実現できます。HTML4.0とCSSのスタイルシート、スクリプト言語がコアになっていて、処理はクライアント側のWebブラウザで行ないます。
もともとDHTMLは、1997年にMicrosoftとNetscapeがHTMLに其々独自の拡張を加え、自社のWebブラウザに組み込んだのが始まり。クライアントサイドのスクリプティングを組み合わせることで、ActiveXやJavaアプレットを使用しなくても、DHTMLを使用したWebページは、視覚的な変化のためだけに、一々JavaScriptやCGIのようにWWWサーバに問い合わせる必要がなくなるため、早い応答性を保つことができる。DHTMLの主要な機能としては、Document Object Model(DOM)、Data Binding、Scriptletsなどが挙げられる。(独自の拡張プログラムによって、作動しない場合もあるので注意が必要です。)
JavaScript
Netscape Communications 社によって開発されたスクリプト言語。同社のLiveScriptをベースにJavaの仕様の一部を取り入れた言語仕様になっているが、Javaとはまったく別物。 クライアントでのJavaScriptはHTMLの<Script>タグ内に処理を記述し、ページを読み込む際にWebブラウザに搭載されたスクリプトエンジンで実行することになる。条件分岐によってそれぞれ異なったHTMLを表示させたり、スケジュールを決めて一定の処理を行なったり、値の入力やドロップダウンからの選択などフォームに対する操作に対して、特定の関数を実行することができます。 JavaScriptはNetscape Navigator 2.0、Internet Explorer 3.0以降のWebブラウザでサポートして、現在WWWの中では、もっとも利用されている言語の1つと言えますが、MicrosoftのサポートしているのはJScriptというJavaScript互換のスクリプト言語で、微妙に仕様が異なっているので、プログラムを組む場合に共通性がある場合は良いが、無い場合個々のプログラムが必要になる。
2001年7月 製作

◆ 出来れば、テキストエディターを用意しましょう

 はじめる前に、Windowsユーザーの方なら「メモ帳・ワードパット」、Macintoshユーザーの方なら「SimpleText」のような、OSに組み込まれているものでもかまいませんと言っておきながら……

 ココで便利なフリーソフトがあります、「 HTML 用テキストエディター」です。(検索Vector.一応 紹介までに……)
HTML 用テキストエディターは、メモ帳などと違い「HTML 文書」を編集するソフトのことで、フリーウェア(無料ソフト)やシェアウェア(有料ソフト)での検索窓の杜などもあります。(あればラクですが……)

 また、Yahoo! 等の検索で、「フリーソフト > Windows. or Macintosh. > インターネット&通信 > HTML作成」と、検索してみて下さい。あなたに、合ったものがあるかも!?
個人的にフリーソフトなら、TTT Editor,・HTMLanguor,・CHES がお勧めです。FTP機能付きなら、Homepage Manager,がお勧めです。

NNマーク NNには、付属のNetscape Composerというものがあります。
Netscape ComposerとはNetscape Communications社が提供しているNetscapeシリーズに付属しているホームページ作成ソフトです。
メニューバーの[タスク]から[Composer(C)]を選択すると、別ウィンドーでNetscapeComposerが起動します。

ただし、タイトルどおりWindowsの「メモ帳」を使って、解説を進めていきます。


Deprecated

A deprecated element or attribute is one that has been outdated by newer constructs.
Deprecated elements are defined in the reference manual in appropriate locations, but are clearly marked as deprecated.
Deprecated elements may become obsolete in future versions of HTML.
User agents should continue to support deprecated elements for reasons of backward compatibility.
Definitions of elements and attributes clearly indicate which are deprecated.
This specification includes examples that illustrate how to avoid using deprecated elements.
In most cases these depend on user agent support for style sheets.
In general, authors should use style sheets to achieve stylistic and formatting effects rather than HTML presentational attributes.
HTML presentational attributes have been deprecated when style sheet alternatives exist (see, for example, [CSS1]).


←BACKNEXT→


Copyright (c) Producer by System KS. 2001 All rights reserved.

▲up