メルマガ（2013.04.09 発行）

published in 2013.04.09

※ このメールは Knock! Knock!勉強会にご参加いただいた方へお送りしています。

Knock!Knock!からのお知らせ
（2013.04.09発行）

こんにちは。Knock! Knock! の矢部です。

お待たせしていました CSS Nite in SHIZUOKA, Vol.4 サイトを公開しました。今回はデザインを一新、制作的にチャレンジしたことも多くあります。このサイトは同業他社の目に晒されるわけで、クライアントワークとは違った緊張感があります。それだけにエキサイティングでもあります。

制作中はノリノリですが、あまりにCSS Nite的ではないサイトに…内心ドキドキです

「14th Knock!」は、4月19日（金） 19:30〜に開催します

次回の「14th Knock!」第14回勉強会は、下記の予定で開催します。

日　時 : 2013年 4月19日（金）　19:15開場 / 19:30開始 / 21:30終了（予定）
　　　（前の時間に for Starter を行なっています）
開　場 : b-nest 静岡市産学交流センター演習室1
対　象 : Web制作の現場で働いている方 / Web制作の現場に興味関心のある方

4/9現在、参加登録 5名です。そろそろ参加登録してもいい頃じゃないですか？
試験的に、参加者のTwitterアイコンをサイトに表示しています（OKされた方のみ）

「HTML5 Boilerplate」から考える、これからのマークアップ（矢部）

HTML5のテンプレートとして有名な「HTML5 Boilerplate」。「最もポピュラーな」とサイトにも謳われているように、多くのサイトで採用されています。テンプレートにはHTMLやCSSはもちろん、jsや.htaccessも含まれています。これらを読み解くことで、「なぜ使われているか」「なにが便利なのか」を探し、これからのマークアップに活かす方法を考えていきます。

iOS ヒューマンインターフェイスガイドライン第2回（矢部）

読書会形式での「iOS ヒューマンインターフェイスガイドライン」。有名だけどちゃんと読んでない。そんな文書を読み解いていこうと思います。（スマートデバイス向けサイト制作に直結しそうなところを重点的に、全体を3〜４回くらいに分けて）
第2回の今回はP55からの「ユーザ体験ガイドライン」を中心に見ていきます（P88からP209は主にiOSアプリ向け情報のため、ざっくり流す感じで）。
https://developer.apple.com/jp/devcenter/ios/library/documentation/MobileHIG.pdf

ぜひご参加ください。

14th Knock! の詳細情報はこちら

初学者向け勉強会「Knock! Knock! for Starter #1」始めます

4月からの新企画として、初学者向けの勉強会を開催します。会場レンタル時間の有効利用とコミュニティ拡大をはかり、現役のWeb制作者とWeb制作者をめざす人の橋渡しになれば、と考えています。

日　時 : 2013年 4月19日（金）　18:20開場 / 18:30開始 / 19:15終了（予定）
　　　（for Starter終了後、引き続きレギュラーの勉強会を開催します）
開　場 : b-nest 静岡市産学交流センター演習室1
対　象 : Web制作を学んでいる人 / DTPの人 / 営業職など

書籍解説 : 『基礎から覚える、深く理解できる。 Webデザインの新しい教科書』

2月に発売された書籍『基礎から覚える、深く理解できる。 Webデザインの新しい教科書』をテキストに、現場のプロ（って自称していいよね）が解説していきます。初回は「Lesson1 Webデザインの世界を知る」を扱います。本書の「Lesson1」「Lesson2」は、Webサイト制作の概要的な話のため、「Web制作を理解したい営業さん・マネージャーさん」といった方にもオススメです。

基礎から覚える、深く理解できる。 Webデザインの新しい教科書

※ 事前にテキストをお読みになり質問などをまとめておくと、より効率的に学習できると考えます。

ぜひご参加ください。

Knock! Knock! for Starter #01
詳細情報はこちら

Web関連の気になるニュース/ブログからピックアップ

※ （）のなかは筆者の個人的な感想・意見です。

Webデザイン

