福岡のホームページ制作[BULANCO(ブランコ)]のWeb制作のこぼれ話

ここのところ、忙しくてブログが更新出来ていません。
大変遅くなりましたが、先週土曜日に開催されたサト研のレポです。

今回は、12名程度集まりました。
当日、AIPカフェに行くと、東方村の中継が行われていて、若干遅れ気味でスタートです。

冒頭、nishiakiさんから、我流氏への苦言から始まりました(笑
私も若干加担してた気もしてたので、私も怒られるかなっと覚悟しましたがことなきを得ました。

詳しくはここら辺で。

• 【レポート】FWW_サイト運営・管理研究会(仮)Vol.5 | MutsuLog
• [レポ] vol.5 in AIPcafe 2009/02/21 - FWW_サイト運営・管理研究会（仮） | Google Groups

サト研Vol.5のレポです。 続きを読む

前回のエントリ([Movable TypeをCMSとして使う] 第3回 ファイル構成を考える)の続きです。
MTこと、Movable Typeには、バージョン4から、MT4とMTOS(オープンソース)という2つのライセンス形態に別れました。

MT4とは、Movable Type version4.xx Professional Packのことで、有料ライセンス版です。

MTOSとは、Movable Type version4.xxのことで、GPL版で、条件はあるものの、無料で使用することが出来ます。

カスタムフィールド

この2種類のMovable Typeの、一番大きな違いは、カスタムフィールドが使えるか否かです。
このカスタムフィールドとは、投稿画面(カテゴリー編集画面や、アイテム編集画面などでも)に、自由に入力フィールドを増やすことが出来る機能です。有ると無いとではカスタマイズ性能に随分差が出来ます。

結果から言うと、この機能だけでも、52,500円(5ユーザー 50プロフィール)のライセンス料金を払う価値はあります。予算に余裕があれば、購入することをお進めします。

[Movable TypeをCMSとして使う] 第4回 MT4?MTOS? 続きを読む

最近、デザインフェーズにどっぷりな、やいぶです。皆さんこんにちは。そんな中便利な、PSDを発見したので、ご紹介。

デザインカンプを作る時って、リアリティーを出す為に、ボタンや、スクロールバー、インプットボックスなどのエレメントを、実際のブラウザ上から、スクリーンショットで撮って、配置していたのですが、毎回撮るのが面倒だからと思って、まとめて素材集として、作ろうかと思っていた時に、以下のページで、既にまとめてあるPSD集を発見しました。

teehan+lax » Blog Archive » Browser Form Elements PSD

ただ、IEの素材は、Vistaの7なので、それなりにいい感じのエレメントに成っています。

前の、エントリ(MacOSX版のPhotoshopでMSゴシックをアンチエイリアス無しで奇麗に見せる )でもさらっと書いたのですが、デザインカンプのパーツが、クライアントが見ているものをギャップがあると、最終的に「違うね」って言われる危険性があるので、出来るだけクライアントが使っているものを使いたいんですよね。

残念ながら、クライアントはまだまだXPでIE6を使っている可能性が高いです。
海外にはこのような傾向は無いらしいですが、日本は、なぜか古いバージョンを使う傾向があるみたいですね。日本人って保守的なんですかねぇ。

という訳で、IE6用は、誰か作ってくれそうもないので、今度、自分で今度作りたいと思います。

前回のエントリ([Movable TypeをCMSとして使う] 第2回 プラグインを考える)の続きです。

Movable Typeは、あくまでBlogとして使うことを前提に作られていますので、デフォルトのファイル構成では、一般のサイトぽくないので、ぽくなるようにを変更して行きます。

これが初期のファイル構成です。

不必要なファイルの整理

この中で必要の無いものは

• スタイルシート
  (別途CSSファイルを用意するため、再構築の構成には必要ない)
• RSD
  (好みですが、最新のMTは、atom.xmlのみになっているので、RSDは使わない方向で)
• JavaScript(好みで)
  (コメントシステムを使わない場合は必要ないと思います)

上記ファイルは、削除、または再構築をしない設定に変えます。

また、アーカイブあたりも、必要ないのですが、そのままサイトマップに流用出来るので、とりあえず残しておきます。

[Movable TypeをCMSとして使う] 第3回 ファイル構成を考える 続きを読む

前のエントリ([Movable TypeをCMSとして使う] 第1回 構成を考える)の続きです。
書く順番が違う気もしますが、MTをCMSとして使う時に、便利なプラグインをご紹介します。
プラグインによって、MTそのままでは、実現出来ないこともプラグインによって可能になことがあります。どのようなプラグインがあるか理解することでMTでの幅を広げることが出来ます。

プラグインインストールポリシー

プラグインは出来るだけインストールしない!

というのが、私のプラグインにインストールに関する考え方です。プラグインのエントリーを書いておきながら、いきなり否定から入っていますが、プラグイン自体を否定している分けではありません。

というのも、プラグインをインストールすることにより、MT単体では実現出来ないことも、実現することが出来ます。素晴らしいと思っています。ただ、だからといって、むやみやたらにプラグインを入れることは、それなりにリスクがあります。

システム的に重大な部分を、プラグイン頼りになってしまうと、MTのバージョンアップの際、プラグインがバージョンアップに対応出来ないと、しかたなく、バージョンアップが出来ず、セキュリティーに問題を抱えたまま使い続けないといけにことがあります。

MT4になり、変数(<$mt:SetVar$>)やif文（<mt:If>)などが、導入され、プラグインを使わなくても、かなりことが実現できるようになっています。

