WordCamp Fukuoka 2010の多目的ホール1でのスライド公開

WordCamp Fukuoka 2010

WordCamp Fukuoka 2010の多目的ホール1で
「サイト運営マニュアルの必要性」

というサト研っぽい?テーマで話させていただきました。

わざわざ見に来てくださった皆さん、本当にありがとうございました!

その時のスライドを公開します。
Read More »

タグ: , , , ,

WordCamp Fukuoka 2010の裏で話します

WordCamp Fukuoka 2010のプログラムに書かれていますが、
当日、多目的ホール1の方で枠をもらって話すことになりました。

タイトルは「サイト運営マニュアル」としてますが、
全然関係ない話をするかもしれませんw
(まだ全く準備してないので…)

  • Wordpressだ、CMSだと言う前にもっと大事なことがあるだろう
  • お客さんにどうやって更新してもらうのか
  • どんなマニュアルを準備すればいいのか

こんな話題になるかなと。(いいのかな?)

まーメインとは違う裏番組ですし、
多目的ホールといっても場所はそんなに広くないので(AIPcafeぐらいかなー?)
サト研ぽく、少数の皆さんとがやがやできる感じで話せたらなーと軽い感じで考えてます。

▼多目的ホールの写真
多目的ホールの中入り口から除いた多目的ホール

▼メインホール(200人)
IMG_0411

ちなみに、同じサト研の運営者の一人で、MTで有名な 山田ヤスヒロさんも、
別の多目的ホールで11:15-12:00 (予定)の時間枠で
WordCamp史上、誰もやったことがないテーマ?を話すらしいので、
ぜひこちらもチェック!w

p.s. 懇親会参加者が既に100人突破!

タグ: , , ,

インターフェイスのデザインの事を話してきました

仕事としては珍しいのですが、先日、グローバルブレインズ株式会社さんでデザインに関する講義を行ってきました。
下はその時のスライドで、やってみた感想や補足事項を続けて書いてます。

interface design

View SlideShare presentation or Upload your own. (tags: design ui)

『どういう風に考えて管理画面をデザインしてるのか?』
を僕たちなりにまとめた内容です。
(スライド作成はCGFMデザイナーのmutsukiです)

CGFMではBtoCなWebデザインのお仕事がほとんどなんですが、
BtoBな業務系の管理画面などのデザインも時々手がけてます。
Read More »

タグ: , , , , ,

佐賀のデジタルコンテンツセミナーに行ってきたんだった

/11(木)に佐賀で行われた、
「デジタルコンテンツセミナー ウェッブデザインの国際標準規格
〜ウェッブデザイン技能検定を題材にして〜」

に参加してきました。

場所は、アバンセ(財団法人佐賀県女性と生涯学習財団)第1研修室(4階)

佐賀市天神三丁目2−11 どんどんどんの森内。

アバンセ

アバンセ

初めて行った。

お目当てはインフォアクシアの植木さんの講演。

写真:植木さん

写真:植木さん

  • 「今日、会場に来られてる中で『辻ちゃん・ウエちゃんのアクセシビリティPodcast 』を聴いてる人はいますか?」の質問に大きく手を挙げた福岡組2人。会場の参加者にはほとんどいなかった・・・
  • 日本は世界一、アクセシビリティに取り組んでる国らしい。あとアクセシビリティは障害者向けだけでなく、今後少子化でますます増える高齢者も対象に考えてて、JISの新規格も来年頭に公開される。
  • 代替テキストの付け方などは改めて再確認。
  • ページタイトル=見出し1=パンくずナビの最後
  • アクセシビリティに考慮したサイトは自然とSEO対策をしたことになる。これは鉄板。
  • リンクを設定する文字列(<a></a>で囲んだ文字列)は大事なキーワード
  • 文字列はリンク先のページタイトルであるべき
    • リンクが「お問い合わせ」で、飛び先のページタイトルが「フォーム」だと、音声ブラウザで閲覧してる人にとって「違うページか?」と迷って戻ってしまう事があるらしい。(ユーザーテストの結果から)
    • Blog書いてて良く思うが、開いたページのタイトルとURLを、[<a>ページタイトル</a>]みたいに整形された状態でクリップボードに持って行けるアドオンってあったら便利だよな〜と。
  • 来年頭頃に「JIS X 8341-3」が大きく改定される。要チェック。
    →「JIS 8341-3」の改訂は2009年秋の予定で、来年始めには草案が公開されるとの事でした。
    (2008/11/19 追記)

講演終了後に、図々しく植木さんに声をかける。

  • 当然、僕の事は覚えてもらっていなかったが、福岡の@nishiakiの事は鮮明に覚えられてた。
    (「あいうえお作文」を「お」で止めた人として。)
  • 僕「@nishiakiがリベンジしたい(次はちゃんとしたいの意)と。」
    植木さん「こっちも福岡であいうえお作文のリベンジしたいですよ!w 福岡呼んで下さいよ!」
  • 実家が福岡なので、全然呼んでもらって構わないとの事。(足代もホテル代もいらないって)
  • 時期はJISが改定されたJISの草案が公開される予定の来年頭頃なんてどうだろう〜ってぼんやり話しました。
  • アクセシビリティの事で良ければ、1時間でも2時間でも1日でもやりますよ的な発言も。
    (なんでも大阪?で二日連続で講演されたらしい)
  • Adobe祭りにも来られた神森さんと一緒にやれたら面白いかも、って話も。

