■Webページ作成上の留意点
1.エディタに
メモ帳、Windows Notepadを使う
【Web開発】当方、パソコンの『WZエディタ』で編集、『FFFTP』にてFTPサーバーにupし(以下、私の”クラウド”とします)、iPhoneで表示・確認をしています。スマホで「どこでも情報」を考えています。「うろ覚え」の情報をスマホで確認できたら素晴らしいことです。ただ、さすがスマホでは表示が小さく苦しくなってきました。
パソコンやタブレットを推奨します。
Webサイト編集は日を要する作業です。USBの抜き差しは苦痛でたまりません。それでクラウドを引き出し代わりに使用しています。「引き出し」が同じなら別のパソコンでも作業はできます。ただ気を付けないと、古いファイルをクラウドにUPすることもあり『百歩進んで一歩後退』することだってあります。サイト内を奔放に「あっちこっち」編集していくものですから、気合いの入れ具合で誤字脱字があったり文章の脈絡がおかしくなったりします。結果、迷惑をかけています。

◇「エディター」というのは至極便利なツールです。本来はプログラミング用のものです。これを初めから文章作成用に使っておられる方もあるようです。
エディターは
軽くて・安くて・早いが売りです。特に、エディターの検索機能については定評があり、保存したファイルが100や1000の数であろうが、検索語を探しだし、どのファイルのどの位置にあるか特定してくれます。これがコンピュータ・エディターの「なせる技」です。勿論、単語の置き換えなどお得意です。
さて、上図はエディターで作ったHtmlファイルです。Htmlファイルの大きさは小さく、タグ(< >:上図参照)がなければテキスト文に近いものです。Htmlのタグ付きなら私のクラウドにUPすればネットの文章として見えます。
Webに表示するくらいなら、比較的簡単な学習でHtmlファイルをつくれます。一太郎をお使いなら、すでにある文章をHtmlファイルに変換することが可能です。
■どこまで続くかわかりませんが、Html学習の仕方を示します
1.「お試し」のHtml学習には専用の「エディター」は必要ありません。
Windows 付属のメモ帳、もしくはWindows Notepadを使用してください。上記がインストールできていない場合があります。ネットでいずれかを選びインストールしてください。Windows11ではWindows Notepadを使用するようです(以下これもメモ帳とします)。
次にHtml学習の一端を示します。2枚の図がありますが、左はメモ帳で『こんにちは、ようこそ』を表示させようとするHtml文の記述です。右はファイルとして保存するところです。
|
< >で始まり「/」付きの< >で終わります。< >はタグといわれるものです。最初の2行のタグは必ず入れます。
head、HEADで小文字、大文字どちらでも結構です。headと/HEAD、最初のhtmlと最後の/Html、bodyと/body、いずれも対になっています。(「<」と「>」は省略しています)
Webで表示させる所は、「body」と「/body」で挟まれた所です。左図では、『こんにちは、ようこそ』と記しました。
これを、「はじめて.html」のファイル名でドキュメントの場所に保存します。そのとき、最下行の「エンコード」が「UTF-8」であること確認します。このコードを使うと、どこの国の言語でも比較的簡単に変換可能と考えればよいものです。 |
|
|
以上、保存したファイル名の場所(図では「ドキュメン」です)へ行き、「はじめて.html」を指定し、クリックしてください。ブラウザーが起動して『こんにちは、ようこそ!』が表示されたでしょうか。これで第1講は終わりです。(2025.9.13)
『余談1』
我々は探しものでWebサイト(=Home Page)を検索します。このWebサイト自体の検索頻度は一般的に下がってきているとのことです。検索で現れる第一画面がこれまでと違い、ブラウザーのAIが情報を横断的に収集し、その学習機能にて表示するようです。
同様なWebサイトが乱立している現状では、「AIによつて整理され、まとめられる」と考えると、よい事かもしれません。探しものの発掘にスクロールを繰り返す、
Webサイト探しも面倒ともいえます。
スマホにおいてはこの傾向がさらに進んでいるように思えます。検索された第一画面の内容が、AI表示になっていて、ユニークで丁寧な説明のあるWebサイトに行き着けず、途中で切り上げてしまうこともあるでしょう。また、情報を受け取る側も横断的な方法が習慣化し、見えていない部分があることも考えないで終わることもあるでしょう。これは深刻な事態だと考えます。
AIの脅威にさらされ「従来のWebサイト」がどのような形で生き残れるか、十分に考える必要があります。Webサイトの目的は、広く皆さんに「お知らせ」する広報の部分と、関係者間の双方向の連絡・連携をはかる部分があると思います。仮に、私のWebサイトの広報の部分がAIのものに見劣りしたとしても、まだ「そこに」は
人と人を繋ぐ、連絡・連携(サポート)の部分があると考えます。そうでも考えなければ、私の今の努力(これから進める努力)も報われません。
『余談2』
私はクラウド(雲の上のHDDと考えてください)をファイルの引き出し変わりに利用します。それで、ファイルの更新日付は極めて重要なもになります。
このクラウドと当方のパソコンのファイルの日付で、ファイルの新旧を判断しクラウドへupします。upする先が同じであれば、別のパソコンからクラウドの更新済みのファイルを引き出し、続き編集が可能です。パソコンは持ち歩く必要がなく非常に便利です。しかし、クラウドの新しいファイルの上へ、同一名の古いファイルを書き込む事態がたまにあります。まさに『百歩進んで一歩後退』となり、日付の狂いが「私の発狂」の事態となって現れます。
それに、ファイルの新旧の判断ミスだけでなく、まれにパソコンでファイルの更新保存した場合に、ファイルの日付が更新できていないときがあるのです。古いパソコンを使っていないので、その理由がわかりません。
『余談3』
Webサイトの運営に際し、プロバイダー(回線業者)からWebサイト作りにいくらの容量が与えられているかが重要です。当方の場合は20MB(無料枠)で、その無料枠を超えて5MBを追加し運営しています。ここに、写真や図、それに動画を記載すると、それらのファイルは1つでもすぐ1MBを超えます。それで、涙ぐましい努力で一つ一つのファイルが小さくなるような努力をしています。
使用容量を最小限に抑えるには、HtmlファイルだけでWebサイトを作るのが一番です。しかしこれでは文章と表だけということになり、Webサイトとしてはつまらないものになります。文章の長さにも関係し、文章が延々と続くようでは、最後まで読んでもらえないWebサイトになります。「X」(ツイッター)が栄えるゆえんは、
文章の簡潔さや映像にあるようです。
プロバイダーを変更せずとも、無料枠が大きくもらえるAmeba、ライブドアブログなどにWebサイトを置く方法もありますが、使い勝手がまた違い、歳を考えるとついて行けません。
『余談4』
Webサイト使用容量を最小限に抑える努力は必ず必要になってきます。画像ファイルでは、画像の表示面積大を小さくし、画質を下げています。拡大表示する必要ないものでしたら、50KB以下に抑えています。使用ファイルは、GIFファイルでもよいのですがJPGファイルを使用しています。
PDFファイルには画像とテキスト(文字)の部分があると、画像の部分の画質を落とすことでファイル全体を小さくすることが可能です。Windows の[印刷]処理でMicrosoft print to PDSを選択することでもPDSファイルが作れます。これをより小さなファイルにするには専用のPDF編集ソフトが必要です。文字ばかりのPDSファイルではファイルの縮小化は無理と考えてください。
動画ファイルはファイルの中で一番大きく、本来なら使用したくないのですが、止む無く、私のWebサイトでは2つ使用しています。これについては、動画時間を短縮したり、1秒あたりのコマ数を少なくしたり、表示面積を小さくしたりしています。因みに、神輿の動画ファイルはMP4ファイルで780KBです(有料ソフトの良いものを使えばもっと小さくできるのですが)。※1024KBが1MBです。