プラグインをインストールするときは、プラグインでしか実現出来ないのかを、良く吟味してインストールするようにして下さい。

インストールするプラグイン

とはいえ、どうしてもインストールしないとCMSとして、運用出来ないものは、インストールします。 私が厳選したMTのCMS仕様用のプラグインです。

参考にして下さい。

[Movable TypeをCMSとして使う] 第2回 プラグインを考える 続きを読む

前置き

先日、告知したサト研が来週末2月21日に行われます。今回から数回にわたりのサト研LT(ライト人グトーク)用に、ブログで先に書いてまとめておきます。時間的にも全部話せないと思うので、「詳しくはWebで!」用のエントリーです。

(このエントリーは、サト研用の半メモ代わり記事になる予定です。ちょこちょこ加筆する可能性がありますので、ご了承下さい)

Movable TypeはCMS?

正確に言うと、ブログツールのMTやWP(WordPress)もCMS(コンテンツマネージメントシステム)です。

ただ、一般的にCMSとブログツールを分けている傾向があります。

• 一般サイトの運営=CMS
• 日記系サイトの運営=ブログ

[Movable TypeをCMSとして使う] 第1回 構成を考える 続きを読む

MOONGIFTさんで紹介されていた、『timeEdition』をインストールしてみました。

MOONGIFT: » 作業時間を測定＆自動レポーティング「timeEdition time tracker」:オープンソースを毎日紹介
(Windows版もあります)

かなりシンプルなソフトです。
自分がどのクライアントのどのプロジェクトのどのタスクにどれだけ時間を掛けたか記録出来るソフトです。この3つの要素を記録出来るのは大きいです。

普段から、自分がどのプロジェクトにどれだけ時間をかけているか、気になっていましたが、このソフトのおかげで簡単に記録出来そうです。

『timeEdition time tracker』をインストールしてみました。 続きを読む

たまには、サト研の宣伝を。

CGFMの我流氏と、プロボの、nishiaki氏と、私で始めたことになっている(実際の呼びかけは我流氏です、SpecialTHX!!)、サト研ですが、去年の9月から始めて、もうVol.5になりましす。ほぼ毎月開催(12月のみ忘年会に)しています。この調子で今後も続けいければと思っています。

改めてサト研のご説明

サイト運営や管理まで含めたWeb制作してる人、企業のWebサイト担当者達と交流したり、運営方法やCMSなどの研究したりする集まりです。 サト研とはサイト運営管理研究会の呼称です。

サト研Vol.5の参加募集始まりました。 続きを読む

フリーで使えそうなメーラーを発見したので、ご紹介。

『Postbox』
(Windows版もあるみたいです)

期待が持てそうなメーラー『Postbox』 続きを読む

Macのアイコンを、ブログなんかで使いたいことってありますよね?(無いですか?)
そこで、アイコンを簡単にPNGなどのブログに貼付けられるファイル形式にする方法です。

著作権的にちょっと問題があるかもしれませんので、ご使用は自己責任で。

1. 作りたいアイコンを選択し、appを右クリックで[パッケージの内容を表示]を選択。
   
2. [Contents]>[Resources]とブラウズすると、「.icns」と付いたファイルがあるので、選択>右クリック>プレビュー.appで開く
   
3. プレビュー.appの[ファイル]>[別名で保存]
   
4. フォーマットでPDFを選択して、任意の場所に保存
5. Photoshopなどの、画像編集ソフトで、PDFで保存したファイルを開く
6. あとは似るなり焼くなりして、PNGやJPGにして保存。

以上です。 意外に、簡単に出来ます。

