2009年3月の記事一覧｜WEB制作・WEB開発のTips＆News Kamimoto.biz Labs

2009年3月31日

データベースの基礎を理解する上での最良と思われる記事があったのでご紹介します。

データベースの基礎を理解しよう！プログラミング未経験から始めるPHP入門

引用してみます。

データベースの具体的なイメージとしては「高機能なEXCEL」のようなものだと思ってください

DBについては、この表現がわかりやすいかも。

この記事の対象としている人は、基本的に文系なはずなので、しっくりとイメージできるはず。

• DB
• MySQL
• データベース

今回は、Ajax関連のブックマークネタです。

・Ajaxで軽快に動作するニュースレターモジュール「Fantastic AJAX Newsletter Module」
こちらのニュースレターモジュールが紹介されています。

Fantastic AJAX Newsletter Module

デモです。

・jQuery入門（1）
これから、jQueryを始める方向けですね。

・Web開発者必見! jQuery UI ウィジェット3選
こちらは、jQuery UIウィジェットの紹介ですね。

• Ajax
• jQuery

2009年3月28日

今回は、Flash Lite関連の記事のご紹介です。

■Mobile Creation Flash Liteコラム
ソフトバンクモバイルが運営している開発者向けサイト「Mobile Creation」内のFlash Liteコラムです。

Flash Liteコラム

以下が記事になります。

• Flash Lite™をはじめよう！
• Flash Lite™制作の基本的な流れ
• 画像/文字を表示してみよう
• 画像を動かしてみよう！
• 入力を受けつけて画面が動く！

内容としては、完全な初学者向けですが、逆に言うと教える際に役に立つ内容だと思います。

■Flash LiteからAIRへ――Open Screen Projectでモバイル戦略を加速するAdobe
Flash LiteについてのAdobeの戦略です。

• AIR
• Adobe
• Flash Lite

2009年3月26日

Adobe関係で、いろいろと。

・Flashゲームで小額課金できる「モゲラ」
モゲラというサイトについて。
これと絡んで、GW中にオンラインイベントをやるみたいです。
#もう、GWを語る時季なんですね。。

・これからはじめるRIAとFlexプログラミング 第1回）RIAの基本とFlexの優位点
記事内容よりも、執筆されている宮田さんという方の肩書「Webシステム開発株式会社 」というストレートな社名に感銘を受けました。

• Flash
• Flex
• モゲラ

photoshopで、クレヨン風の線を実現したいときですが、
ググってもあまり出てきませんでした。

かろうじて、2つかかりました。

・ブラシをダウンロードするケース
PhotoshopCS3用鉛筆風ブラシ

・フォトショの標準ブラシでがんばるケース
フォトショでクレヨン調のイラストを描きたいのですが...

で、ここで、Adobe Fireworksの出番です。

こんな感じで、下のテクスチャを"しわくちゃ"で、こちょこちょ%調整すれば、かなりいい感じでクレヨンちっくになります。

• Fireworks
• Photoshop
• クレヨン
• ブラシツール

Windows Live Messenger Web Toolkitを見て、これは後々、いろんなところで役に立ちそう！
ってことで、取り組む予定なのですが、

一番最初にはまるのが「Azure」の読み。

Windows Azure

一応、「アズール」みたいです。
英語圏では、「アジュア」。

下記を参照。
http://www.sophia-it.com/content/%E3%82%A6%E3%82%A3%E3%83%B3%E3%83%89%E3%82%A6%E3%82%BA+%E3%82%A2%E3%82%BA%E3%83%BC%E3%83%AB

• Windows Azure

Web制作・開発のための今日のブックマークです。

・IE8は本当に速いか計ってみた
そろそろ出てき始めたIE8と他ブラウザとの速度比較。
Microsoftさんが自社のレガシーverであるIE7としか、公に比較していない時点で、「あっ、遅いんだな」と大半の方が思ったと思いますが、予想通りの結果みたいです。

・フォームをデザインしよう
SEO（検索エンジン最適化）。
SMO（ソーシャルメディア最適化）。

