エスキュービズム ラボ Blog http://labs.s-cubism.com/blog エンジニアの活動報告などなど Thu, 15 Dec 2011 12:21:33 +0000 http://wordpress.org/?v=2.5.1 ja 就活イベント・スケジュール管理iPhoneアプリを開発しました http://labs.s-cubism.com/blog/2011/12/15/238/ http://labs.s-cubism.com/blog/2011/12/15/238/#comments Thu, 15 Dec 2011 12:19:57 +0000 chizuru.maki http://labs.s-cubism.com/blog/?p=238

「会社なび/就職活動」が究極の就職活動支援iPhoneアプリを開発いたしました。

——————————————-
就活予定帳！企業＆イベント管理
詳細・ダウンロードはこちらから
——————————————–

■本アプリの概要

エスキュービズムは学生向けの就職活動支援事業として
「会社なび／就職活動」を運営しております。

「会社なび／就職活動」では複数アプリをリリースしており、
前回アプリは総合ランキング1位を獲得いたしました。

今回開発した「就活予定表！」は
会社説明会や面接など、就職活動に関わるイベントや
スケジュールの管理を簡単に行うことができるアプリです。

～12/31まで、期間限定の無料キャンペーンを実施しています。

■主な機能

他社のアプリを徹底研究して使い勝手を追求いたしました。

・面接や説明会、ESの締切日など就活のイベントをカンタンわかりやすく管理
・GoogleカレンダーやiPhone標準カレンダーと同期も可能
・Webサービスの「会社なび/就職活動」と連動しているので、
大量のデータ入力はパソコンからでもOK
・大量の企業マイページURL、ID、パスワードも管理できる
・ソニーも物産も電通も、有名企業はもちろん20万社を超える社名が予め登録済
・就活関連の他社アプリを徹底的に調査・研究して
「使いやすい」「使える」アプリに

※利用テストした就活生の声
「Googleカレンダーと同期するのが便利」
「他のアプリが使えなかったけど、これは使える」
「Androidはまだないんですよね？iPhoneで良かった(笑)」
「クリックした時の反応速度がハンパなく早い｣

※便利に使えるようにこのアプリはWebサービスと完全連動します。
そのためご利用いただくにはユーザ登録が必要です。

——————————————-
就活予定帳！企業＆イベント管理
詳細・ダウンロードはこちらから
——————————————–

人気企業や優良企業の就活情報を管理できる[就活予定帳！]iPhoneやGoogleカレンダーとも同期[就活予定帳！]

■「会社なび/就職活動」とは？

会社なび/就職活動は、「就活の不平・不満を全て解消する」ことを目指し、
就活に成功/失敗したOB・OGや内定者と一緒に創っているサービスです。
通過済みエントリーシートが見れるなど就活に便利なコンテンツを多数掲載、
企業側が学生にメッセージを送信する機能なども備わっています。

先日、【日経新聞】本誌にも取り上げられ、急激に利用ユーザ数が増えています。

会社なび/就職活動

http://sk.kaisyanavi.jp/

]]> http://labs.s-cubism.com/blog/2011/12/15/238/feed/ 「会社なび/就職活動」を現在、パワーアップ公開中 http://labs.s-cubism.com/blog/2011/10/17/236/ http://labs.s-cubism.com/blog/2011/10/17/236/#comments Mon, 17 Oct 2011 06:51:56 +0000 みー http://labs.s-cubism.com/blog/?p=236 弊社サービスの「会社なび/就職活動」を現在、パワーアップ公開中です。

先輩のエントリーシートが1,200枚以上登録されていて、無料でWebテストの対策や、新卒マイページの管理、最終面接で何が聞かれるかなど就活お役立ち情報が盛りだくさんです。

https://sk-media.kaisyanavi.jp/images/l-clm-img-ttl2.gif

今年はリクナビやマイナビなど就活系の大手サイトのオープンが 12月 になりましたが、すでに就職活動を始めている学生さんもけっこう多いと思います。

これからも機能を続々追加していきますので、ぜひ 会社なび を活用して就活を乗り切ってください。