以前ご紹介(XMindが素晴らしい件)した、マインドマップソフト『XMind』ですが、ここで改めて私の使い方を絡めて改めてご紹介したいと思います。

XMind - Social Brainstorming and Mind Mapping

マインドマップとは

マインドマッピング - Wikipedia

表現したい概念の中心となるキーワードやイメージを図の中央に置き、そこから放射状にキーワードやイメージを繋げていくことで、発想を延ばしていく図解表現技法。この方法によって複雑な概念もコンパクトに表現でき、非常に早く理解できるとされ、注目され始めている。 人間の脳の意味ネットワークと呼ばれる意味記憶の構造によく適合しているので、理解や記憶がしやすい。

なんだか難しいそうですが、実は、そうでもなかったりします。
一番重要なのは、「キーワードやイメージを繋げていくこと」だと思います。繋げることによって、単純なメモ書きが立体的になり、理解しやすくなります。

最近では、色々なメモをマインドマップで書くようしています。私なりの使い方をご紹介していきたいと思います。

Web制作者的な『XMind』の使い方 続きを読む

先日、ちょっとしたトラブルでMTのバージョンを上げました。

MTのバージョンアップの手順をまとめておきます。

プラグインの対応状況を確認する

サイトで重要なシステム部分でプラグインに頼っている場合は、バージョンを上げる前に良く確認する必要があると思います。

これを行わずに、バージョンを上げてしまうと、最悪構築したシステムが使えない可能性が出てきます。

データをバックアップ

念の為、バックアップを取っておきます。
トラブルが無い限りは、このバックアップファイルを使うことはありません。「トラブルはありえない!」という妙な自信のある方は、ここは飛ばしても大丈夫です。(自己責任でおねがいします)

出来れば、DBを直接バックアップ取る方が、安定だと思います。DBが操作出来る方は、DBを、バックアップしてください。ここでは、MT内でバックアップする方法をご紹介。

1. [ツール]>[バックアップ]
2. 「圧縮フォーマット」 は「zip」を選択。
3. 「出力ファイルのサイズ」は「分割しない」と選択。
4. [バックアップを作成]をクリックして、任意の場所に保存。
   以上です。
   

Movable Typeのバージョンアップ手順 続きを読む

ブログのテンプレートを少し触ろうと、MTにログインして作業をしようとすると、管理画面のページを移動する度に、ログイン画面に飛ばされる現象に急に襲われました。

原因究明

.htaccessをちょこちょこ触っていたので、それが不味かったか思い、.htaccessを元の設定に戻してみたりしましたが、改善されない。
↓
Firefoxがバグったかと思い、Safariでログインしてみても、ページ移動の度に、ログイン画面。
↓
Macの問題か?と思って再起動しても駄目。
↓
バージョンの問題か?っと思って、MTのバージョンを上げて(4.21→4.23)みるも変わらない。
↓
MTの問題ではない、てことはDBを疑ってcoreserverの管理画面から新たにDBを作り、mtにアクセス。インストールが始まるので、素直にしたがって新しいMTにアクセス。
↓
問題なくログイン出来る。
↓
ほぼDBが原因と特定。

Movable Typeがいきなり壊れた!(DBのmt_session) 続きを読む

先日の記事で、Firebugを間違って「ゴキブリ」と訳してしまって恥をかいたので、今日は、Macのソフトを意味なく漢字に変換してみようかと思います。

漢字って、外国人の間で流行っているみたいです。

元NBAプレーヤーのジェイソンウィリアムズは、彼のプレースタイルから、「Crazy」と呼ばれていて、その呼び名を、漢字に訳して「気違い」と右腕に掘っていました。たしかに、訳としては、なかなかズバリな訳なんじゃないかと思います。

