このページでは、主にインターネット利用に関するコンピュータの記事を掲載します。 大項目は下記のメニューの通りです。コンピュータの用語集はウェブ上や本屋さんに溢れているので、このページでは、管理人・丸男の自己体験を踏まえた言葉で説明します。[ 建設用語集 ]共々、どうぞよろしくお願いします。 ホームページ作成
ウェブサイトの活用ネット接続トラブル、レンタルサーバー→下記はこちら(別ページが開きます)ネット接続トラブル、PCの機種やブラウザにより異なるウェブ表示、ブログ作成、レンタルサーバー、レンタルサーバーの移設 →下記はこちら(別ページが開きます) ウィルス対策、ハードウェア、ファイルの圧縮 迷惑メール・詐欺メールと思ったら(実際に届いた迷惑メール・詐欺メールを公開)→実際に届いた迷惑メール・詐欺メール |
● | ||
ホームページの作成手順は非常に大雑把に言えば、たった2つのステップだけです。
「たった2つだけ」と言われても、これだけじゃ「何のこっちゃ?!」と苦情が届きそうなので、以下に段階的にもう少し詳しく説明します。 ※上記手順の前に、皆さんが既に回線業者(NTTやAuなど)およびプロバイダ(niftyやOCN、So-netなど)と契約を済ませていることが大前提になりますが、このページをご覧いただいていると言う事は、この2つの契約は既に済ませていると考えられますので、これらについての説明は省略します。なお、回線とインタネット接続の2つを1つのプランとして提供している場合もあります。 ■ホームページの作成・目次■(1)ドメインの取得(2)インターネット閲覧ソフト (3)ホームページ作成ソフト (4)HTMLのタグ (5)スタイルシート (6)ウェブサーバーに送信(アップロード)・FTP送受信 (7)動画の再生 (1)ドメインの取得まず、ホームページを作成する前に、ホームページのアドレスを取得しなければなりません。あるホームページのアドレスを指し示す方式をURL(Uniform Resource Locator)と言い、URLによって示されたホームページのアドレスをドメイン(*)と言います。例えば当サイトのドメインはwww.go-isesaki.comです。ドメインの末尾の種類は現在いくつもあって、代表的なドメインの種類は・・・*.co.jp、*.com、*.jp、*.nam、*.net、*.org、*.info・・・ 等ですが、現在まだまだ増殖中です。これらは誰でもが登録できる訳ではなく、例えば *.co.jp などは企業用です。登録費用も種類ごとに異なります。 無償でもホームページを作成できますが、その場合には提供者があるルールでドメインを決めてしまう場合が多く、自分で独自のドメインを登録したい場合には、公式認定されたドメイン登録機関(これらの指定業者をレジストラと言います)で取得します。同じ種類でもレジストラによって登録費用が異なります。 (*)ドメインは人間が分かり易いように付けた名前で、実際はコンピュータはIPアドレスと言う4つの数字並びで識別されています。IPアドレスとドメインとを対応付けるシステムをDNS(Domain Name System)と言います。 |
||
(2)インターネット閲覧ソフトインターネット閲覧ソフトは「Webブラウザ」とか「WWWブラウザ」とも呼ばれています。一般的に、インターネット利用者はこの存在を意識せずに利用しています。有名なインターネット閲覧ソフトは下記の通りです。・Edge(マイクロソフト社製、Windowsに標準装備。Internet Explolerの後継ソフト) ・Safari(アップル社製、無料) ・Firefox(Mozilla Japan、無料) ・Opera(Opera Software、無料) ・Netscape(Netscape 日本、無料) HTML仕様HTML仕様とは、インターネット閲覧ソフトで表示可能な言語仕様のことで、HyperText Markup Languageの略称です。直訳的には「ハイパーテキストのための、文書に目印を付ける方法を定めた言語」となります。「ハイパー」とは、テキスト内に記述されている内容が普通のテキストを「超えた」意味を持っていると言ったニュアンスです。ファイル形式がテキスト型なので、作成、編集が容易で、テキスト編集ソフト(*1)でも作成できます。ただ、言語仕様を熟知している場合には直接にテキスト編集ソフトでHTMLファイルを作成できますが、通常はホームページ作成ソフトを利用します。 (*1)WindowsのアクセサリソフトNotePad(メモ帳)やTeraPad。 TeraPadはSusumu Teraoさんが開発し無償提供しているテキスト編集ソフトで、私も便利に利用させてもらっています。 (3)ホームページ作成ソフトホームページ作成ソフトとしては下記等が一般的です。・IBM Home Page Builder(主に初級者向け、売り上げは7年連続Top。私も利用しています。) ・Dreamweaver(当初はマクロメディア社、2005年Adobe社が買収。専門業界で圧倒的なシェア) ・FrontPage(当初Vermeer Technologies社、現在マイクロソフト社が買収) CMS(コンテンツ・マネジメント・システム)また、巨大なサイトを多数の人が同時に構築するような場合、CMS(コンテンツ・マネジメント・システム)と言ったウェブ作成の統合システムも利用されています。CMSは無償のシステムと商用の有償システムとがあります。無償システムで有名なのは下記の通りですが、設定して利用するにはHTMLの知識のみならずコンピュータ全体の知識も要求されます。・Geeklog(ギークログ) ・XOOPS(ズープス) WordPress ホームページ作成ソフトでもありCMSでもあるのがWordPress。PHPで開発されたオープンソースのウェブ制作ソフトで、Wikipediaによれば、2023年6月時点で、全ウェブサイトの43.1%で使用されているとのこと。IBM Home Page BuilderにはWordPress利用メニューが取り込まれています。テンプレートが豊富に用意され、短時間で洗練されたページを作成できます。 ただ、私は使用していません。その理由は、ホームページ制作を始めてから30数年、今までに制作したページは全て自分が起こしたコード(HTMLやCSS、PerlやPHP等のスクリプト言語)で動作していて、機能変更や改良、不具合に対して全て自分で掌握・対応できる範囲ですが、WordPressは総合環境なので、使わない機能や変更したい機能があっても、安全のために”下手に”変更・削除できないからです。有体に言えば、大きな邸宅で一部屋間借りしているような気分でウェブ制作を続けたくないためです。 (4)HTMLのタグホームページ文書に付ける目印はタグと呼ばれ、一般的な構造は<コマンド>〜</コマンド>のようにタグで囲みます。HTMLファイルを直接編集する場合にはこのタグを覚えることが必修になり、参考書などで、「HTMLタグ辞典」等も販売されています。タグの例をいくつか下記に示します。 ・文字を太く表示・・・<b>Go!伊勢崎</b> ブラウズ結果→Go!伊勢崎 ・文字を赤く表示・・・<font color=red>Go!伊勢崎</font> ブラウズ結果→Go!伊勢崎 ホームページ作成ソフトを使用すればタグは自動生成してくれますので、タグの知識がなくても大丈夫ですが、自動生成機能に過不足や不具合がある場合には直接HTMLファイルを編集することになりますので、できればタグの文法は修得したいものです。 実際、<P>〜</P>や<FONT>〜</FONT>などが必要以上に冗長に生成されたり、コピー&ペーストで文章を複写すると、常に属性までコピーされて、HTMLのソースを直接確認すると不要なタグだらけと言う場合もありますので、HTMLのシェープアップ(*1)のためにもできるだけマスターしたいものです。 (*1)細かい話ですが、WEBブラウザは起動時にHTMLファイルを読み込んで翻訳しながら画面に表示しますので、表示に影響しない無意味な文が少ない方が表示も速くなるし、ディスク容量等のリソースの節約にもなりますので、常に最適でコンパクトな内容にしたいものです。 (5)スタイルシートHTMLのタグだけでも十分にホームページを作成することができますが、更に気に入った画面を自由にきめ細かく表現したい場合にはHTMLとは別にスタイルシートで定義します。スタイルシートの主流はCSS(Cascading Style Sheets)です。スタイルシートはHTMLファイルの中に記述しても、また別個のファイルで定義しても構いません。ホームページのソースは閲覧者に自由に読み取られてしまいますので(ブラウザのメニュー<表示>-<ソース>で表示されます)、自分があれこれ工夫したスタイルシートを他者に利用されたくない場合や、複数のページに共通のスタイルを設定したい場合等は、別個のファイルにすれば対応できます。 (6)ウェブサーバーに送信(アップロード)・FTP送受信上記のようにして作成したHTMLファイルはウェブサーバーに送信(アップロード)しないと他者が閲覧できません。ウェブサーバに送信するには、FTP(File Transfer Protocol:ファイル・トランスファー・プロトコル)で行います。ホームページを習い始めた頃、自分のパソコン(クライアント側)で仕上げたページをウェブサーバに送信するのを忘れているのに、「ちっとも直した通りに表示されない」と悩む場合が良くあります。また送信した後も、通常は前の表示内容がキャッシュメモリに残っていますので、更新(リロード)しないと最新画面になりません。リロードはインターネットエクスプローラの場合、F5キーにも設定されています。 FTPクライアントソフトはホームページ作成ソフトには標準で装備されていますが、単独では下記のような無償ソフトもあります。 ・FFFTP(入手はこちら) 下記の「(7)動画の再生」の記事は、当サイト開設の2006年9月17日から2012年末頃までの動画作成技術に対応した記事で、2023年現在ではウェブブラウザあるいは動画再生ソフトで対応していない機能がたくさんあります。ただ、動画作成技術の変遷を記録する意味で、当記事を残しておきます。 2012年末以降、当サイトの動画は全てYoutubeにアップロードしています。(2023/8/5 記) (7)動画の再生最初にお断りすると、動画の再生に付いてはその技術的な事柄全体をきちんと整理して説明することはできません。実体験から得た少ない知識、しかも悪戦苦闘の経緯をお伝えします。■動画の撮影とファイル形式 私のデジカメ(Panasonic LUMIX)は動画撮影機能が付いていて、シャッターを押し続けるだけで動画が撮れます。撮った動画ファイルはQuick Timeのファイル形式であるmovファイルで出力されます。記録画素数は320×240で固定ですが、動画コマ数は30fpsと10fpsの2種類を選択できます。30fpsの方がスムースな動画が撮れますが、ファイルサイズが大きくなるので、現在は10fpsで撮っています。 シャッターを押し続けるだけなので撮影は至って簡単ですが、残念なのは、動画撮影中にズームを変更できないので、距離感に変化のある動画を撮るには自分で移動するしかなく、歩き回れない場所で撮影する時にはカメラをグルリと周囲に向ける等の工夫をしています。 ■まずは簡単な再生方法 このようにして撮影した動画ファイルをそのままウェブサーバにアップロードし、紹介ページのHTMLにリンク用タグを記述するだけでも再生することができます。 その方法や使用するコマンドにはいくつかありますが、私はEMBEDタグを使用しました。 <EMBED src="###/###/###.mov" width="320" height="240" panel="0" repeat="true" save="false" volume="70" text="###" autostart="true" loop="false"> ※EMBED内の各コマンドの詳細は省略しますが、「EMBEDタグ」でサイト検索すればたくさん見つかります。 ■ダウンロード後の再生 上記の方法は通常はQuick Timeで再生しますが、画像ファイルを全てダウンロードしてから再生しますので、閲覧者のPCの環境(回線の伝送速度、CPUやメモリのスペック、グラフィックエンジンの有無、インストールされている動画用ソフトの種類と設定内容・・・)によって差があり、随分と待たされたり再生できなかったする場合もあり、余り歓迎されません。 当サイトの常連さんに尋ねても、「全く問題なく軽快に再生される」と言う方と、「いつになっても表示されない」と言う方とおりますので、汎用性のある方法ではないようです。 ■ストリーミング再生 ダウンロード後に再生する方法に対して、ストリーミング再生という方法があります。これは少しずつダウンロードしながら再生を始める方法で、閲覧者が待たされることなく「取りあえず」再生が始まるので、現在の多くの動画専用サイトはこの方法を採用しているようです。「取りあえず」と言うのは、1回の読み込み(これをバッファと言います)時間に対してその再生の方が早く、次の読み込みまでにはやはり少し待たされるからです。 ■ストリーミングサーバ ストリーミング再生はウェブサーバからの配信も行えますが、サーバや回線への負担が大きいので、通常は専用のサーバ(これをストリーミングサーバと言います)を用います。当「Go!伊勢崎」の動画は残念ながらウェブサーバから配信しています。 ※「何でストリーミングサーバにしないの?」と問われると答は簡単で、ハードや専用ソフトの費用がウェブサーバと別個にかかるからなんです。 ■動画再生プレーヤーソフトと動画ファイル形式 ストリーミングサーバを利用した配信をしなくても、多くの人に軽快に再生してもらう方法がないかとあれこれと調べ、悪戦苦闘したのがファイル形式と再生プレーヤソフトとの関連です。 現在主流とされている再生プレーヤーソフトには MediaPlayer、QuickTime、RealPlayer、Flash Video、iTunes等があります。 基本機能はどれも無料でダウンロードできます。 そして動画ファイル形式には下記のような形式があります。 オーディオ:mp3,mp2,cda,wav,wma,aac,m4a,m4b,mp4,acp,m4p,m4a,mov,aif,aiff,au,acp ビデオ:vob,mpeg,mpe,mpg,avi,divx,wmv,mov,qt,swf,flv 自由競争の世界なのでアップル社やマイクロソフト社を中心に次々に新しい環境を提供して来るのですが、これだけあるとユーザの立場からすると追い付いて行くのが精一杯です。 ■コーデック 動画の再生には、ファイル形式と別にコーデックと言う技術も重要です。コーデックとはデータのエンコード(符号化)とデコード(復号)を双方向に行う技術で、既にお馴染みのファイルの圧縮/解凍等もその技術の1つです。(codec:coder/decoderからのネーミングです) 同じ動画ファイルでもコーデックが異なると再生しないなどの現象も起こります。 ここまで読み進めて来た人も相当にウンザリして来ていることと思いますが、あと一歩です。 ■動画ファイルの変換 上記のような事をあれこれ調べて、結果的にどのような方法が最適かと言う結論を得ました。それは @ネットユーザの多くはWindowsのPCを使用している。 AWindowsには標準で Media Playerが実装されている。 BMedia Player の標準ファイル形式はwmvかwm。 これ以外の形式(asf,avi,mpeg,mpgなど)も再生可能だがマイクロソフト以外のコーデックで作成されている場合もあるので、無難なwmvかwmにする。 C従ってデジカメで撮影したmovファイルをwmvファイルに変換すれば良い。 試しにいくつかのwmv動画でテストしたところ、Youtube等と変わらぬような雰囲気で、軽快に再生されました。 ・・・とここまでに至って探したのがフリーソフトの動画ファイル変換ソフト。フリーとは言え、機能不足や怪しそうなソフトは避けて、最終的に選んだのが「Free Video Converter」です。 ※このソフトの前に使用したフリーソフも機能や操作性に十分満足していたのですが、動画の最初(1分程度)、画像の中央に宣伝のコメントが入ってしまい、これを削除するには60ドルの支払いが必要だったので、他のソフトを探したところ、上記のソフトに到達しました。 そして、最終作業として、変換後のwmvファイルをウェブサーバにアップロードし、EMBEDタグ内のファイル名を <EMBED src="###/###/###.mov" ・・・・・>から <EMBED src="###/###/###.mmv" ・・・・・>に変更し終了です。 と、以上のような顛末記があって現在の動画配信に至りました。取りあえずその手順も落ち着いて一段落していますが、日進月歩の世界なので、またまた見直しを迫られる時が来ると思います。その時には、またこの記事も更新したいとおもいます。 |
● | |
HTMLやCSSを使用したウェブページは、表示時にそのコードに従って静的に処理するだけなので、表示後、ユーザ(クライアント側)が入力したデータを読み込んで対話型処理を行いたい場合などには限界があります。 簡単な機能の場合にはHTMLコードの中にJava Scriptコード(*)を組み込んで対応することもできますが、ちょっと複雑な処理を行いたい場合にはウェブサーバ側にソフトを組み込んでおき、このプログラムとブラウザとの間でやり取りを行います。 (*)JavaScriptの場合、画面を移動せずにユーザとの対話処理を行える利点がありますが、ソースコードをブラウザの<ソースの表示>で簡単に読み取られてしまうこと、また簡易言語的な位置付けに発展性を感じない等々の理由で、私は余り積極的には使用していません。 この流れを整理しますと、下記のようになります。 (1)ユーザがブラウズ(表示)中の画面に何かを入力し、データ送信ボタンをクリック。 通常は送信ボタンには「計算」とか「確認」、「登録」等、ユーザが次の操作を理解しやすい言葉を表示しておきます。 (2)ウェブサーバ側にあるソフトはユーザからのデータを受信し、その内容を解析し、次の処理をHTMLやCSSコードなどに置換してクライアント側に返します。 (3)クライアント側でブラウザがその内容を表示します。 以下、上記処理の繰り返しになります。 ウェブ側に置くソフトを組むには下記のようなプログラム言語を使用します。 ●Java ●Perl ●PHP ●.NET(ドットネット) 当「Go!伊勢崎」では下記のページをPHPで作成してあります。 ●管理人日記 ●掲示板集のページと指定期間内の各掲示板の表示 ●参加コーナーのシニアチェック ●参加コーナーの伊勢崎テスト ●顔で遊ぶ ●写真集閲覧 また、下記のページはPerlを使用したフリーソフトをカスタマイズして利用しています。 ●各掲示板 ●伊勢崎アンケート Javaや.NETは使いこなしていないので総括的な事は語れませんが、JavaやPHP、PerlはどれもCやC++言語に似ています。細かい理由は省略しますが、私はPHPとPerlでは主にPHPを使用しています。 どんな言語を使っても、クライアント側からのデータ受信部分と、その処理結果をブラウザへ渡すためにHTMLやCSSコードを生成すると言う基本を掴んでしまえば、Windows上のソフトを作成しているのと同様な感覚で作成できます。ライブラリの数もC言語同様な物が用意されていて、ファンクションの名前なども非常に似ています。 ▲ページTopへ PHP言語のバージョンアップ 5.4から一挙に8.1へ今年(2023年)6月、当サイトのレンタルサーバ会社から「PHPのバージョンアップをご検討ください」とメールが届きました。その時点で利用していたバージョンは5.4。これを8.0か8.1に更新して欲しいとの内容です。7.4以前のバージョンは既に保守を終了し、今後脆弱性等が発見された場合、提供終了になる可能性もあるとのこと。メール受信後、速やかにバージョン8.1に設定したところ、該当するPHPページには、先頭行にただ「Internet Server Error」と表示され、以下真っ白。頭も真っ白! 「使用できなくなったファンクションがあるのだろうか?全く何も受け付けないとはそれ以前の問題か!」 これでは更新作業も容易ではないと予想し、一旦元の5.4に戻してやや2か月放置。この間、レンタルサーバ会社へPHP開発に関して問い合わせましたが、開発に関する対応はしていないとのこと。サーバを貸すビジネスと言語開発技術をサポートすることは別なことと理解できるので、仕方ありません。 「困った、困った、でもずっと放置はできないし・・・何とかしなくっちゃ」 と、ウェブで調べ進めるうちに、この度、無事に解決に至りました。いつものことながら解決してしまえば原因は簡単でした。以下、その概要をお伝えします。 ■最大の原因は言語仕様 PHPはバージョン5.6以降、ファイル形式のデフォルトをUTF-8に変更したよう。当サイトのPHPページのファイル形式はShift-JISだったので、全て拒否された次第です。 【対策-1】PHPページのファイル形式をUTF-8へ PHPで記述されたページ(まずは掲示板集から)のファイル形式をUTF-8、改行コードをCRLFに変換し、サーバへアップロードすると「Internet Server Error」は表示されず、目的の画面”らしい”内容が表示されました。ところが、一部文字化けがあります。調べると・・・ 【対策-2】ページ内の言語設定をUTF-8へ meta タグで設定していた言語仕様もUTF-8に変更する必要があるよう(下記)。 <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> これを <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> へ変更すると一部の文字化けが解消しました。 これは、そのページの<HEAD>部でcharset=Shift_JISを設定していても、有効にならないと言うことのようです。これを避けるには、ページの先頭に <?php header("Content-Type:text/html;charset=Shift_JIS");?> と記述すれば解消するようですが、試してはいません。 【対策-3】文字コード変換 【対策-1】と【対策-2】で解決した文字化けは、ページ内コードで記述した日本語文字列。残った文字化けは外部ファイルから読み込んだ文字列。このファイルはPerlで記述した別のソフト(個々の掲示板)で出力するファイルで言語使用はShift-JIS。掲示板は多数使用しているので、全てに対応するのは作業量が多いので、PHPソフト側に下記コードを追加して文字型をShift-JISからUTF-8へ変換。 $msg = mb_convert_encoding($msg,"utf-8","sjis"); 以上の対応で全ての文字化けが解消し一件落着となりました。PHPページは掲示板集のほかにいくつかあるので、順次対応します。 余談ですが・・・ ウェブの世界では、言語はUTF-8に統一されつつあるようです。そのうち、HTMLからも言語設定(charset)が削除され、Shift-JISは消えるかも知れません。(2023/8/5 記) 【対策-1】〜【対策-3】で文字化けは解決しましたが、ほかの問題もありました。その一つが廃止された関数の対応です。(2023/8/6 記) 【対策-4】廃止された関数の対応 文字列を分割する関数(split)がPHP7で廃止されていたので、explodeに置き換えました。 |
● | |
先日、知人のHさんから、電子書籍のことを尋ねられました。電子書籍と言えばアマゾンキンドル(Amazon Kindle)が思い浮かび、所有している知り合いに現物を見せてもらったことなどもありますが、Hさんの話は、どうやら利用者側の話ではなく、出版する側の話でした。詳細はお伝えできませんが、ある出版物を関係者に渡せればいいだけとのことで、電子書籍に関心を持ったようです。 電子書籍を調べると、まだまだ流動的ながら、将来性に期待して既に巨大な業種・業態が生まれています。でも、結局は文章や絵、音声の表示・再生方法と、料金支払いや権利(売る側、読む側、著作権者)の管理をいかにユーザフレンドリーにするかと言うことで、それはつまるところ、ウェブプログラミング技術に依存することになります。 私も、その場でHさんに、「出版物の著作権収益を期待せず、関係者に渡したいだけならば、安からぬ費用がかかる商用サイトでなく、自分でウェブサイトを起こせばいいんじゃないですか」とアドバイスしたのですが、言った責任上、自身で電子書籍風のウェブ管理するにはどんな環境を利用できるのだろうかと調べてみました。 そこで到達したのがフリーソフトの「turn.js」(→http://www.turnjs.com/)。JavaScript言語で開発された本めくりのフリーソースコードです。詳細は省略しますが、当サイトの「花と緑・伊勢崎市の紅葉」のページを使用して、サンプルを作ってみました。確認したブラウザはインターネット 11.0 と Firefox 34.0.5です。 |
|
【操作要点】 ●ページの四隅をクリック→ページめくり ●ページの四隅をクリック後、めくれた部分をつまんでドラッグ→ページを部分的に開いたり閉じたりできます。 ●ページの左右端にマウス移動→グレイのタグが表示されますので、クリックするとページがめくれます。 ●表示ページの任意位置でクリック→クリックの度に表示内容が拡大/縮小されます。 ●拡大表示中に任意位置をドラッグ→拡大表示中の内容を任意に移動できます。 (※今回、簡易的に制作しましたので、鮮明度は高くありません) →こちらで実際にご覧になれます。 |
|
私の友人・知人・親戚の中にも、自叙伝や趣味、エッセイ、旅行記、論文などを紙媒体の書籍として自費出版している方が少なからずいます。記念に一冊いただいてあって、ざっと10冊くらいはあるでしょうか。これらの物理媒体の書籍の多くは、そのまま眠ってしまいますが、ウェブならば、サーバーが残される限り、いつか誰かが見てくれる可能性があります。また、著者本人も、印刷物を渡さずとも、URLを連絡するだけで他者に渡すことができます。 自身の著作物をウェブ上で本風に表示できる世界、何かの機会にお試しあれ。(2015/1/9 記) |