会社なび/就職活動 で使える便利なアプリの数々をご紹介。

  • 先輩のES

エントリーシート総数1,200枚以上！設問内容によって絞り込み検索までできちゃいます。

  • 掲示板

登録20万社以上！試験何が出る？面接で何を聞かれる？貴方だけが知らないかも？

  • 試験対策

国内最多の練習問題、しかも全問に解説付き！不合格を回避！選考突破に試験対策は重要です。

  • 試験対策-外資

外資は全く別の対策が必要。問題を見たことがありますか？ 外資の対策も。

  • Webテスト

いきなり本番を迎えますか？模擬試験で慣れて就活を優位に進めよう。

  • ゲーム

似たような就活サイトにウンザリしてませんか？息抜きも必要です、気分転換にどうぞ

  • シュウちゃん＆カツくんの適職診断

iPhoneアプリ 総合No.1獲得！大ブレークしたアプリがWeb版になって再登場

  • 学歴早見表

大学に入学した年をすぐに言えますか？えっと何年だっけ？とならないようにお手伝い

  • メッセージ

見落としたセミナー、説明会情報ない？全国の魅力的な企業からメッセージが届きます。

まだまだ就活に役立つツールやコンテンツを準備中。

これだけ使っても利用料は無料！ 就活生の皆さんはぜひ日本一の就活サポートサイト「会社なび」を利用してください。

http://sk.kaisyanavi.jp/contents/flyer/images/flyer/btn-lp-entry.png

]]> http://labs.s-cubism.com/blog/2011/10/17/236/feed/ 「会社なび/就職活動」PR用のJSゲームアプリを作成しました http://labs.s-cubism.com/blog/2011/04/07/235/ http://labs.s-cubism.com/blog/2011/04/07/235/#comments Thu, 07 Apr 2011 08:15:12 +0000 ishii http://labs.s-cubism.com/blog/?p=235 弊社サービス「会社なび/就職活動」のPR用に、JavaScriptゲームアプリを作成しました。

面接ウォーズ ＜就活生の逆襲＞

良かったらプレイして見て下さいね！

mw-top
mw-top posted by (C)kjirou
　

　
・・・と紹介が終わったということで、
以下は技術的なお話になりますが

今回、普通Flashで作るべきものをJavaScriptで作ったのは、
「自分がJSの方が得意なので工数が掛からない」という点もさることながら、
何より「こういうゲームの類で、JSだとどこまで出来るのか確認したい」と言う点もありました。

以下、雑感書き殴りです。

Flashとまず比較される速度面については、
Chromeは滑らかに動きます。IE8では結構カクカク、Firefox3でもたまにカクッとなりますが、
jQueryを使用しつつ、ほとんど速度対応しないで作成してますので、
ちゃんとその辺の技術のある方が作れば、かなりマシになると思います。

描画関係は、canvasがあるとは言え、IEも含めて考えると
全く太刀打ちできません。

その他、各ブラウザが結局は各社のソフトなんだということを実感する不便さもありました。
例えば、トリプルクリックやドラッグなどのJSで制御できない挙動をされることで
思いがけない動きが出ることがありました。
例えば、IE8だと「Bingで検索」みたいなアイコンが出ちゃいます。

と、困ったのはその位でしょうか。

まだまだFlashには及ばないにせよ、
大昔にJSでゲームを作ったころに比べると、天国のような環境になってはいます。
ソーシャルゲーム程度のものなら、技術の将来性を含めないでも、
JSの方がいいんじゃねーかなーと、今今の結論ではそう思っています。

]]> http://labs.s-cubism.com/blog/2011/04/07/235/feed/ html5boilerplateに見る最近のHTML・CSSプラクティス http://labs.s-cubism.com/blog/2011/03/23/234/ http://labs.s-cubism.com/blog/2011/03/23/234/#comments Wed, 23 Mar 2011 01:02:40 +0000 hosoda http://labs.s-cubism.com/blog/?p=234 html5boilerplate(日本語サイト)は、HTML、CSS、JSのベストプラクティスを詰め込んだテンプレートを提供するサイトです。ここでは、そこで使用されているプラクティスの幾つかを紹介します。