メタファーがUXを向上させる5つの理由 | MEMOPATCH （メタファーって言うとわかりにくいですが、比喩表現が直感的理解を助ける、と）
これはヤバイ！Photoshopで目力アップ・ぷるるん唇・美肌補正する魔法のアクション -Skin Retouching | コリス（こんな肌補正がアクションでできちゃうってのがヤバイですね。）
矢野りんのデザイン業務レポート - 第3回クリック率が高いバナー広告のデザイン：ITpro （『私が得た教訓は、「カッコ付けていても何も得られない」』…深いですね）
IllustratorでCSS3のbox-shadowのようなシャドウを作成する方法（イラレ→CSS3ではなく、CSS3ライクなシャドーの作り方ってのが新しい！）
Rriver » いまさら聞けないRetina対応のための「ピクセル」の話（RetinaとかPixelDeviceRatioの解説。とりあえずこれを抑えれば無問題？）
Fireworksでみんな大好き水着美女を描いてリアルな「影」を覚えよう | デザイナーのイラストノート（照り返しまでは気がまわらないですね…「水着美女」に釣られたわけじゃないよw）
ASCII.jp：柔軟性あるデザインプロセスへ移行するためのヒント（ブラウザベース開発メソッド。CSS Nite in SHIZUOKA, Vol.4サイトがこんな感じ）
レスポンシブWebデザインにおけるコーダーの役割 World of granshe. （RWDにまつわる提言。グロナビ2回とかやったことある…身につまされます）
覚え書き@kazuhi.to: レスポンシブWebデザインは「分けて考えない」でうまくいく（上記を受けた木達さんのブログ。「分けて考えない」。なるほどね）

マークアップ / フロントエンド開発 / CMSなど

とりあえずJavaScriptを記述して動作を確認したいって時はFirefoxに搭載のスクラッチパッドが断然便利 - YATのBLOG （これは知らなかった。Chromeでも同じような機能はないのでしょうか…）
floatで予期せぬものが回り込んで表示が崩れちゃうときの対処法 | delaymania （CSSによる回り込みとクリアーの基本的な知識）
スマホサイトでよく見かける横から出てくるメニューを実現する『Sidr』 | IDEA*IDEA （よく見るUIを再現するライブラリ。「車輪の再発明」に最適なのでトライしてみよ）
ガールフレンド（仮）の「声」実装｜1 pixel｜サイバーエージェント公式クリエイターズブログ（HTML5のAPI群で派手なのがAudioとVideo。でもなかなかの鬼門っぷりです）
Layout、Paintingとは何か？レンダリングから学ぶWebサイトのパフォーマンス | Dress Cording （HTML/CSSのレンダリングについて。主にJSer向けですが知っておくとナイスかと）
これからjQueryを始める方へ -入門書の選び方・読み方-[to-R] （ドーナツ本の著者によるjQuery入門書紹介。私は「ドーナツ本→zudo本」でした）

IA・ディレクション・サイト運営など

ユーザーファーストを実現するmixiの開発プロセス - mixi Engineers' Blog （今のmixiにはUXより、離れたユーザーを引き戻せる魅力的なサービスでは…）
ユーザーファーストのmixiに未来はあるか | More Access,More Fun! （ということで、永江さんも噛み付いておられます）
ホームページを育てるための"心得帳" 〜ほったらかしのホームページを救え！〜 : 第1回ホームページは生き物なんです〜ホームページを育てよう〜 | エキスパートコラム | bizYou Webサポート（FC0のおふたりによる新連載。ぜひクライアントさんに読んでいただきたい！）

SEO・SEM・マーケティングなど

コンテンツマーケティングが新しいSEOである理由 | SEO Japan （従来のSEO手法がNGになりコンテンツが大事ってことだと思うのですが…下に続く）
コンテンツマーケティングもSEOも、正直よく分からないのですが… | よかろうもんブログ（SEOと言われるのが違和感で、結局コンテンツが大事ってことは同じに感じますが）
ランディングページに死を | SEO Japan （従来の売り手主体のLPから、ユーザー中心のLPに進化せよって話ですね。納得。）
第2回：企業が抱える2つのウェブ課題--近視眼の罠 - CNET Japan （突き詰めると「Webだけで解決できる問題はほとんどない」。その通り…。）
リスティング運用の素人でもすぐに結果を出すための５つのテクニック | アドリス（リスティング広告の基礎。と言いつつ、勘所はやってみないとわからんのです）
自社サイトをメディア化し、1年で100万PVにして分かった失敗と成功のまとめ。 | 株式会社LIG （徹底的にやれば突破口は開けるようで。内輪受けの域を出てない気はするけど…）

ツール / デバイスなど

