バカネコ日記

フリーページ

2004年09月13日
XML
カテゴリ:バカネコPC講座

テンプレートとは何か

パソコンが今のように普及する前は、テンプレートといえば
プラスチック板に文字・図形などの外形をくりぬいた製図用具を
指すことが多かったように思います。
 
円を描くのに、コンパスを使うのは面倒だし、穴もあいてしまいます。
決まった直径の円を描くだけなら、テンプレートの方がはるかに手軽です。

現在では、すっかりコンピュータ用語のほうがなじみが深くなりました。
キーボードの上に乗せ、どのキーがどの機能に割り当てられているかを
示す紙やプラスチックのシートもテンプレートと言います。
昔、一太郎などに付いていました。 これはどちらかというと名札ですね。

コンピューターの表計算とかデータベースソフトで、すぐ利用できるように
あらかじめ設定してあるパターン、あるいはプログラムのひな形コードなども
テンプレートです。

テンプレートはマイクロソフトの資料によると、「簡単な入力や修正を行うだけで
完成する文書のひな形のこと」とあります。
つまり、決まったレイアウトや定型文が入力されていて、必要な情報を入力したり
修正したりするだけで完成する、いわば「鋳型」なのです。

ホームページ作成でいえば、タイトルや文章、画像以外などの他にも
膨大な作業があります。

しかし、文章と画像以外は、全部同じパターンで良いとするなら、
ひな形を一度作ってしまえば、あとは流用することが出来て、大幅な
工数短縮(手抜き?)が出来ます。

たとえるなら、額縁の中身だけを入れ替えるようなものです。
額縁を作るのはそれなりに面倒ですが、中身だけ入れ替えるのであればラクですね。

パソコンの場合、額縁に当たるテンプレートは、いくらでもコピーできます。
もし、ひな形さえも自分で作らず、誰かが作ってくれたら...

そうです。 あなたは、中身だけ書けばいいんです。
初心者向きとよく言われますが、実は不精者向きと言った方が
当たっているかもしれません(笑)

【仔猫の里親募集中】

 ↑この子猫の里親を募集しています。



ホームページの場合、「ようこそ」と表示するだけでも、
以下のコードは必ず必要になります。

<html>
<head>
</head>
<body>
ようこそ
</body>
</html>


これを保存しておいて、「ようこそ」のところだけ、書き換えれば
別のページとして再利用できます。
これが、テンプレートの考え方ですね。

こんな単純なものはテンプレート化する意味はありません。
誰でも暗記できますから。
実際には、テーブルでレイアウトした複雑なものをよく見かけます。
暗記するには、ちょっとしんどいです。

テーブルとは、タテ、ヨコに罫線を引いた表のことです。
罫線の太さを0にして、線を見えなくしたものもよく使われます。

画像や文字をの位置決めに便利なので、レイアウトによく使われていますが、
本来、テーブルは表を作るために用意されたものであるから、レイアウトは、
別の方法(スタイルシート)でやれ、と、HTMLの規格を決めるおえら方は
おっしゃっております。

ここではそんな固いことは言わずに、気楽に考えてみましょう。
テンプレート、特に、無料配布テンプレートはテーブルレイアウトしたものが
非常に多いからです。



ネコでもわかる バカネコ講座はこちら。 →超初心者PC講座

笑って楽しみたい方はこちら  → 爆笑ガイド

ウンコ爆弾無効化アイテム   → 猫砂の研究




ここで、うちのサイトによく遊びに来る☆ぱせり☆2271さんが配布している
テンプレートを例に取ってみましょう。

ソースコードはこちらを見てください。
見れば分かりますが、表示されるものに比べてかなり長いソースです。

小規模な表示でも、かなり長いソースが必要になることが、しばしばあります。
こんなものを自分で考えたり、毎回、いちいち作るのはたいへんですよね。

サンプルとして一部書き換えたものを下に示します。

これは画像で表示しています


どこを書き換えたか、見てみましょう。 まずは、タイトル。
<TD COLSPAN=3 WIDTH=352 HEIGHT=25 BGCOLOR="#6699FF">
<CENTER><FONT COLOR="#FFFFFF">
<B>■タイトル■</B></FONT></CENTER>
</TD>
      ↓
<TD COLSPAN=3 WIDTH=352 HEIGHT=25 BGCOLOR="#6699FF">
<CENTER><FONT COLOR="#FFFFFF">
<B>■バカネコ日記■</B></FONT></CENTER>
</TD>

上の、「■タイトル■」のところを「■バカネコ日記■」に書き換えました。
えらく簡単ですね。 テキストを入れ替えただけです。
ほとんど、盗作ですねー(笑) こんなことでいいんだろうかって感じです。

でも、これが、テンプレートの良いところなんです。
自分でレイアウトを考え、バランスを決め、色を選んですべてのデザインを
イチから作っていたら、こうはいきません。 日が暮れます。
「■商品説明■」のところも同じ要領で、書き換えるコトが出来ます。



では、次に画像を入れてみます。
<TD WIDTH=117 HEIGHT=60 BGCOLOR="#CCFFFF">
<CENTER>
■画像■</CENTER>
</TD>
      ↓
<TD WIDTH=117 HEIGHT=60 BGCOLOR="#FFFFFF">
<CENTER>
<IMG SRC="http://plaza.rakuten.co.jp/img/user/49/28/5934928/101.jpg" width="108" height="60">
</CENTER>
</TD>

これも、「■画像■」という文字の代わりに、画像の置き場所(URL)を
置いただけです。
なーんて、手抜きなんでしょ!
この調子で、次々に置き換えていけば、あっさり完成します。

【今日のポイント】
1.テンプレートとはひな形である。
2.必要なところを書き換えるだけでよい。
3.最初から全部作るよりも、大幅な省力化が可能である。

この記事がおもしろかったと思う人は1票! クリック →
 おもしろかったらクリックしてね

この番組は、バカネコ村とバカネコ大学の提供でお送りしました。

次回はテンプレートをソフトで扱うときの裏技?を紹介します。




画面右上「日記リンク追加」をクリック、「◎追加する」ボタンを押すとこの日記がリンクできます。
子猫の里親募集にお力添えをいただける方、または、このサイトの新着記事の通知をご希望の方はご利用ください。



 






最終更新日  2004年09月14日 16時51分43秒
コメント(42) | コメントを書く

PR

バックナンバー

2019年08月
2019年07月
2019年06月
2019年05月
2019年04月

プロフィール


海獣トド

コメント新着

 海獣トド@ Re:意外な一面に触れて。(08/14) 泡雪さんへ >マザーテレサって本当にす…
 海獣トド@ うめぼしがキラリ☆さんへ >ひゃー、ブログさぼってる間にトドさん…
 海獣トド@ 鵜の岬さんへ >これからも・・ヨロシク・・ね こち…
 海獣トド@ sshijimisanさんへ >でも、トド様のおかげで少しの村民は救…
 海獣トド@ もぐらのこさんへ >日記の下書き機能残ってるよ(^-^) …
 海獣トド@ archfelisさんへ >せめて12日一杯残せばいいのに・・・…

Copyright (c) 1997-2019 Rakuten, Inc. All Rights Reserved.