modernizr.jsによるHTML5/CSS3の対応調査

Modernizrは、ブラウザがHTML5/CSS3の新機能に対応しているか否かを判別するjavascriptです。このスクリプトを置くと、htmlのトップ要素に新機能の対応結果を示すclassがページロード時に付与されます。CSSではその付与されたclassを利用して、新機能が使える場合とそうでない場合に分けてスタイルを書くことができます（参考サイト）。

例えば、boxshadow機能がブラウザで使えない場合、

<html class=”no-boxshadow …”>

のように、classがページロード時に付与されます。html5boilerplateでは、このclassを利用してフォームの検証属性用スタイルを次のように定義しています：

input:invalid, textarea:invalid {
border-radius: 1px;
-moz-box-shadow: 0px 0px 5px red;
-webkit-box-shadow: 0px 0px 5px red;
box-shadow: 0px 0px 5px red;
}
.no-boxshadow input:invalid,
.no-boxshadow textarea:invalid { background-color: #f0dddd; }

後半部の、.no-boxshadowから始まる部分がboxshadow機能が使えない場合のスタイルです。なるほど、これはスマートな方法ですね。

iPhone/iPadなどへの対応

html5boilerplateのテンプレートでは、モバイルビューポートを最適化するコードを次のように書いています：

<meta name=”viewport” content=”width=device-width; initial-scale=1.0; maximum-scale=1.0;”>

ビューポートは、iPhoneなどでの仮想的なウィンドウサイズのことです(参考サイト)。

また、iPhone/iPad用のアイコンも、通常のfaviconとともに指定しています：

<link rel=”shortcut icon” href=”/favicon.ico”>
<link rel=”apple-touch-icon” href=”/apple-touch-icon.png”>

最近は、このようなモバイル対応も重要になってくるのではないでしょうか。

IE対応

IEのバージョンごとにCSSのスタイルを変更するためには、htmlのトップ要素にそれを判別するclassを次のように付与しています。

<!–[if lt IE 7 ]> <html class=”no-js ie6″ lang=”en”> <![endif]–>
<!–[if IE 7 ]>    <html class=”no-js ie7″ lang=”en”> <![endif]–>
<!–[if IE 8 ]>    <html class=”no-js ie8″ lang=”en”> <![endif]–>
<!–[if (gte IE 9)|!(IE)]><!–> <html class=”no-js” lang=”en”> <!–<![endif]–>

ここで、<!–[if ...]><![endif]–>は、ブラウザ自身が解釈して条件分岐する部分です。ここでは、ie6、ie7、ie8というclassをそれぞれの場合にて付与しています（なお、それと同時に付与されているno-jsというclassは前述のmodernizrで利用されるものです）。

例えば、チェックボックス、ラジオボタン、テキストインプットをラベルと揃えるCSSは次のように書かれています：

input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
.ie7 input[type="checkbox"] { vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }

確かに、これは分かりやすいですね。

CSSヘルパ

html5boilerplateのテンプレートではまた、幾つかのCSSヘルパを用意しています。例えば、子要素のmargin-collapsingを防止するCLERFIXを次のように構築しています。

.clearfix:before, .clearfix:after {
content: “\0020″; display: block; height: 0; visibility: hidden;
}
.clearfix:after { clear: both; }
/* Fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page */
.clearfix { zoom: 1; }

CSS周りでは複雑怪奇な部分が潜んでますが、このような標準的なヘルパを利用し従っていくのがいいと思います。

【お知らせ】

共にこれからを切り開いていくエンジニアを募集しております。

C,C++,Python,Ruby,Fortran etc.

並列計算、データ解析、WEBサービス、各種シミュレーション、画像認識 etc.

思い立ったらぜひ一度 g_bizdev【アット】s-cubism.jp までメールをお送り下さい。

お待ちしております。

]]> http://labs.s-cubism.com/blog/2011/03/23/234/feed/ [CentOS5.5]KVMでのbridge接続設定方法 http://labs.s-cubism.com/blog/2011/01/17/233/ http://labs.s-cubism.com/blog/2011/01/17/233/#comments Mon, 17 Jan 2011 12:36:14 +0000 goto http://labs.s-cubism.com/blog/?p=233 過去にエスキュービズムの開発環境について書いたことがありましたが、弊社では社内の開発環境ではバリバリ仮想サーバを使っています。