Google、WebKitに代わる新レンダリングエンジン「Blink」を発表 - ITmedia ニュース（ブラウザ勢力図に一石を投じる大ニュース。なにせAndroid陣営の総本山ですから）
MozillaとSamsung、Android向け新レンダリングエンジン「Servo」を発表 - ITmedia ニュース（で、同じ日にMozillaも新しいエンジンを発表。ブラウザ戦争再発か…アーメン）
modern.IE(Win8 IE10)をVirtualBoxにいれてみた。 - E-riverstyle Vanguard | CSSやXHTML,Javascriptやweb製作に関する事を紹介（仮想環境のイメージを無償配布するはと、MSも大盤振る舞い。ぜひお試しあれ）
Facebook HomeからHTC Firstまで、今朝のFacebookイベント完全まとめ : ギズモード・ジャパン（噂のFacebookフォン。しかし要求仕様が高い…。試すにも新端末が必要そうです）
WordPress （WP3.6beta1がリリース。どうでもいいけどブログ記事のタイトルおかしくない？）

そのほか

止まらない人材流動：人材は、ITベンダから拡大するWebビジネス市場へ 2013年 IPA調査 - ＠IT （「Web関連ビジネス」って具体的にどのへん？ゲーム開発とか？）
カフェ・雨・波など音楽以外の環境音を無料で流せるWebサービス 10 nanomal （最近の作業BGMは、CoffitivityにiTunesのネットラジオを被せてます）
成長したければ、ひたすら変化すべし - Chikirinの日記 for DU （ジャンルは違えども、こういう発想がCSS Nite in SHIZUOKA, Vol.4の出発点です）
初心者でも3か月でwebサービスを必ず作れるようになる！Webサービス学習資料5選 | 就活の未来大学生のための就活支援サイト（やや玉石混淆な気もしますが、初学者の取っ掛かりにはいいかもしれません）
東京造形大学 | お知らせ＋ニュース詳細 @お知らせ＋ニュース一覧（素晴らしいメッセージですね。一応社会人の自分でもしびれます）

静岡県内のWeb/IT系勉強会からピックアップ

【 Shizuoka.py 】: 日　時 : 2013年04月13日（土） 13:00-17:30; 会　場 : B-nest 演習室4（静岡市）; 定　員 : 40名; 参加費 : 会場代（500円程度）; 概　要 : 静岡(中部)でのpython勉強会

【 UX Shizuoka 2013 #1 】: 日　時 : 2013年04月20日（土）; 会　場 : あざれあ（静岡市）; 定　員 : 30名; 参加費 : 4,000円（学割あり）; 概　要 : UX Shizuokaの第2ラウンド。HCD基礎とオブザベーションワークショップ

【 a-blog cmsの日 in 静岡】: 日　時 : 2013年04月25日（木） 13:00-21:00; 会　場 : B-nest 第一会議室（静岡市）; 定　員 : --; 参加費 : --; 概　要 : 開発元社長とヘビーユーザーがa-blog cmsについていろいろ教えてくれます

【 TalkNote Vol.8「TalkNote .ANW Frontrend」】: 日　時 : 2013年06月08日（土）; 会　場 : グランシップ（静岡市）; 定　員 : 100名; 参加費 : 3,000円; 概　要 : CyberAgent社によるフロントエンド開発の技術紹介（だと思う）

【 CSS Nite in SHIZUOKA, Vol.4 】: 日　時 : 2013年6月15日（土）; 会　場 : グランシップ（静岡市）; 定　員 : 80名; 参加費 : 5,000円（早割4,000円）; 概　要 : 「Webデザインの未来」。HTML5時代のWeb制作のスキルからマインドまで！

【 TalkNote Vol.9 】: 日　時 : 2013年07月13日（土）; 会　場 :; 定　員 :; 参加費 :; 概　要 : SEO特集（らしい）

Facebookページに「いいね！」をお願いします。

Knock! Knock!では、勉強会のFacebookページを運営しています。この勉強会の情報のほか、みなさんのお役に立ちそうな情報を掲載していきますので、ぜひ「いいね！」をお願いいたします。

Knock! Knock!のFacebookページ

また、Facebookページの情報はTwitterにも掲載しています。FacebookよりもTwitterという方は、Twitterのフォローをご検討ください。

Knock! Knock!のTwitter

最後までお読みいただき、ありがとうございました。

HTMLメールについて

現在実験的にHTMLメールにて配信しています。
ご意見・ご要望などありましたら、お気軽におよせください。

メール配信の停止

今後、メールの配信を希望されない方は、
お手数ですがこのメールに「メール不要」とご記入のうえご返信ください。

このページはお役に立ちましたでしょうか。よろしければシェアしてください。