事業内容
ごあいさつ
私たち ITプロデュース熊本は、“Today for Tomorrow”をモットーに熊本で頑張るナイスミドルたちです。
CSSが使えなかった頃と比べると、構造（HTML）と見た目（CSS）が分離されているので、かなり保守は楽になりました。
それでも欲が出てくるもので、CSSは何かと面倒。
CSSのここが面倒
例えば、入れ子になった要素に属性を指定するとき。
div#container
{
・・・
}
div#container div#left-area
{
・・・
}
div#container div#left-area div.widget
{
・・・
}
↑のような記述を書いていると、イライラしてきます。
特に、後からクラス名やIDを変えた時に、全部変えないといけないのが嫌で嫌でたまらない。
あとは、色とか文字の大きさを変えるとき。それこそ、あちこちに散らばっているので、面倒極まりない。
SASS を試してみた
SASSを使うと、上述のCSSは↓のように入れ子構造で書けます。
div#container
{
・・・
div#left-area
{
・・・
div.widget
{
・・・
}
}
}
他にも、変数が使えたり、関数（っぽい記述）が使えたりと、少しでもプログラムが組める人ならば、CSSに抱いていた不満がかなり解消されると思います。
SASSの文法に関しては、「続きはWEBで」ってことで、ここではWordPressに導入した時の注意点を。
プラグイン：WordPress SASS
WordPress SASSというプラグインを使いました。
基本はプラグインの説明ページ（英語）の通りにやればいいのですが、なんだか改行が入っていなくて読みにくいのでそのままでは動きませんでした。
注意1 : function.php に書く記述
説明ページに書いてあるコードは改行が入っていないので、そのままでは動きません。正しくはこう。
// Enables SASS to CSS automatic generation
function generate_css()
{
if(function_exists('wpsass_define_stylesheet')) wpsass_define_stylesheet("style.scss", "style.css");
}
add_action( 'after_setup_theme', 'generate_css' );
注意2 : style.css のパーミッション
説明ページには775にしろって書いてあるけど、環境によってはNG。今回導入したサーバでは、Apache君が書き込みできるようにしておく必要があります。今回入れたところはApacheが別のユーザで動いているので、所有者をApacheユーザにしたうえで、644 。
注意3 : SASSの文法
どうもSASSの記述法には何種類か（少なくとも2種類）あるみたい。
初めにここの記述を試したがまったく動かない。設定が間違えているのかと思い、何度も見なおしたけど原因が分からなかった。
でも、ここの書き方だと、すんなりと動いた。
世の中猫も杓子もスマートフォンのような風潮ですが、アクセス解析を見るかぎりではまだまだ携帯電話（いわゆるガラケー）が圧倒的に優勢です。
当然、サイトを作る際にも携帯電話を無視するわけにはいかないので、携帯用にもページを作ります。
HTTPリクエストの UserAgent を見て PC 用のページと 携帯用のページを切り替えるようにしているのですが・・・。
困ったこと
困ったことがいくつか出てきました。まずは、今回のケースでやりたいことを書いておきます。
- 携帯電話専用ページにしたいので、PCからアクセスがあったら QRコードのページへリダイレクトする。
- 携帯電話からのアクセスだったら、コンテンツを表示する。
- 検索エンジンからも利用者を誘導する。
これらのために、携帯 or PC での振り分け、QRコード作成＆リダイレクト、検索エンジンへの登録、を行ないました。
PCでアクセスすると、期待通りQRコードのページへとリダイレクトされ、そのQRを使って携帯電話で目的のページにアクセスできました。
携帯電話で、URLを入れてアクセスすると、これも期待通り目的のページが表示されました。
ところが、検索すると思った通りになりません。
まず、検索結果の中身が、リダイレクト先（QRコード表示用ページ）になっていました。これでは中身に何を書いても検索キーワードに反映されません。
また、検索結果をクリックすると、Google や Yahoo が（勝手に）携帯電話用に変換してしまう。ずっと下の方にある「ページを直接表示する」で、目的のページを表示できるものの、そんなことをしてくれる一般ユーザはまずいないだろう。
問題点
1つ目の問題点は「検索エンジンが（目的のページではなく）リダイレクト先のページをクロールしている」こと。
2つ目は「元々携帯電話用に作ったページなのに、GoogleやYahooが携帯電話ように変換してしまう」こと。
これは携帯用のページだ！
2つ目はわりとあっさりと解決。Google に説明があったので、コレの通りにしました。
この指定は（同じエンジンを使っているから当然ですが）Yahooにも効果がありました。
リダイレクト前の内容をクロールしろ！
ページのリダイレクトに、meta タグの redirect 要素を使っていたのですが、どうやら検索エンジンはこの要素をたどってくれるらしい。
ほとんどの場合はその方が好都合なのですが、今回のケースでは余計なお世話。
そこで、どうやら「検索エンジンはJavaScriptを無視する」らしいことを利用して、JavaScript( location.href ) でリダイレクトするようにしました。
解決
以上の対策で、目的が達成できました。
Google+ の写真保存容量が実質無制限なのをいいことに、写真や動画をどんどんアップロードしています。
順番が変えられない？
で、ちょっと不満だったのが、写真の順番が変えられないこと。と、アルバムの順番も変えられないことも。
特にアルバム順が変えられないのが不便でした。
というのは、子供の宿題で「自分が生まれてから小学校に入学するまでの写真」が必要なので、「見ながら選ぼう」となったときに、とっても探しにくい。
アルバム内の写真はアップロードした順。アルバムの順番はアップロードした逆順（新しい順）になります。
撮影した順にアップロードしているわけではないですから。
Google+ ではこの順番を変えるための指定が見当たらない。
Picasa で並べ替え
で、思い出したのが Google+ Picasa WEB アルバム サービスと連携していて、写真は Picasa に保存されているということ。
Picasa にログイン（GoogleのアカウントでOK）してみると、Google+ で作ったアルバムがずらり。
まず、マイフォト→編集したいアルバム を開きます。
そして、整理 メニューをクリックすると、写真の順番を変えられます。日付順/逆順と名前順もできますし、ドラッグアンドドラップで好きな順にも並べられます。並べ終わったら 完了 ボタンで保存。
次に、操作→アルバムプロパティ。プロパティの中に日付の項目があるので、これを任意の日付（普通は写真を撮った日。写真をクリックすると右側に情報が表示される）にします。Google+のアルバム表示は、このアルパムプロパティの日付の降順に並ぶので、ここを調整すればアルバム表示順も変えられます。
ついでに、操作→アルバムカバー で、アルバム表紙（サムネイル画像）となる写真も選べます。
操作メニューでは、他にも写真を地図に関連付けできたり、コメントをつけたりできます。
不満
このようにして目的は達成できたものの、Google+ に Picasa へのリンクがないため、ふつう気が付かないし、気がついてもいちいち Picasa を開いて変更するのはとても面倒。
なるべくなら、Google+ 内で変更できるか、Picasa にシームレスに移動できるようにしてほしい・・・。
年末年始にかけて、ようやくWordPress を 3.1系にアップグレードしました。
このタイミングになったのは、最新のWordPressにするには、PHPやMySQLもアップグレードしなければならなかったため。
事前に調べてみたら、一筋縄ではいかなそうだったので、いざという時に時間的な余裕のある年末年始にやりました。
結果、思ったほどのトラブルはなく、お客様のWordPressもアップグレードできました。
メディアアップローダが便利に
写真なんかをアップロードする機能が、かなり便利になっており、これだけでもアップグレードする価値があったというものです。
具体的には、ドラッグ・アンド・ドロップでファイルをアップロードできるようになりました。HTML5の恩恵ですね。
Google+がよく比較されるのは、Facebook と Twitter ですかね。
サークル
どれも一長一短なのでしょうが、Google+ が他とちょっと違うのが、「サークル」の概念。
Google+ では投稿（メッセージや写真など）を「誰に見せるか」自由に決められます。
Twitter だと投稿した内容（ツィート）は基本的に「誰でも」見ることができます。それで、いろんな人と繋がっていきましょう、っていうコンセプトなのでしょう。
Google+ の場合は、どのサークルの人が見られるようにするか（or 誰でも見られるようにするか etc.）を投稿時に決められます。もちろん人をどのサークルに入れるのかも自分で決められます。
家族のサークルをつくってみた
そこで、家族全員のアカウントを作り、家族のサークルを作りました（子供は規約上アカウントを作れないので、親が代理で作りました。GoogleのCMと同じ要領です）。
家族の写真やビデオを投稿し、家族サークルだけに公開するのです。
自分が撮影した写真やビデオは自分のアカウントで、子供が撮影したものは子供のアカウントでアップロードします。
感想なんかも、それぞれのアカウントでコメントをつけていきます。
（こんな風に同時に複数アカウントでログインするには Google Chrome 16以降のマルチユーザ機能が便利）
実質容量無制限
実は Google+ に写真をアップロードすると、自動でそれなりのサイズにリサイズされて保存されます。「それなり」というのは、容量制限にカウントされないサイズ（たぶん時代と共に大きくなると思うので具体的な数字は書かないでおきます）。それでも十分にキレイ（最近のデジカメが無駄に高画質すぎるのですよ）。つまり、実質無制限に写真を保存できるのです。
動画もある程度の長さまではカウントされません。執筆時点では15分で、これだけあれば通常のホームビデオなら十分すぎるくらいです。
Facebookではリスト
Facebook でも最近、リストという機能が加わり、同等のことができるようです。
でも、Google+に過去の写真をアップロードし始めちゃったし・・・。当分は家族のアルバムはGoogle+で運用していこうと思います。
あるお客様の案件で、 SugarCRM をカスタマイズ中です。
SugarCRM は無料で使えるオープンンソースのCRM（顧客管理システム）です。サポートや追加モジュールのある有償版もあります。
特にカスタマイズしなくても、一般的な顧客管理の機能は使えるようになっているようです（今回の案件が一般的なものと離れているので試していませんが・・・）。
日本語ドキュメントが少ない
困ったことに、日本語ドキュメントが非常に少ない。
冒頭のリンク（日本語コミュニティ）と @ITの記事くらいです。
もうちょっと日本語の情報が増えるといいな、と思うので、弊社でも微力ながらカスタマイズTipsを（少しずつ）書いていき（たいなーと思ってい）ます。
カスタマイズ方法に統一感が・・・
さて、カスタマイズしてみている感想です。
まだ触り始めたばかりなので、あくまでも第一印象。もしかすると、慣れればこれが最適な設計なのかもしれません。
まず、カスタマイズのやり方に統一感がないように感じています。
ある機能はカスタマイズ用のディレクトリにソースを置く（アップグレードセーフ：将来システムを更新しても、カスタマイズが上書きされないような設計になっている）ようになっています。が、別の機能は元のフォルダのソースを触る必要がある。
デザインテーマごとにナビゲーションメニューを表示するしくみが違う。
などなど。
完成度は高い
とはいえ、完成度は非常に高いソフトだと感じています。
特に、モジュールにリレーションを指定したときに、何もコードを触らなくてもまったく矛盾なく動く画面が自動生成されるなど、感激しました。
（その分、逆にコードを触らざるをえないときに分かりにくいのかも・・・）
せっかくなので、（今度はもうちょっと一般的な顧客管理システムとして）、提案していきたいと思います。
とあるお客様からの相談で、「（Webサイトの）画像をクリックしたら、声が流れるようにしたいけど、できるものですかね？」という案件をいただいていました。
その当時は、私たちとは別の業者さんがサイト管理をされていたので、あまり深入りせずに「できますよ。今は私がサイトを触るわけにはいかないので、声の録音方法と、業者さんに送る方法を教えますね」程度の対応に留めておきました。
確かに要求事項はクリアしているけど・・・
数日後、件のお客様から「お陰さまでできました」と連絡があり、そのページを見せてもらいました。
殺風景なプレイヤー
画像をクリックすると、別ページに遷移して殺風景なプレイヤーが表示されて声が流れ始めました。ファイルのダウンロード速度もやや気になる。
参考のためにコードを見てみると、お客さんが送ったwavファイルに a タグでリンクを張っているだけでした。HTML5対応のブラウザならば内蔵プレイヤーで、そうでなければプラグインのプレイヤーで再生されるわけです。
うーん、確かに「画像をクリックしたら声が流れる」という要求はクリアしているし、お客さんも文句はないみたいだけど・・・。本当にこれでいいのか？
今回の要求の意図しているところって、「見ている人が画像（サイト主の顔のイラスト）をクリックしてみたら、声が出てきてびっくり」みたいな遊び心＆いたずら心なんじゃないかと思うのですよ。少なくとも、私はそう受け取りました。
それが、ページは遷移しちゃう（声の主のイラストが見えなくなる）わ戻るボタンを押さなきゃいけないわでは、仕掛けの魅力が半減ですよ。
ある案件で、Excelシートを全自動で作る必要が出ました。
まあ、その程度はVBAで解決・・・、と思ったら、条件付き書式に指定した式がずれてしまう・・・。
初めは凡ミスかと思ってコードを確認しても、おかしな点は見当たらない。
で、ネットで調べてみたら、マイクロソフト公認のExcelのバグでした。
バグの概要
バグが発生する条件は、
- Excel2000以降（少なくとも2007では発生）
- 条件付き書式はVBAで指定する
- 条件は 相対セル参照 で指定する
- 選択したセル以外に条件付き書式を指定する
というもの。詳細はマイクロソフトのページをみてください。
回避方法
今回の案件では、上の3つはどうしても回避できない項目でした。
（マイクロソフトのページでは、「VBA使うな」とか「絶対参照で書け」なんて回避方法が紹介されてました）
でも、最後の「選択したセル以外に～」という項目は回避できます。
要は、「条件付き書式を指定したいセルを選択しておけばOK」ということです。
実際、そのようにコードを組んだら、あっさりと解決しました。
ちなみに、マイクロソフトのページにあったコードを、この方法で回避するとこうなります。
Sub Example()
Dim rOrgSelect As Range
ThisWorkbook.Worksheets(1).Range("A1").Select
With ThisWorkbook.Worksheets(1).Range("B1")
Set rOrgSelect = Selection
.Select
.FormatConditions.Delete
.FormatConditions.Add Type:=xlExpression, _
Formula1:="=A1=1"
.FormatConditions(1).Interior.ColorIndex = 46
End With
rOrgSelect.Select
End Sub
2,6,7,15行目が、Excelのバグを回避のために追加した行です。
3.11以降、熊本でも節電を行っている企業やお店が増えています。
「九州電力管内なので直接影響ないのでは？」とも思っていたのですが、経済活動を停滞させないならばいいかなと。
そうこうしているうちに、九州電力から「7月中旬以降に15%の節電」の要請が来ました。
我々は、元々「これ以上は無理」というほど電気は使っていません（冷房を入れるとブレーカーが落ちるの）が、「少しでもできることをやろう」と、複数のサーバを一つにまとめるなど、なるべく電気を使わないように再編成しています。
これは要らなかった
家庭でもこれを機会に電気の使い方を見直してみました。
電力ピーク時には電気を使わないようにするとか、自然の風を入れるとか（うちは風の谷かと思うくらい、しょっちゅう風が吹いています）、照明を間引くとか。
その結果は、今のところ不便さはありません。これから夏本番を向かえれば、冷房を使わざるを得ないでしょうが、その時にはまた無理のないルールを作るつもりです。
つまり、電気って必要と思っていたほどは必要なかったのですよ。
これは要るんだった
一方で、今までは軽視していたものの重要さに気がつくことも多い。
最たるものが「正しい情報」。
こんなことを書くのは不謹慎かもしれませんが。
どの産地のものを食べたいのかは、個人の自由です。風評であれなんであれ、福島産を避けたいと思う人もいれば、気にしない人もいます。応援するためにわざわざ選ぶ人もいます。
だからこそ偽装はいけない。
数年前まで私は「食べて分からないようなら、騙されてもしかたないかな」程度に考えていました。でも、今回のケース（放射性物質）は食べて分かるようなモノではありません。
きちんとした検査結果が公表されることと、それぞれの商品に正しい表示があること。
当然といえば当然のことで、軽視していたことが、すごーーーく重要で、一番必要なことでした。
安全のために
自分が必要なものはきっとみんなも必要でしょう。
我々の存在意義を見出すためにも、特に食の安全に関する「正しい情報」を提供する製品を企画中です。
いまさらですがOpenVPNを使って、外から事務所のPCにアクセスできるようにしました。
遅い！
使ってみた感想は、「とにかく遅い」に尽きますな。
Windowsの共有フォルダなんて、開くだけで分単位の時間がかかる。
ファイルコピーでもしようものなら、止まって動かなくなる。
もしかすると、それなりの設定方法があるのかもしれないので、また今度調べてみようと思います。
今のところの運用
共有フォルダは使いものにならないほど遅いけど、他はまあまあ動く。
例えばVNC は使えるので、事務所のPCにしか置いていないようなローカルファイルでも、VNC接続で探すことができるし、VNC画面内で編集もできる。
どうしてもそのファイルが手元に必要な場合は・・・、今のところは Dropbox で取り寄せている（ここをなんとかしたい）。