昨年あたり、具体的にはCentOS5.4（たしかそうだったと思います）から、パッケージの標準モジュールとしてKVMが組み込まれたのを機に、XenからKVMへと仮想化手法を切り替えました。KVMはインストール時に選択するだけでサクッと入るため、非常に簡単なのですが、そのままでは使えないんです。

というのも、標準では子機は親機とのNAT接続しか許可されてないためです。

これでは仮想サーバをたくさん作っても、外からつなげませんよね。ということで、Brige接続の設定を行います。

アダプタの作成

まずは、ifcfg-eth0をもとにifcfg-br0を作成します。

cd /etc/sysconfig/network-scripts/
cp ifcfg-eth0 ifcfg-br0

ifcfg-br0の内容は以下のような感じ

DEVICE=br0
TYPE=Bridge
BOOTPROTO=static
BROADCAST=192.168.1.255
IPADDR=192.168.1.xxx
NETMASK=255.255.255.0
NETWORK=192.168.1.0
ONBOOT=yes

※IPアドレスはお使いの環境に合わせてください。

元々あったifcfg-eth0は以下のように変更します。

DEVICE=eth0
HWADDR=xx:xx:xx:xx:xx:xx
ONBOOT=yes
BRIDGE=br0

※HWADDRは初めから設定されているもののままでOKです
これでBridgeアダプタの作成は完了です。

NATアダプタの停止

ifconfigコマンドを叩いてみるとわかりますが、何もしなくても”virbr0″というアダプタが存在しています。こいつが親機と子機をつないでいるNATアダプタなので、止めてあげます。

virsh net-autostart default --disable
virsh net-destroy default

で、以下のコマンドを叩いてみて、br0だけが出てくればOKです。

brctl show

これでKVMで仮想サーバを作る準備は整いました。
「KVMはまだよくわかんないし…」と思っている方、これを機に試してみてはいかがでしょうか。

]]> http://labs.s-cubism.com/blog/2011/01/17/233/feed/ EXCEL集計関数の基礎 http://labs.s-cubism.com/blog/2010/12/16/231/ http://labs.s-cubism.com/blog/2010/12/16/231/#comments Thu, 16 Dec 2010 11:06:12 +0000 shingo.yonemoto http://labs.s-cubism.com/blog/?p=231 我々エンジニアと切っても切れないドキュメント作成で利用されるEXCEL
しかし、ドキュメントを作成し図形やピクチャを貼るだけがEXCELではありません。
これから先、忘年会・新年会でもEXCELを利用した名簿を作成など、知っておくと少しだけ得をする
EXCELの集計関数を今回は紹介します。

１、COUNTIF関数について
集計関数として基礎とも言えるCOUNTIF 関数。設定した条件が”真”となる値を数値として表示してくれる機能です

上記のような出欠表があります。

この程度の表であれば目視で十分かもしれませんが、これが100人200人単位になった際に

果たして目視のみで出欠を正確に判断出来るか。そんな時に使うと便利な関数がCOUNTIF関数です。

※使い方

検索の値（つまり出席か欠席か）を表示したいセルにカーソルを合わせ、数式バーに

= COUNTIF(出欠列(山田) : 出欠列(木下)  ,  ”出席/欠席”)

出欠列がB、山田が2から始まるとすると　B1:B6

また出欠席を出席とすると　= COUNTIF(B1:B6, “出席”)

と言う風になります。結果は４が返ってきます。

ただし、前途した通り”一意”であれば問題は有りません。

では、例外として次のような場合はどう対処すべきでしょうか。

上記の表を使って出席欠席以外の人間が何人居るのかを把握しようと思います。

この場合、上記でも書いています通り出席欠席以外の人を検索する為にはどうすれば良いか。