の次に言われ始めたのが、EFO。
つまり、エントリーフォームの最適化でした。
これは、多分に、ユーザビリティと絡みむ部分です。
今回の記事は、構造設計としてのユーザビリティからの考え方ではなく、
「わかりやすいアイコンを添えておく」などのデザイン面からのものですね。

・jQueryとCSSを使ってフォームのinput要素を楽に整列させる方法
同じくフォームがらみ。

• EFO
• IE8
• ユーザビリティ

Web制作・開発のための今日のブックマークです。

・HP、Flashアプリ向け無料セキュリティツール「SWFScan」をリリース
Flash開発者は必要かもしれません。
モバイル用のFlash Liteもいけるんでしょうか？

・Script.aculo.usで、ビジュアルなWebページを作成しよう
アメリカの事情はちょっと把握してませんが、JavaScriptライブラリについては、現在の趨勢は、script.aculo.usよりはjQueryに傾いていると思います。
ですが、一応、Prototype.jsとscript.aculo.usも知っていた方がいいかとは思います。

・PHPプログラムを解析して何処が重いか？がブラウザ上で簡単に分かる「XHProf」
まだ、自分には出番がないが。

・サイトマップをフッタに配置する際のポイントとその効果
CMSとの兼ね合いを考えるとなんともいえない。
「現在は、多くのモダンなウェブサイトでサイトマップページを設置していません。」と書かれているが、本当の意図は「クローラー対策」としても、そもそもの出発点はユーザビリティなんだから、「モダン」もくそもないかと思いますが。

・なぜCakePHPなのか？
5末までに、なんとかCakePHPまでいきたいなと。

• Flash
• PHP
• セキュリティ

横型アコーディオンをしたい場合、多くはFlashで行われると思いますが、メンテナンスの面で言ってもJavaScriptで行えた方がうれしいはずです。

ということで、ググってみました。

ググってみた感じ、これが一番いい感じです。

Projects | jQuery - Horizontal Accordion

ページ下部からダウンロード可能です。

基本的には、DLフォルダの中に入っているindex.htmlを開いて中身を確認してみれば、改良していくことが可能と思います。

早速、使ってみる予定です。

• Flash
• JavaScript
• jQuery
• アコーディオン

2009年3月25日

Web開発のための今日のブックマークです。

・ケータイの認証用IDの現状をまとめたブログ記事「携帯各キャリアの固有IDについて (全キャリア対応)」
国内ケータイのドコモ、au、ソフトバンク、ウィルコムという各キャリアにおける、契約ID、端末固有IDの仕様について、詳細にまとめられています。

・Dreamweaverのライブラリのディレクトリ指定のリンクの不具合のせいで、docomoで301エラー
最近、個人的に、Adobe Dreamweaverの有効性にようやく気付きました...
今まで、正直に言って、コード保管機能ぐらいしか使っていなかった。
ですが、ようやくスニペットを自分カスタマイズし始めています。

・Webディレクター視点で考えるマークアップのチェックポイント
確かに、これぐらいは最低限、ディレクターでも知っておきたい。
が、できれば、実際にXHTML + CSSで組める方がいいですね。

・技術系サイトに必需品！ ソースコードは鮮やかに
技術系サイトは、文字通り必需品。
#ちなみに、私のこのブログもそういう方向へ行くべきなのですが、いかんせん、私自身が本職じゃないので、まだまだ。。

・第14回　検索結果が多いときにページを分割する　チャレンジ！　Movable TypeをCMSとして使ってみよう！
MT初心者向けの内容です。

・「流行ってるらしいよ」という話題が「流行ってる」
（引用）「流行ってるらしいよ」という話題が「流行ってる」ように見える。

最近、バズマーケティングと本当の流行の境目が非常にわかりにくくなっていますね。

・本気でブログデザインリニューアル！
ためになる。

• MT
• デザイン
• バズマーケティング
• ブログ
• モバイル

2009年3月24日

大企業様のイベント関連です。

・mixi
APIの公開がいよいよなmixiさん。

mixiアプリ カンファレンス2009

とりあえず、申し込んでみました。
たぶん、抽選です。

・livedoor
第一回 ライブドア テクニカルセミナー・ログ

これは先日のセミナーのレポートですね。
参加してます。

