TOPへ戻る  開発歴へ戻る

WEB版の開発

 iPhoneでもsafariを使えばWEBサイトを見ることはできますが,文字の大きさやレイアウトなどの点で,必ずしも見やすいとは言えません。WEB版ではその点をiPhoneに合うように工夫するつもりです。

2011年5月

2011/05/29 タイトル画面を作成

1.タイトル画面 2.カウンター設置画面
http://iphone.saloon.jp/image/KJminiDicV01B.png http://iphone.saloon.jp/image/KJminiDicV02B.png

現段階では,検索窓に文字を入力して検索ボタンをクリックすると,検索窓に入力された文字をそのままアラート画面に表示するだけです。
ハングルを入力すればそのままハングルが表示されます。
全体のスタイルはcssファイルで定義しています。
SafariとChromeでは,タイトルバーがきちんとグラデーションで表示されますが,どういうわけか,IEとFirefoxではうまく表示されません。従って韓日小辞典というタイトルも灰色の地に白文字なのでほとんど読み取れません。(当面の対策として文字を明るい緑にしました)

⇒実際のタイトル画面にジャンプ

00001.cssの定義解説
00002.html本体解説

ページTOPへ戻る

2011/05/30 カウンターを設置

ファイルの拡張子をphpにし,[戻る]メニューの横にカウンターを設置しました。
カウンターのルーチンもphpで記述しています。

⇒カウンター設置画面にジャンプ

00003.カウンターを設置解説

ページTOPへ戻る

2011年6月

2011/06/02 コードの変換

3.コード変換画面 4.インデックスファイル決定画面
http://iphone.saloon.jp/image/KJminiDicV03B.png http://iphone.saloon.jp/image/KJminiDicV04B.png

ハングルを入力すれば,それを10進数で表記したUnicodeに変換して表示します。
ただし,ハングルが入力されることを想定してプログラムを組んであるので,ハングル以外の文字を入力すると正しく変換されません。
コード変換に際しては,以下のサイトを参考にしました。
「本当は怖い文字コードの話:第4回」 http://gihyo.jp/admin/serial/01/charcode/0004

⇒コード変換画面にジャンプ

00010.コード変換が必要な理由
00011.入力データの受け取り
00012.コード変換のアルゴリズム

2011/06/04 インデックスファイルの決定

10進数で表記したUnicodeに基づいて,検索すべきインデックスファイルを決定します。

⇒インデックスファイル決定画面にジャンプ

00021.インデックスファイルを利用する理由
00022.インデックスファイル決定のアルゴリズム

ページTOPへ戻る

2011/06/09 エディターについて

 大切なことを書き忘れていました。
 Webサイトを構築するには,エディターが必要です。ワープロソフトを流用することで済ませることもできないわけではありませんが,起動や文書の保存に時間がかかったり,プログラミングをする上で不必要な動作をすることが多く,エディターを準備するほうがお勧めです。
 市販のエディターやフリーのエディターの中には優れたものがたくさんありますが,重要なポイントは,ハングルの入力が可能なものでなければなりません。ハングルが入力できないエディターしか準備できなければUnicodeを直接書き込むという方法もありますが,視認性が非常に悪いのでお勧めできません。例えば,次のコードが何を表しているのかすぐにわかる方はいらっしゃらないと思います。

 <例>&#52264;&#48324;&#51060;&#45208; &#54200;&#44204;&#51060;
&#46972;&#44256; &#54616;&#45716; &#44163;&#51008; <b>&#47924;&#51648;
&#44032;</b> &#47564;&#46308;&#50612;&#45236;&#45716; &#44163;&#51004;
&#47196;, &#44536;&#44163;&#51012; &#46832;&#50612;&#45336;&#44592;
&#50948;&#54644;&#49436;&#45716; &#44277;&#51316;&#54616;&#45716;
&#44600;&#48150;&#50640; &#50630;&#45796;. (教保0505, p.40)

 一番手っ取り早くすませるにはMacであればテキストエディター,Windowsであれば標準で備わっている「メモ帳」を利用することです。これらのエディターは,ハングルの入力が可能です。
 通常のワープロソフトとほぼ同じ操作法なので,ここでエディターの使い方を解説することは致しませんが,保存の際にはデフォルトのANSIではなく,必ずunicodeまたはutf-8で保存してください。

2011/06/10 インデックスファイルの作成

Web辞典の見出し語だけを集めたファイルをインデックスファイルと呼びます。
今回のミニ辞典では,インデックスファイルとして,次のような構造を設定することにしました。1つの見出し語に対して1つのファイルを割り当てることを意味しています。