ここで使われる関数として、SUMPRODUCT関数を利用すると簡単に計算する事が出来ます。

= SUMPRODUCT (( 条件１) * (条件２) ・・・)

ここで重要になってくるのは、出席”以外” かつ 欠席”以外”の両方の条件を満たしているデータを抽出しカウントしてくれます。

= SUMPRODUCT(  (出欠列.山田 : 出欠列:種子島 <> “出席”) * (出欠列.山田 : 出欠列:種子島 <> “欠席”))

このように書く事が出来ます。

結果は、出席もしくは欠席以外のカウントですので7が表示されます。

EXCELの関数は、いわゆる『プログラミング言語』とは少し違い、ある程度の型枠が出来ています。

この型枠に沿った入力と条件を付ける事により便利な使い方が出来るようになります。

突き詰めていけば、マクロになってしまう訳ですが、あくまでもシンプルで簡素化された関数だからこそ

その関数を組み合わせ易く、応用していけば色々な事に役立てる事が出来ます。

突き詰めれば、このシンプルさを開発に、果てはお客様にどう提供していけるか。

誰もが使い易い。

言葉にしてみると凄く簡単かもしれませんけど、凄く難しい事でもあります。

しかし、我々エンジニア陣はその難しいことに常にチャレンジし続けたいと思っています。

]]> http://labs.s-cubism.com/blog/2010/12/16/231/feed/ URIの仕様と設計について http://labs.s-cubism.com/blog/2010/12/16/226/ http://labs.s-cubism.com/blog/2010/12/16/226/#comments Thu, 16 Dec 2010 04:49:56 +0000 fumihiko.yokoyama http://labs.s-cubism.com/blog/?p=226

仕様について


URI(Uniform Resource Identifier)とはリソースを統一的に識別するＩＤのことです。(RFC3986)


使用できる文字は、ascii。ascii以外を使用するなら%エンコーディングが必要。
アルファベット A-Za-z
数字 0-9
記号 -,~’!$&’()


URIでは一般的に、アルファベットの大文字と小文字は区別して扱われますが、
%エンコーディングで使用する文字列は大文字でも小文字でも同じ意味を持ちます。
(URIの仕様では、大文字を推奨しています。)
長さ制限はRFC上では特にありません。



URIの構文は以下の例のとおり。

例) http://user:pass@test.example.jp:8000/search?q=demo&debug=true#n10

  • ユーザ情報：user:pass
  • URIスキーム：http
  • ホスト名：test.example.jp
  • ポート番号：8000
  • パス：/search
  • クエリパラメータ：q=demo&debug=true
  • ＵＲＩフラグメント：#n10

以上は絶対URIですが、以下のような相対URI も存在します。

/foo/bar

相対URIはその解決のために、起点となるベースURIが必要です。

例) http://example.jp/foo/bar/

相対URI →　解決後

  • hoge　→　http://example.jp/foo/bar/hoge
  • ../../hoge　→　http://example.jp/hoge
  • ?q=hoge　→　http://example.jp/foo/bar?q=hoge
  • /hoge/fuga　→　http://example.jp/hoge/fuga


ベースURIの与え方には以下の二通りがあります。
  • リソースのURIをベースURIとする方法
  • ベースURIを明示的に指定する方法
リソースのURIをベースURIとする方法は直感的でわかりやすいのですが、リソースのURIをクライアント側で保存しておかなければなりません。
これは、たとえばwebページをhtmlとして保存した時に元のURIがわからず、そのhtmlファイルに含まれている相対URIも解決できないためです。


一方で、明示的に指定する場合は以下のとおりです。

HTMLの場合は
<html>
<head>
<title>test page</title>
<base href=”http://example.jp/” />
<head>
</html>
でこの文書内のベースURLはhttp://example.jp/になる。


xmlの場合は
<foo xml:base=”http://example.jp/foo“>
<!–ここのベースURIはhttp://example.jp/foo –>
<bar xml:base=”http://example.jp/foo/bar“>
<!–ここのベースURIはhttp://example.jp/foo /bar –>
</bar>
</foo>
となる。