で、css niteっぽくデータも公開されています。
参加されていない方は、ぜひ。

• livedoor
• mixi

これは便利です！

Movable Type、WordPressなどのCMSでブログを書かれている方も多いかと思いますが、これは便利！とうなるFirefoxアドオンが3つ紹介されているのでご紹介。

CMSを超快適にするFirefoxアドオン3選

1. dragdropupload
2. Resizeable Textarea
3. It's All Text!

特に、1、3はいい感じですね♪
2は、Firefoxにデフォルトで実装されていないだけですしね。

• Firefox
• アドオン

最近、ようやく書店でも、Adobe CS4の書籍を見かけるようになりました。

そんな中、マイコミさんからの本です。

Adobe Creative Suite 4クロスメディアガイドブック

書籍「ADOBE CREATIVE SUITE 4　クロスメディア ガイドブック」関連記事

単なる、操作解説本というよりは、「クロスメディア」についても触れられているようです。

• adobe
• cs4

2009年3月23日

マークアップエンジニアのコーディングを補助するためのjavascript「meca.js」というのがあるらしいです。

コーディングする際に、頻繁に使う箇所（＝Flash以外のサイトで基本的に必ず出てくる箇所）に特化したjQueryを用いたjavascriptは多くあります。

例えば、yuga.js。

基本的にはこれらと同じで、meca.jsでできることは、

• 画像ロールオーバー
• 外部リンク
• 透過png

となります。

ここから先は、使用する側の好き嫌いになるかと思いますので、一度試されるのが一番いいでしょう。

• meca.js
• yuga.js

Web制作、ウェブ開発というよりは、Webデザイナー向けのブックマークです。

WEBデザイナーという肩書きを使う場合にあったらいいかもなスキルとWEBで見れる無料教材とリソース集

先日、はてブのホットエントリーにもなっていた「プログラマーがWebデザインの知識も覚えましょう」的なのがありましたが、それに通ずるものがありますね。

ディレクター、プロデューサー業の方でも見ておくべきかと思います。

• Webデザイナー

2009年3月22日

GoogleがGoogle ChromeのJavaScript実行速度を体感してもらうためのサイト集を公開してるのですが、これが単純にすごいいいです。

Chrome Experiments

中村勇吾さんのFlash作品から感化されてJavaScriptで作ったような作品も多いです。

ballpoolやGoogle Gravity

非常に参考になりますね。

• Google
• JavaScript

jQueryは本当に便利なJavaScriptライブラリです。

で、そのjQueryで作ることのできる非常にシンプルなスライドショーです。

Timothy van Sas - Simple slideshow with jQuery

デモページ

早速使ってみようっと。

• JavaScript
• jQuery
• スライドショー

2009年3月19日

Web制作・開発のための今日のブックマークです。

・「合成フォント」でフォントをミックスしよう
元がデザイナーではないので、デザインの勉強をしている今日この頃です。
合繊フォントはしらなかったので、勉強したいですね。

・「ウェブリブログ」に新機能、記事に合ったアフィリエイト商品をリコメンド
コンテンツを読んで、コンテンツマッチさせたアフィリエイト表示はよくあるんですが、大半が、アマゾンアソシエイトだけです。
その中で、選択肢として、楽天アフィリエイトも最近地位を確立したなと再認識できたリリースですね。

• アフィリエイト
• 楽天アフィリエイト

2009年3月18日

Web制作・開発のための今日のブックマークです。

gihyoさんの記事からブックマークです。

・タイム・マネジメントの心得　第11回　日誌をつける
日誌をつけるのは重要なことです。
そして、そのための最適なツールがブログです。
人間は忘却の動物です。
ぜひ、どうぞ。

・【PHPで作る】初めての携帯サイト構築　第6回　携帯サイトのテストをする
携帯サイトのテストの記事。

あっ、最近、携帯サイトに関するサイトを公開し、大好評をいただきました。
デザイナー向けのサイトですが、開発の方にも参考にしていただけると思います。

モバイルサイトデザイン集のモバイルデザインアーカイブ

・チャレンジ！　Movable TypeをCMSとして使ってみよう！　第13回　検索用テンプレートに着手しよう！
MTを使うとほんと便利ですよ。
ぜひ、チャレンジしてみてください。