福岡に呼べるといいな〜。
福岡の自治体のWeb担当者をターゲットにして。

あとは徒然。

  • 「ウェブデザイン技能検定」って国家検定が出来てたんだ
    • セミナー自体は無料で満足のいくもの(うえきさんのが)だったが、
      セミナーに使われなかった検定試験対策のテキスト2100円は買わされた感が残った
    • でもそのテキストの模擬試験をざっくりやったら40問中28問しか合わなかった。
      これマジメに勉強せんとムズイ。
    • 2級検定の費用が学科+実技試験で18,500円
  • 「技能五輪国際大会」でも正式種目になったんだ。
    前回の優勝は韓国の人だったんだって。
    何でも4日間ぶっ続けで細かい仕様に対してWebデザイン+プログラムを行って2-300項目で採点するらしい。

  • 会場で数人と遭遇。
    • 生徒だったYさんにもお会いできた
    • @tobetchiと一緒にマークアップの問題のミスにツッコミ入れに行った。
      @tobetchiの意気込みがなんだかカッコ良かった
    • 隣にはヒロ嬢w
  • 懇親会とか交流会とか特に何も無く解散。帰りに佐賀らーめん食べて帰る。
  • 他県のセミナーに初めて参加したが、やっぱり福岡は恵まれてる。(移動とかアクセスとか頻繁度とかの面で)
    今後、福岡のコミュニティにわざわざ来てくれる県外の方々には頭が下がるし、とても有難いものなんだと改めて感じた。

追記)

タグ: , , , , , , , , , , , , , , , , ,

User Agent Switcher の携帯用のXML

追記 2009/05/24)
Webデザイナー向けの絵文字ライブラリを公開しました。
codecheck.in:PHP携帯絵文字表示ライブラリ(PHP埋込型・au絵文字名対応版)のダウンロードサイトはこちら
絵文字一覧表はこちら


追記 2009/01/30)
useragentswitcher.xmlcodecheck.inにコミットしました。
ついでに以下をXMLに追記しました。
おかしいところがあったら指摘お願いします。

  • FOMA、movaの製造番号付
  • iPhone (新旧2つ)
  • iPod Touch (新旧2つ)

追記 2009/01/19)
別記事で「Firefoxを簡単に携帯エミュレータにするアドオン「FireMobileSimulator」が素晴らしい件について」を書いてます。
携帯の絵文字確認や画面幅確認など、簡単な携帯画面の動作確認にはこちらをオススメです!


追記 2008/07/25)
PiF(PHP in Fukuoka)の第9回勉強会のスライドを公開しました。
http://blog.cgfm.jp/garyu/appendix/2007/10/slide/20071117pif.html


▼本文ここから —–

先日2007/11/17(土)に行われたPiF(PHP in Fukuoka)の第9回勉強会のスピカーで「携帯の機種判別」を話せさてもらいました。

その時、携帯開発で便利な、Firefoxの拡張でUserAgentを切り替えられるUser Agent Switcher を紹介したんですが、各携帯のUserAgentをメモったuseragentswitcher.xml を公開します。

修正:20080917) リンク切れ直しましたm(_ _)m

元ファイルはblog in a fogのYozikさんがエントリー「blog in a fog – User Agent Switcher ユーザーエージェント一覧」で公開していたxml(感謝!感謝!)をベースにしています。
私なりに携帯関係を加えたものです。
(幅別にしたり、SoftBank系にダミーの携帯固有IDを入れたりとか)

使い方は簡単です。

  1. User Agent Switcher をFirefoxにインストール
  2. [ツール]メニュー – [ User Agent Switcher ] – [option]から設定ウインドウを表示
  3. useragentswitcher.xmlをImportする。
    useragentswitcherの画面説明

これだけでOKです。
後は、[ツール]メニュー – [ User Agent Switcher ]の一覧に出てくる機種名で切り替えるだけです。
(切り替えたらリロード・再読み込みが必要)

勉強会ではNet_UserAgent_Mobileでの簡単な使い方と過信したらいけない点、実際に自分の携帯でアクセスしてどう動くか等を試してもらいました。

当日のスライドデータはPiFのGoogle グループに一式を公開してます。
PiFのサイトが無くなったため、こちらに公開しました。
http://blog.cgfm.jp/garyu/appendix/2007/10/slide/20071117pif.html

QRコード:PiF携帯判別各自の携帯で試してもらったURLのQRコードです。
http://blog.cgfm.jp/garyu/appendix/2007/10/sample_php/s4_mobile_test.php

種判別の結果や、機種固有IDの取得、画像幅と高さを取得できる事が分かると思います。
(機種固有IDなどはサーバーに保存・蓄積しません)

携帯サイトに 関する参考サイトも集めてみました。

そういえば次のPiFのネタは何も決まってませんでしたね。
何かリクエストあれば考えます。
CSSでフォームデザインの検証ネタの続きをしないとなー。

携帯サイト制作のオススメ書籍

携帯サイト コーディング&デザイン

モバイルユーザビリティ・デザイン Web制作者が身につけておくべき新・100の法則。
PHP×携帯サイト デベロッパーズバイブル

タグ: , , , , , , , , , , , ,