設計について


URIを変わりにくくすること。


言語に依存した拡張子やパスを含めない
例) http://example.jp/cgi-bin/login.pl
例) http://example.jp/servlet/LoginServlet


メソッド名やセッションIDを含めない
例) http://example.jp/Login.do?action=showPage
例) http://example.jp/home.jsp?jsessionid=123456


リファクタリング等で変更される可能性がある要素をURIに含めないよう設計することで
URIが変わりにくくなるだけでなく、ユーザビリティの向上にもつながります。


URIは情報資源の場所を指し示すものであり、WEBページの住所であると思います。
覚えてもらいやすく、変わることのない設計を心がけたいものです。
]]> http://labs.s-cubism.com/blog/2010/12/16/226/feed/ UMLあれこれ http://labs.s-cubism.com/blog/2010/12/14/225/ http://labs.s-cubism.com/blog/2010/12/14/225/#comments Tue, 14 Dec 2010 02:19:37 +0000 masanori.abe http://labs.s-cubism.com/blog/?p=225 UMLをご説明する前に、オブジェクト指向についてご説明いたします。

オブジェクト指向とは、オブジェクト同士の相互作用としてシステムの振る舞いを
とらえる考え方です。

ソフトウェアでも利用されており、Java、C++、C#などのプログラミング言語は
オブジェクト指向言語と呼ばれています。

オブジェクトとは、一般的な意味は、物体（本、椅子、時計など）、
対象（読む、座る、触るなど）を指しますが、抽象概念ではなく、より具体的に
示した事象を指します。

以下の４つの特性を備えたものをオブジェクトと呼びます。

１．固有の属性（オブジェクト固有の性質）を持つ。
２．固有の振る舞いを持つ。
３．他のオブジェクトと関連する。
４．固有のアイデンティティ（個性）を持つ。

さて、上記を踏まえて本題のUMLについてご説明したいと思います。

UMLとは、統一モデリング言語（UML: Unified Modeling Language）の略で
オブジェクト指向開発に使用するモデル表記法を標準化したものです。

ダイアグラムを使用して開発に携わる人たちがコミュニケーションを行える
ようにします。

近年、オブジェクト指向設計などのプロセスでUMLを使用するのが一般的に
なってきています。

モデルとは、対象をある目的と視点で捉えて単純化したものを指します。
ダイアグラムとは、UMLに規定されている図のことです。

UMLに規定されているダイアグラムについて説明いたします。

・ユースケース図
　→システム全体機能を表現した図。
　→システム利用者を表す「アクター」とシステムの機能を表す
　　「ユースケース」の関連を表す

・アクティビティ図
　→複数のユースケースに跨るワークフローや、各ユースケースのイ
　　ベントフローを表現する。

・クラス図
　→クラス同士やクラスとオブジェクト間の関係を静的に表現したもの。

・オブジェクト図
　→クラスを実体化して生成されたオブジェクト同士の関係を表現する 。

・シーケンス図
　→メッセージによるオブジェクト間の協調動作を時系列に注目して表現する。

・コラボレーション図
　→メッセージによるオブジェクト間の協調動作をオブジェクト間の関係に
　　注目して平面的に表現する。

・ステートチャート図
　→ある特定のオブジェクトに注目し、その状態の変化を表現する。
　→オブジェクトの生成から消滅までのライフサイクルを表現することができる。

・コンポーネント図
　→ソースコードや実行可能プログラムのプログラム間の依存関係を表現する。

・配置図
　→サーバ、PCなどハードウェアのネットワーク接続を表現する。
　→コンポーネント図と併用して、どのマシンにどのプログラムを配置するのかを
　　表現できる。

UMLを用いることでオブジェクト指向の分析や設計技術のスキルを向上することができます。
Microsoft社やIBM社、Oracle社などの大手企業が支持を表明しています。

]]> http://labs.s-cubism.com/blog/2010/12/14/225/feed/ 自律分散システムをチョコっと眺めてみる？ http://labs.s-cubism.com/blog/2010/11/18/223/ http://labs.s-cubism.com/blog/2010/11/18/223/#comments Thu, 18 Nov 2010 09:48:57 +0000 akimitsu.hamaguchi http://labs.s-cubism.com/blog/?p=223