・テストリーダへの足がかり，最初の一歩　第1回　テスト計画（前編）
テスト（試験）をなめちゃいけません。

• gihyo.jp

2009年3月17日

Web制作・開発のための今日のブックマークです。

・「Adobe AIR」の基礎を学ぶ--マイコミ派遣が無料セミナー開催
今年、間違いなく来ることが予想されるAdobeAIR。
そのセミナーです。

・マイクロソフト、MSN のトップページをリニューアル ～ 「MSN ぜんぶ検索」を提供
MSNのリニューアル。
といっても、普段使用しないから違いがわかりません。。

・IMJモバイル調査レポート　【モバイルユーザー動向定点観測2009】
レポートはIMJモバイルのサイトより。

• AIR
• IMJ
• MSN
• モバイル

2009年3月11日

PHPでのmb_send_mailでの文字化け対処方法のメモ。

PHPではmb_send_mailでメールを送れるんですが、その際の文字化け対処のための文字コード指定です。

■UFT-8の場合
mb_language("Japanese");
mb_internal_encoding("UTF-8");

■SHIFT-JISの場合
mb_language("Japanese");
mb_internal_encoding ("SJIS");

■EUC-JPの場合
mb_language("Japanese");
mb_internal_encoding("EUC-JP");

と記述すれば大丈夫。

• UTF-8
• メール
• 文字化け

Web制作・開発のための今日のブックマークです。

・IE6問題に対処する10のテクニック
減ったとはいえ、未だにまだまだシェアの高いIE6。
嘆いても仕方ないので、とりあえず対策を。

・Firefoxの脆弱性はほかのブラウザの4倍?
みたいです。

• Firefox
• IE6

2009年3月 8日

先日、このWeb制作ブログではない別のサーバのMovable Typeをアップグレードしたのですが、その際にテンプレートが自動で変更されていました。

降順にしている箇所が、勝手に昇順に書き変わっていました。

記事を新規に投稿して、そのページを確認した時に気づき、テンプレートを確認したら、

sort_order="ascend"のモディファイア（Movable Type内での言葉。htmlタグの属性みたいなものです）がついていました。

降順自体は、MTの管理設定側で指定してるので、新たに「sort_order="descend"」は指定しなかったです。

とりあえずOKと。

• Movable Type
• アップグレード
• タグ

2009年3月 7日

世の中はWBCですが、おばかアプリ選手権というのが今日あったみたいです。

デザインハック・ミーティングVol.1 「おばかアプリ選手権」

技術の無駄遣いではあるのですが、「おばかアプリ選手権」というのがあったみたいです。

こんなネタがあるみたいですよ。

• 眠れないときにひつじの数を数えてくれる「ひつじカウンター」
• 欽ちゃんの司会でおなじみの「仮装大賞」の「採点パネル」
• メール着信を矢文（やぶみ）で知らせる「矢文メール」
• いつでもどこでもジュースを飲んだつもりになる「かたむけただけ液体が減る仮想ジョッキ」
• その日の邪気をはりきって払い落としてくれる「お払い巫女ちゃん」
• 画像をぷるんぷるんできる「ぷるんぷるん」
• 切取線と山折り谷折りで作る「エアーメイル」

また、明日ぐらいに公開されないかなー

• イベント
• カヤック
• サイバーエージェント
• ペパボ

2009年3月 6日

Movable Type、MTOSともにアップグレードをするときはあるかと思いますが、その際にSQLiteの場合は注意が必要です。

そもそものMTのアップグレードは、下記のシックスアパートのページを参照してください。

Movable Type アップグレードガイド

注意が必要なのは、下記の項目です。

・アプリケーションディレクトリ/mt-config.cgi

DBをMySQLなどを使用している場合は、mt-config.cgiの移動で問題がないのですが、SQLiteを使用している場合は、mt-config.cgiの中には記述がありませんので、

・アプリケーションディレクトリ/sqlite/mtos.sqlite

を再度手動でアップする必要があります。
したがって、事前に「mtos.sqlite」を保存しておくことが大事になります。

