システム屋日誌

情報システム構築、開発手法を中心に気が付いたことを書き留めます。ちいさなことから、おおきなことまで。もちろん、どうでもいいことも。。。
<< October 2017 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 >>
 
RECENT COMMENT
RECENT TRACKBACK
れいねっとHP
http://www.rey-net.com
MOBILE
qrcode
PROFILE
無料ブログ作成サービス JUGEM
 
ホームページが書かれている仕組みを知る方法
 ホームページのソースを見ると、そのホームページを生成している仕組みが分かる場合があります。

●チェック方法
ブラウザで表示している画面のソースを見ると、上部に <meta ...>  という記述があります。
この中に generator というキーワードの  content  にホームページを作るソフトウェアの名前や、システムの名称が書かれています。

例)<meta name="generator" content="Xoops" />

ただし、全てのホームページに書いてあるわけではありません。

●調査結果
ホームページを作っている仕組みをいくつか、調べてみました。

ウォールストリートジャーナル 日本版 http://jp.wsj.com/
eZ Publish で作られています。eZ Publish は、無料で使えるコンテンツ・マネジメント・システムです(サポート付は有料)。なんと、Microsoft word でも記事が投稿できるようなので、いずれきちんと調査してみたいと思います。

銚子電鉄:http://www.choshi-dentetsu.jp/
旭山動物園:http://www5.city.asahikawa.hokkaido.jp/asahiyamazoo/
IBM Homepage Builder作られています。
ホームページ製作用の市販のパッケージソフトでは、一番使いやすいし、
サンプルや参考書もたくさんあるのでおすすめです。

銚子電鉄も旭山動物園も、職員の声が聞こえる人間味のあるホームページです。


JUGEMテーマ:インターネット
世界一シンプルなブログを作るには
最近、ブログのテンプレートをカスタマイズしています。10分くらいあると、ちょっとだけ変更して遊んでます。変更するのは、主にテンプレート。ブログのデザイン部分です。ブログのテンプレートは、ホスティングサービスが提供しているブログのエンジンで違ってきますが、基盤に smarty という技術を使っているところが多いみたいです。ちなみに、このブログは、ロリポブログです。

●テンプレートの編集
テンプレートは、管理者ページで編集できます。
ブログのテンプレートが使いにくい場合、自分でカスタマイズ可能。
広告が出たり、レイアウトが使いにくい場合、テンプレートを編集して、自分の好みに変更できます。
私は、シンプルなデザインが好きです。なので、どちらかといえば、削り魔。
もし、書いたブログだけが出るブログを作るとしたら、以下のようにします。


<html>
<body>
<!-- BEGIN BlogBodyArea -->
{entry_description}
<!-- END BlogBodyArea -->
</body>
</html>


タイトルも、サイドバーも、カレンダーも。
何にも無いけど。
こんな風に出ます。

みほん

●文法解説

<html>             --- (1)HTML:HTML タグ
<body>             --- (2)HTML:BODY タグ
<!-- BEGIN BlogBodyArea -->   --- (3)smarty:BlogBodyArea ブロック
{entry_description}        --- (4)smarty:entry_description
<!-- END BlogBodyArea -->    --- (5)smarty:BlogBodyArea ブロック
</body>             --- (6)HTML:BODY タグ
</html>             --- (7)HTML:HTML タグ

●使われているタグ
テンプレートは、HTML タグと、smarty が混在しています。
HTML も、smarty も、基本的に、タグを入れ子にして使うので、タグは対になっています。
例えば、(1)と(7)はHTML タグのペア、(3)と(5)は BlogBodyArea ブロックのペアです。

●データを出力する部分
このテンプレートのデータに当たる部分は、たった1行。(4)の{entry_description} です。
ブログの文書は、smarty の{entry_description} という1行で、システムから読み込まれています。

●smarty と HTML
smarty は、ブログのエンジンを作るとき、独自に定義します。
つまり、別の会社が提供するブログとは文法とは、異なります。
それに対して、HTML は、国際標準です。

●smarty 共通仕様
paperboy&co.社が提供するブログは、大体同じ作りになっています。知っている限りでは。

ロリポブログ
チカッパ
JUGEM

これが、ほぼ、同じかな。

● paperboy&co.社って?
このブログも、私のHPもお世話になっています。
個人的に、ここの会社のファンです。
IT系の社長さんの多くが前面に自分を出しているけど。
paperboy&co.は寡黙な社長が黙々とよいサービスを提供しているところが、すばらしい。ロリポップレンタルサーバは、もう何年も使っています。性能要件などの制約が無い場合は、ホスティング入門に最適です。
ジオコーディング
最近、Google のWebサービスから遠ざかっていたけど。
Google Map を表示するアプリを制作する機会があり、久々にトライ。
おもしろいAPIが増えていました。

getLatLng() という関数です。
住所や店舗の名前を入れると、緯度経度が返ってきます。

最大の特徴は、あいまい検索ができること。
「新宿駅」「○○二丁目4−5」「○○2−4−5」どれもOK。
さらに、旧住所もある程度対応しているようです。

サンプルを作って試してみました。
60数行書くだけで、下記のような簡単な検索ツールを作ることができます。

サンプルコード(pdfファイルへリンク)

注1)【key】の部分は、Google でWebサービス用のキーを取得して下さい。
 無料ですぐ、取得できます。ただし、英文です。
 http://code.google.com/apis/maps/signup.html
注2) UTF-8 で保存して下さい。



【初期画面】
初期画面



【新宿駅の検索結果】
新宿駅の検索結果