自律分散システムをチョコっと眺めてみる？ on Prezi

by H

]]> http://labs.s-cubism.com/blog/2010/11/18/223/feed/ 文字コードについて http://labs.s-cubism.com/blog/2010/11/17/222/ http://labs.s-cubism.com/blog/2010/11/17/222/#comments Wed, 17 Nov 2010 14:32:04 +0000 keita.nomura http://labs.s-cubism.com/blog/?p=222 webエンジニアなら誰もが知ってる、そしてしばしば悩みの種。それが文字コード。

実際のところ、webアプリを作るに際して、文字コード関連の知識は初期段階では必須じゃないと個人的には思ってます。アプリよりも低レイヤーの話ですし。PHPであれば「LAMP環境で全部UTF-8にすれば何も問題ないじゃん？」と言われたらExactly、その通りでございます。

でもやっぱりエンジニアたるもの、基礎も理解しておきたいよね！ということで、全ての始まりであるASCIIコードと共に、文字コードの基礎の基礎のそのまた基礎をお勉強してみようと思います。


文字コードってそもそも何？

まず「符号化」をご存知でしょうか？

正確な定義についてはこちらをご覧いただくとして、ここでは簡単に
「文字と対応するbitの組み合わせを規則化する事」とします。
…これだけじゃ訳が分からないですね。以下、もうちょっと詳しく。

コンピュータ上の情報の最小単位＝1bit(0/1)ですが、
例えば「0は”A”を表示させ、1だったら”B”を表示させる」と決めると、2文字を表現できます。
1bit＝2文字ってことになります。

3bitあれば

A 000
B 001
C 010
D 011
E 100
F 101
G 110
H 111

と、2^3=8文字を表現できます。これが文字コードであり、「文字を符号化する」という事に
なります。文字コード=文字コード「表」と言い換えれば多少分かりやすいかもしれません。

符号化について何となく分かったところでASCIIの話です。

とりあえず英語が表現できればいい！って事で当時のエンジニアが7bit=128パターンの
文字コード=ASCIIを考案しました。

1byte=8bitなのに残り1bitはどこ行ったって話ですが、ASCIIの先頭1bitは0で固定です。
コード表はこちら。bit列と文字の結び付きが分かると思います。
何となく、ざっくりと、文字コードのイメージが掴めましたでしょうか。

地球上の言語が英語だけならこれで終わってめでたしめでたしなんですが、当然ながら
様々な言語に対応する必要が生じてきます。英語に近い西ヨーロッパ系言語であれば
ASCIIの記号部分を各言語の固有文字に置き換えたASCII拡張コードの開発によって
何とかなったりしたんですが、やがて「一つの文書内で複数言語を表現できない」
とか、「数万種類ある漢字はどうすんだよ」等の問題が発生してきます。

なのでASCII以後は8bitの文字コードや、8bitを複数組み合わせたマルチバイト文字等が
続々開発されてゆき(ISO-2022とかUnicodeとか)今日に至るという寸法です。

文字コードに関して掘り下げると、コンピュータの歴史を紐解くような感じになって
参考ページや文献を読み込むと中々興味深かったりします(難解で眠くなる事も多々ありましたが)。

「ISO-2022-JPとJISってどう違うの？」とか
「UTF-8とUnicodeって厳密には別の事らしいよ？」
などといった話を見たり聞いたりした方は多いと思いますが、スクリプトの処理系やDBMS等といった
ミドルウェアが吸収してしまう事なので、きちんと理解している人は少なく(私も含めて)、
それだけに、文字コードに関する深い知識をお持ちの方は、それだけで「こいつ、できる！」と
周囲に思わせるエンジニアと言える、…かもしれません。

この記事をきっかけに、普段何気なく使ってる文字の中身を覗いてみてはいかがでしょうか。

]]> http://labs.s-cubism.com/blog/2010/11/17/222/feed/