• MovableType
• SQLite

Web制作を始め、外部に公開するパブリッシングは、当然校正作業が必要です。

そして、えてして、校正作業は地味です。

でも、校正作業は大事です。

そんなことを痛感させられたヤフーのリンク切れ。

ヤフーのリニューアルに伴うアンケートの終了の告知ページ

Yahoo! Japan 告知ページ

Yahoo! JAPANへのリンクが、「http://wwww.yahoo.co.jp/」になっていますwww

ヤフーさんも大変なんでしょうね。

• Yahoo!
• 校正

2009年3月 4日

最近、お仕事で、英語版のMovable Typeを使用する機会があったのですが、というより今もあり、その中で、「日本語版と違うぞ！」と思われる気づいた点を紹介します。

※なお、この英語版Movable Typeは、「MTOS version 4.01」であり、現在リリースされている最新版では解決されている可能性もあります。
その点は、未確認ですので、気を付けてください。

■管理画面
当然違います。(笑)

英語です。

えっと、前置きは置いておいて、、ここからが本題です。

■タグ
MTを使う場合、基本的には、ブログシステムもしくは、簡易型CMSとして利用するわけですが、昨今、多くのWebサイトで見かける「タグクラウド」。

これを表現するためには、当然、各エントリーにタグ付けをしていくわけですが、フォームからタグを入力した際に、英語しか正しく認識しないようです。

日本語で同じ文字列をタグとして入力しても、違う文字列として扱われるようです。

例えば、エントリーAに「あいうえお」、
エントリーBにも「あいうえお」と入力した場合。

タグクラウド上は、「あいうえお」が2つ存在してしまいます。
各個別ページに付けて表示するのは当然問題がないのですが、クラウドなどのエントリー全体として見せることは、英語版ではやめた方がいいと思います。

■月別アーカイブ表示の日本語表記
月別のアーカイブを表示する際に使用する

• <$MTArchiveList$>(モディファイアとして、archive_type="Monthly">)


• <$MTArchiveTitle$>

したがって、下記のような英語の表記になります。

2009年2月の表記。

まぁ、これもJavascriptなどを利用すれば表現することは可能ですが、検索エンジンに読んでもらうプレーンなテキストとしては表現するのは厳しいようですね。

他にも仕様として気づくかもしれませんが、今のところ、大きな点として、上記2点を気づいています。

• MTOS
• MovableType
• 海外版

Web制作・開発のための今日のブックマークです。

・第5回　携帯サイトでセッションを取り扱う｜【PHPで作る】初めての携帯サイト構築
2009年では、当然のごとく携帯サイトへの知識が求められる。

・第0回　テスト技術を使う前に知っておきたいこと｜テストリーダへの足がかり，最初の一歩
テスト（試験）＝QCを保つことの重要性は、新人時代にしっかりと意識したいところ。

・第17回　Mail Marketing「メールマーケティング」｜WEB DESIGN WORKSHOP「正しいウェブデザイン」
開発とは違うのですが、とりあえず。

・他人がソースコードを書く様子を見る「よりそいプログラミング」｜濃縮還元オレンジニュース

・週刊Webテク通信
4のHTMLとCSSの話はぜひ。

・第4回　エア焼肉，Forsman & Bodenfors，Metamosphere｜いま，見ておきたいウェブサイト
エア焼肉！
こういうアイデアは大事です。

• CSS
• gihyo.jp

2009年3月 2日

初めて知った。

mixiのエンジニアが書いているブログで、発表されたというオンラインコーヒーメーカー。

mixiのエンジニア、「オンライン・コーヒーポット 2.0」を開発

• mixi

こちらで紹介してるWEB制作・WEB開発は、各種サービスサイトでご相談ください。各種ライブラリ（Prototype.js、script.aculo.us、jQuery）によるAjax開発、Movable Typeサイト制作のサイトへぜひ一度アクセスしてみてください。

• サイトマップ
• お問い合わせ
• ホームページ制作
• Web制作アイデア
• HTMLコーディング
• SEO
• SEO対策情報ブログ
• ウェブデザイン
• twitterデザイン
• twitterサービス
• twitter情報
• 動画まとめ