ただ、2000年のJapanGameの際、日本で「気違い」は放送禁止用語だったので、テーピングして出場していました。このエピソードもなかなか「Crazy」ですよね(笑

そんなこんなで、気になったので、私のMacに入っているソフトを中心に、漢字にしてみます。

Macのソフトを意味なく漢字にしてみる 続きを読む

Q. 使っているサイト制作ソフトは何ですか？ A.Dw+CSSEdit+Transmitです。(前編)このエントリーの続きです。前のエントリーで、Dreamweaverを徹底的に持ち上げました。今回は、Dreamweaverでもある機能をあえて別ソフトでやっている理由でも。

CSSEditの素晴らしさ

軽快

もうお約束です。
Dreamweaverと別のソフトを比べるとき、Dwがいかに重いかという話から始めます。
といっても、個人的には起動時以外はそんなに重いと感じることは無いんですけどね。

とはいえ、Dwと比べると、CSSEditは軽いです。サクっと立ち上がります。

プレビューが優秀

DreamweaverもCS4になり、プレビューエンジンがWebKitに変更されて、かなり良くなったと言われています。実際軽くしか触っていないので、よく分からないのですが、ライブビューに関しての使い勝手は、CSSEditのほうが優れていると思います。

ブラウザで見ているそのままを見れるので、楽です。それにCSSSpriteでマウスオーバーの調整をする時など、Photoshopなどで上でずれの計算してなくても、CSSEdit上で、プレビューを見ながら、数字の調整出来ます。それも、マウススクロールで数字の調整出来るので、素早くBackgroundの調整が出来ます。

Q. 使っているサイト制作ソフトは何ですか？ A.Dw+CSSEdit+Transmitです。(後編) 続きを読む

サト研のオープンチャットで、CMSのことが話題になったので、私が知る限りのCMSをひたすら羅列してみます。特徴などは書かず、ただただ羅列します。基本的にサーバーインストール型のもののみです。

果たしてそんなリストに価値があるのか?っとも思いもしましたが、「こんなにCMSがあるのか!」っとびっくりしたいという主旨でやってみます。
順不同です、他意はありません。
使い勝手など、コメント頂けると、のちのちご紹介するかもしれませんので、是非とも!

色々なCMSを、ひたすら羅列してみる。 続きを読む

Twitterでこんなアンケートが行われていました。
乗り遅れてしまったので、ここで私の使っているWeb制作ソフトと、その理由を語りたいと思います。まずはDreamweaverから。

Ask Twitter: 使っているサイト制作ソフトは何ですか？ : could

Ask Twitter: 使っているサイト制作ソフトは何ですか？ 2 : could

このアンケートをみると、やはりDreamweaverとかCodaとかが目立っていますね。知らなかったのが、skEditというエディターです。

早速、skEditを気になって使ってみました。

skEditの素晴らしいところ

• とにかく軽快
  (さくさく動きます、起動も一瞬です)
• 補完がすばらしい
  (htmlとMTタグの補完をやってくれます)
• ローカルとリモートを簡単に同期してくれます。
• プレビューが好きなブラウザで出来ます。
  (内蔵のブラウザ(WebKit)も選べますし、Firefoxなど他のブラウザも自由に選べます)
• 安い!
  ($34.95 Codaは$99 Dwは¥49,875)

っと、素晴らしいとこを、色々と並べておきながら、やっぱりDwが良かったというお話です。

Q. 使っているサイト制作ソフトは何ですか？ A.Dw+CSSEdit+Transmitです。(前編) 続きを読む

何が凄いって、これって全てJavascriptで作っているんですよね。最近、Bookmarkletを研究してて、Hatenaの新しいBookmarklet(はてなブックマーク - セットアップ)も素晴らしかったのですが、Firebug Liteは驚きの機能です。

といっても、Firebug Liteは、Javascriptなので、ライトはライトです。気軽に使うためなので、本気使いたいときは、それぞれの、疑似FIrebugアプリを入れることをお進めします。

• IE用
  Download details: Internet Explorer Developer Toolbar

• Opera用
  Opera Dragonfly | Take a peek into the future
  (ドラゴンフライ。。。トンボですかw ゴキブリより随分カッコいいですね。 (2月3日追記:ごめんなさい、蛍でした(汗)  でもイラストはゴキブリにしか見えませんよね。。。))

• Safari用
  Safariは、デフォルトで付いています。
  [環境設定]>[詳細]>[メニューバーに"開発"メニューを表示]にチェック
  [開発]>[Webインスペクタを表示]で、使えます。Firebugぽくブラウザの下部で、使いたいなら、左下にある、マークをクリックすると、ブラウザのメインウィンドウの下に移動します。

以上、上手く活用してWeb開発を楽にしたいですね。

『Firebug Lite』って凄いですね。 続きを読む

サイト内検索のありかたって、難しいのですが、小規模際との場合、サイト内検索がよく使われているサイトは、訪問ユーザーが、設置しているナビゲーションでは目的地まで到達していないため、サイト検索を使ったという可能性が考えられます。

どのような検索キーワードが、検索されているかを分析すれば、ある程度自分のサイトに足りていないナビゲーションが分かってきます。

Google Analyticsを使うと、割と簡単にサイト内検索で何が検索されているのかを知ることが出来ます。

以下で設定方法の解説をします。

『Google Analytics』でサイト内検索を解析する方法。 続きを読む