(注:先頭の<>は全角で書いてありますが,正式には半角です)

<>가<>ga.txt<>
<>가게<>gage.txt<>
<>가게1<>gage1.txt<>
<>가게2<>gage2.txt<>
<>가까이<>gaGGaqi.txt<>
<>가깝다<>gaGGabda.txt<>

 もちろん,これ以外の構造もありうるわけで,いくつかの見出し語を1つのファイルに書き込むことも可能です。その場合にはファイル名の後に見出し語の識別記号を付けます。例えば,次のようになります。

<>가<>ga.txt<>ga<>
<>가게<>ga.txt<>gage<>
<>가게1<>ga.txt<>gage1<>
<>가게2<>ga.txt<>gage2<>
<>가까이<>ga.txt<>gaGGaqi<>
<>가깝다<>ga.txt<>gaGGabda<>

 もう一つ注意すべき点があります。Unicodeあるいはutf-8で保存する際には,「BOM無し」というモードにしておく必要があるという点です。それを選択できない場合には,ファイルの先頭にダミーデータを入れておく必要があります。そうしないと,先頭の見出し語が検索できなくなります。ダミーデータとは次のようなもので十分です。

<>dummy<>dummy<>dummy<>

2011/06/07 インデックスファイルの読み込み

検索枠に入力された単語に基づいて決定したインデックスファイルを読み込みます。

5.インデックスファイルの読み込み
http://iphone.saloon.jp/image/indexFileV2.jpg


⇒インデックスファイル読み込み画面にジャンプ

00023.インデックスファイルの読み込みモジュール

ページTOPへ戻る

2011/06/11 インデックスファイルの検索

検索枠に入力された単語がインデックスファイルの中に含まれているか否かを判定します。

⇒インデックスファイル検索プログラムにジャンプ

00024.インデックスファイル検索モジュール解説

ページTOPへ戻る

2011/06/12 辞書データの読み込みと表示

6.辞書データの読み込みと表示 7.データが存在しない場合の表示
http://iphone.saloon.jp/image/gadaV2.jpg http://iphone.saloon.jp/image/NodataV2.jpg


辞書データの表示プログラムは非常に簡単です。
検索枠に入力した単語がインデックスファイルに含まれていれば,その単語に対応するファイルを読み込んで内容を全て表示するだけです。辞書データのファイルはutf-8またはUnicodeで保存しておかねばならないことは言うまでもありません。
辞書データのファイルはHTMLのタグを使用できるので,文字の色を変えたり,ボールドで表示するなど,フォントの指定ができるだけでなく,URLエンコードを利用したジャンプ先の指定も可能です。
なお,見出し項目だけが存在して,内容を記述したファイルが存在しない場合は,「データ準備中です」と表示されます。

⇒辞書データ表示プログラムにジャンプ

00025.辞書データの読み込みと表示モジュール解説

ページTOPへ戻る

2011/06/13 前後の項目の表示

8.前後の項目の表示
http://iphone.saloon.jp/image/ZengoV2.jpg


紙媒体の辞書は,検索したい単語だけでなく,見開きのページをざっと眺めることができます。この点,Web辞典は一覧性に欠けるので,それを補うような手立てを考えておく必要があります。
韓日ミニ辞典では,項目を検索するために読み込んだインデックスファイルを利用して,辞書データの表示内容を挟み込むように,前後の5項目ずつをURLエンコード付きで提示することにします。つまり,下線付きで表示されるので,それをクリックすれば当該の項目にジャンプします。

⇒前後の項目の表示プログラムにジャンプ

00026.前後の項目の表示モジュール解説
前項の「辞書データの読み込みと表示モジュール」に少し追加します。

ページTOPへ戻る

2011/06/15 前後の項目の拡張表示

前項では,検索された項目が含まれているインデックスファイルに登録されている範囲内で,前後の項目を5個ずつ表示する仕様になっていました。この方式はプログラムが簡単に組めるのですが,パッチムの部分が変化して,インデックスファイルが変わると表示できません。
そこで,最初の項目と最後の項目の場合には,次のインデックスファイルを検索する仕様に拡張することにしました。

⇒前後の項目の拡張表示プログラムにジャンプ

ページTOPへ戻る

予定 同綴語と同形異語

予定 形態素解析1(体言+助詞の場合)

予定 形態素解析2(用言+語尾の場合)

アプリ版の開発


トップ   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS