SlideShare a Scribd company logo
1 of 50
Download to read offline
イ ス レーターでWebデザ ンしても
ラ ト
イ
制作現場で嫌われないデータ作成術
2013年12月6日
Knock! Knock! 勉強会

矢部靖人
1)Webデザインでイ
ラレはなぜ嫌われるのか
2)今イラレが注目される理由
3)Webデザイ
ンでイ
ラレを使うTips
今日の話は Webデザインの良し悪し」
「
ではなく、
「Webデザイ “データ”
ン用
の良し悪し」
です
1)
ラレはなぜ嫌われるのか
Webデザインでイ
イラレでWebデザインしても嫌われないデータ作成術
・ ラレ て…DTPの人がデザインしたんでし ?
イ っ
ょ
→ Webのお作法とかわかっ
てないんだか
ら…
・ ん りイ
あ ま ラレ得意じゃないんだよね
→ 普通Psでし ? 微妙に使いにく
ょ
いんだよね…
・
エッジがにじむし、
画像が足
りなかった るし
りす
→ データ
が汚いんだよね…
イラレでWebデザインしても嫌われないデータ作成術
イ
ラレがWeb制作現場で嫌われる原因
その多く
は先入観…
お互いに歩み寄 ませ
り んか
DTPもWebもない、
CS4まではWeb向きではなかった
今は?
り使え うにな ま
るよ
り した
Webでもかな
イ
ラレだっ
てデキ
る子なんです
!
ただ、
これだけだと
“積極的にイ
ラレ”
とはいかない…
2) ラレが注目される理由
今イ
イラレでWebデザインしても嫌われないデータ作成術
Fireworks CS6で事実上の開発停止
なく
なったわけないけど、
次を考えないと…
イラレでWebデザインしても嫌われないデータ作成術
求められるマルチデバイ
ス対応
・
多様なデバイ (PC スマホ ゲーム機…)
ス
・
・
・
多様なスク
リーンサイ (スマホ∼PC)
ズ
・
多様な画面解像度 device pixel ratio)
(
個別最適化は不可能 → 汎用的に構築したい
汎用的なパーツ制作
・
・
・
CSS3によるグラデーション 角丸 変形 etc...
・
ォン
Webフ ト
・
(ベク
ター形式によ Web用画像)
る
SVG
ベク
ター形式 = 拡大縮小に強い
 → 画面サイ ・
ズ 画面解像度に依存しない
イラレでWebデザインしても嫌われないデータ作成術
ター形式といえば
Adobeでベク
Illustrator! Illustrator! Illustrator!
このあた
りのお話は、
またいずれかの機会に…
3)
ラレを使うTips
Webデザインでイ
問題 :エッジがにじむ
原因 : ピクセルに整合し
ていない
イラレでWebデザインしても嫌われないデータ作成術
イラレでWebデザインしても嫌われないデータ作成術
イラレでWebデザインしても嫌われないデータ作成術
要は、
ピクセルとい“単位” の上手なお付き合い
う
と
大原則:単位はピクセル、
数値は整数
単位はピクセル
イラレでWebデザインしても嫌われないデータ作成術
イラレでWebデザインしても嫌われないデータ作成術
数値は整数
・
「ピクセルグリ ドに整合」 ェ
ッ
にチ ック
・
「新規オブジェ ト
ク をピクセルグリ ドに整合」 ェ
ッ
にチ ック
・
情報パネル / 変形パネルでこ
まめに確認
・
ただし例外もあ (数幅が奇数の線など)
る
・ と、
あ 安易な拡大縮小はデータ
を汚す原因
基準点は左上がベター Webのお作法)
(

チ ック
ェ

※「線幅と効果も拡大 縮小」 ェ を入れないのがオススメ
・
はチ ック
線の位置
イ
ラレ上のオブジェ トサイ
ク
ズはすべて30px × 30px
赤のエリ
ア
29px × 29px

赤のエリ
ア
28px × 28px

赤のエリ
ア
3 px × 30px
0

線を中央に揃え
る

線を内側に揃え
る

線を外側に揃え
る
・
線の位置は
「内側に揃え or
る」「外側に揃え
る」
・
「外側」
がいいとい
う話も…
→ http://www.dtp-transit.jp/adobe/illustrator/post_1797.html
参)
スモデル
Webのボック
(外側の余白)
Margin
(内側の余白)
Padding

Width

Height

(
Border 線)
イ
ラレ上でピクセル描画を確認す
る
ちなみに
「校正設定」
は
「インターネッ
ト標準RGB(sRGB)」
「新規ドキ メン ダ アログでは Web」
ュ ト」 イ
「
を選択
ドキ メント製作時の設定で、
ュ
大半はク アでき
リ
ます
プロフ イ
ァ ルはWebを選択
複数ページを ファ ルに入れるな
1 イ
ら
ページごとにアート
ボードを分けま ょ
しう

※ 設定を変更す と カスタ にな ます
る
ム
り

サイ
ズは任意
らいが一般的?)
(w1200く

プレビューモードは
「ピクセル」
に変更
・
Web特有のデザイン 情報
・
そんなフ ト、
ォン 普通入っ
てませんか !
ら
(デバイ
ステキストのフ
ォント指定 / アウト
ライン化)
・
画像にし
て欲しいテキスト / 画像にしないテキ
スト
・
マウスオーバー時の変化
(ボタ / リ
ン
ンクテキ
スト)
・ (アニメーション)/ ギミ
動き
ックは伝わるよ
うに
・
画像は72dpiで くは150dpi) 350dpiとか重いだけです
(もし
。
・
ブラウザによ
る差異もあ 完璧な再現は不毛です
り、
結局は人と人
DTPにはDTPの、
WebにはWebのお作法がある
つま 「郷に入 ては郷に従え」 う と
り、
り
とい こ
デザイナー: 今度のWebデザイン、 ラレでいいですか?
イ
コーダー :うーん
(仕方ない
っすね)
デザイナー: あ りWebに慣れてないん
ま
で、
何か不都合があ
ったら直すので言っ
てくださいね
コーダー :じゃあ、 っちでいい感じに直し
こ
ますよ。
う く
ま ないとこ
ろは、 らチ ック てく
後か ェ し ださい。
両者
:そんな感じでお願いし
ます
イラレでWebデザインしても嫌われないデータ作成術
参考
・ IllustratorでWeb向けの作業を行 ときのチ ック スト DTP Transit)
う
ェ リ (

http://www.dtp-transit.jp/adobe/illustrator/post_1160.html
・ IllustratorでWEBデザインを納品す
る方法 CS5版)く
(
( ずはて)

http://www.kuzuhate.com/web-soft/illustrator/553/
・マルチデバイ
ス時代にあ
りがたい イ
! ラレのあれこれ

http://www.slideshare.net/awayukin/gachinko-awayuki-share
実装に困っ ら
た ご連絡く
ださい
!
本日はあ がと ございま
り う
した
ご連絡 ご質問など下記までお願いし
・
ます
E-mail : info@hamnaly.com
Facebook / Twitter : yabecchy

More Related Content

What's hot

Webサービスをデザインするってどういうこと?
Webサービスをデザインするってどういうこと?Webサービスをデザインするってどういうこと?
Webサービスをデザインするってどういうこと?Kanako Kawahara
 
プログラマがデザインをがんばってみた
プログラマがデザインをがんばってみたプログラマがデザインをがんばってみた
プログラマがデザインをがんばってみただいすけ ふるかわ
 
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニックデキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニックAkiko Kurono
 
WEBデザインにおける、Photoshopの作業速度向上テクニック 先生:黒葛原 道
WEBデザインにおける、Photoshopの作業速度向上テクニック 先生:黒葛原 道WEBデザインにおける、Photoshopの作業速度向上テクニック 先生:黒葛原 道
WEBデザインにおける、Photoshopの作業速度向上テクニック 先生:黒葛原 道schoowebcampus
 
聞いて覚えるマテリアルデザイン入門
聞いて覚えるマテリアルデザイン入門聞いて覚えるマテリアルデザイン入門
聞いて覚えるマテリアルデザイン入門正樹 平野
 
アクセシビリティとこれからのWebデザイン
アクセシビリティとこれからのWebデザインアクセシビリティとこれからのWebデザイン
アクセシビリティとこれからのWebデザイン力也 伊原
 
これからのWebデザイナーのキャリアプラン
これからのWebデザイナーのキャリアプランこれからのWebデザイナーのキャリアプラン
これからのWebデザイナーのキャリアプランSasaki Kouhei
 
「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)
「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)
「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)swwwitch inc.
 
20160124_GPL勉強会
20160124_GPL勉強会20160124_GPL勉強会
20160124_GPL勉強会rie05
 
コンバージョン心理学によるウェブ・デザイン
コンバージョン心理学によるウェブ・デザインコンバージョン心理学によるウェブ・デザイン
コンバージョン心理学によるウェブ・デザインToshihiko Yamakami
 
習ったことはありませんがこんな感じでWebデザインを教えてます
習ったことはありませんがこんな感じでWebデザインを教えてます習ったことはありませんがこんな感じでWebデザインを教えてます
習ったことはありませんがこんな感じでWebデザインを教えてますKyo Kaji
 
Illustratorのカンプとうまく付き合う方法
Illustratorのカンプとうまく付き合う方法Illustratorのカンプとうまく付き合う方法
Illustratorのカンプとうまく付き合う方法Takuya Nishitani
 
アイデアを塩漬けにしない-世界中の人に手伝ってもらう方法-
アイデアを塩漬けにしない-世界中の人に手伝ってもらう方法-アイデアを塩漬けにしない-世界中の人に手伝ってもらう方法-
アイデアを塩漬けにしない-世界中の人に手伝ってもらう方法-nishio
 
プロトタイピングツール投入のケーススタディ
プロトタイピングツール投入のケーススタディプロトタイピングツール投入のケーススタディ
プロトタイピングツール投入のケーススタディ力也 伊原
 
Webデザイナー1年生の為のしおり
Webデザイナー1年生の為のしおりWebデザイナー1年生の為のしおり
Webデザイナー1年生の為のしおりtomoakitomono
 
フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大
フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大
フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大schoowebcampus
 
20121117 01 dir-mtgスライド01
20121117 01 dir-mtgスライド0120121117 01 dir-mtgスライド01
20121117 01 dir-mtgスライド01Kenta Nakamura
 
ディレクターが知っておくべき3つのデザインディレクションのルール
ディレクターが知っておくべき3つのデザインディレクションのルールディレクターが知っておくべき3つのデザインディレクションのルール
ディレクターが知っておくべき3つのデザインディレクションのルールINFOBAHN.inc(株式会社インフォバーン)
 
Webサイトのようには作れない!Webアプリ設計の考え方
Webサイトのようには作れない!Webアプリ設計の考え方Webサイトのようには作れない!Webアプリ設計の考え方
Webサイトのようには作れない!Webアプリ設計の考え方girigiribauer
 

What's hot (19)

Webサービスをデザインするってどういうこと?
Webサービスをデザインするってどういうこと?Webサービスをデザインするってどういうこと?
Webサービスをデザインするってどういうこと?
 
プログラマがデザインをがんばってみた
プログラマがデザインをがんばってみたプログラマがデザインをがんばってみた
プログラマがデザインをがんばってみた
 
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニックデキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
 
WEBデザインにおける、Photoshopの作業速度向上テクニック 先生:黒葛原 道
WEBデザインにおける、Photoshopの作業速度向上テクニック 先生:黒葛原 道WEBデザインにおける、Photoshopの作業速度向上テクニック 先生:黒葛原 道
WEBデザインにおける、Photoshopの作業速度向上テクニック 先生:黒葛原 道
 
聞いて覚えるマテリアルデザイン入門
聞いて覚えるマテリアルデザイン入門聞いて覚えるマテリアルデザイン入門
聞いて覚えるマテリアルデザイン入門
 
アクセシビリティとこれからのWebデザイン
アクセシビリティとこれからのWebデザインアクセシビリティとこれからのWebデザイン
アクセシビリティとこれからのWebデザイン
 
これからのWebデザイナーのキャリアプラン
これからのWebデザイナーのキャリアプランこれからのWebデザイナーのキャリアプラン
これからのWebデザイナーのキャリアプラン
 
「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)
「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)
「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)
 
20160124_GPL勉強会
20160124_GPL勉強会20160124_GPL勉強会
20160124_GPL勉強会
 
コンバージョン心理学によるウェブ・デザイン
コンバージョン心理学によるウェブ・デザインコンバージョン心理学によるウェブ・デザイン
コンバージョン心理学によるウェブ・デザイン
 
習ったことはありませんがこんな感じでWebデザインを教えてます
習ったことはありませんがこんな感じでWebデザインを教えてます習ったことはありませんがこんな感じでWebデザインを教えてます
習ったことはありませんがこんな感じでWebデザインを教えてます
 
Illustratorのカンプとうまく付き合う方法
Illustratorのカンプとうまく付き合う方法Illustratorのカンプとうまく付き合う方法
Illustratorのカンプとうまく付き合う方法
 
アイデアを塩漬けにしない-世界中の人に手伝ってもらう方法-
アイデアを塩漬けにしない-世界中の人に手伝ってもらう方法-アイデアを塩漬けにしない-世界中の人に手伝ってもらう方法-
アイデアを塩漬けにしない-世界中の人に手伝ってもらう方法-
 
プロトタイピングツール投入のケーススタディ
プロトタイピングツール投入のケーススタディプロトタイピングツール投入のケーススタディ
プロトタイピングツール投入のケーススタディ
 
Webデザイナー1年生の為のしおり
Webデザイナー1年生の為のしおりWebデザイナー1年生の為のしおり
Webデザイナー1年生の為のしおり
 
フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大
フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大
フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大
 
20121117 01 dir-mtgスライド01
20121117 01 dir-mtgスライド0120121117 01 dir-mtgスライド01
20121117 01 dir-mtgスライド01
 
ディレクターが知っておくべき3つのデザインディレクションのルール
ディレクターが知っておくべき3つのデザインディレクションのルールディレクターが知っておくべき3つのデザインディレクションのルール
ディレクターが知っておくべき3つのデザインディレクションのルール
 
Webサイトのようには作れない!Webアプリ設計の考え方
Webサイトのようには作れない!Webアプリ設計の考え方Webサイトのようには作れない!Webアプリ設計の考え方
Webサイトのようには作れない!Webアプリ設計の考え方
 

Similar to イラレでWebデザインしても嫌われないデータ作成術

さあ、デザインをはじめよう。DevLOVE関西
さあ、デザインをはじめよう。DevLOVE関西さあ、デザインをはじめよう。DevLOVE関西
さあ、デザインをはじめよう。DevLOVE関西rie05
 
2012 12-17-titanium meetupvol4
2012 12-17-titanium meetupvol42012 12-17-titanium meetupvol4
2012 12-17-titanium meetupvol4Hiroshi Oyamada
 
20140913 ディレクション講演資料(山盛り)
20140913 ディレクション講演資料(山盛り)20140913 ディレクション講演資料(山盛り)
20140913 ディレクション講演資料(山盛り)Kenta Nakamura
 
私がRails Girls Sendaiをやろうと思ったワケ
私がRails Girls Sendaiをやろうと思ったワケ私がRails Girls Sendaiをやろうと思ったワケ
私がRails Girls Sendaiをやろうと思ったワケthatblue
 
改善したほうがいい私の7つの開発習慣
改善したほうがいい私の7つの開発習慣改善したほうがいい私の7つの開発習慣
改善したほうがいい私の7つの開発習慣Noriaki Kadota
 
ゼミ報告会20141203
ゼミ報告会20141203ゼミ報告会20141203
ゼミ報告会20141203Sayaka Mine
 
Wcan2011 winter takeproject
Wcan2011 winter takeprojectWcan2011 winter takeproject
Wcan2011 winter takeprojectTRIDENT
 
UIの色のコントラスト比十分ですか?
UIの色のコントラスト比十分ですか?UIの色のコントラスト比十分ですか?
UIの色のコントラスト比十分ですか?Kasumi Morita
 
Data Visualizationしてみた [ D3.js編 ]
Data Visualizationしてみた  [ D3.js編 ]Data Visualizationしてみた  [ D3.js編 ]
Data Visualizationしてみた [ D3.js編 ]weddingpark
 
簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション
簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション
簡単!低コスト!楽しい!レスポンシブ デザイン ディレクションYuji Nojima
 

Similar to イラレでWebデザインしても嫌われないデータ作成術 (12)

Indigo.Design概要
Indigo.Design概要Indigo.Design概要
Indigo.Design概要
 
さあ、デザインをはじめよう。DevLOVE関西
さあ、デザインをはじめよう。DevLOVE関西さあ、デザインをはじめよう。DevLOVE関西
さあ、デザインをはじめよう。DevLOVE関西
 
2012 12-17-titanium meetupvol4
2012 12-17-titanium meetupvol42012 12-17-titanium meetupvol4
2012 12-17-titanium meetupvol4
 
20140913 ディレクション講演資料(山盛り)
20140913 ディレクション講演資料(山盛り)20140913 ディレクション講演資料(山盛り)
20140913 ディレクション講演資料(山盛り)
 
私がRails Girls Sendaiをやろうと思ったワケ
私がRails Girls Sendaiをやろうと思ったワケ私がRails Girls Sendaiをやろうと思ったワケ
私がRails Girls Sendaiをやろうと思ったワケ
 
改善したほうがいい私の7つの開発習慣
改善したほうがいい私の7つの開発習慣改善したほうがいい私の7つの開発習慣
改善したほうがいい私の7つの開発習慣
 
ゼミ報告会20141203
ゼミ報告会20141203ゼミ報告会20141203
ゼミ報告会20141203
 
Wcan2011 winter takeproject
Wcan2011 winter takeprojectWcan2011 winter takeproject
Wcan2011 winter takeproject
 
UIの色のコントラスト比十分ですか?
UIの色のコントラスト比十分ですか?UIの色のコントラスト比十分ですか?
UIの色のコントラスト比十分ですか?
 
Data Visualizationしてみた [ D3.js編 ]
Data Visualizationしてみた  [ D3.js編 ]Data Visualizationしてみた  [ D3.js編 ]
Data Visualizationしてみた [ D3.js編 ]
 
Lt41
Lt41Lt41
Lt41
 
簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション
簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション
簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション
 

More from Yasuhito Yabe

Designer Meets Bootstrap(22th Knock!)
Designer Meets Bootstrap(22th Knock!)Designer Meets Bootstrap(22th Knock!)
Designer Meets Bootstrap(22th Knock!)Yasuhito Yabe
 
20131206 静岡web制作界隈ゆく年くる年2013
20131206 静岡web制作界隈ゆく年くる年201320131206 静岡web制作界隈ゆく年くる年2013
20131206 静岡web制作界隈ゆく年くる年2013Yasuhito Yabe
 
「html5 boilerplate」から考える、これからのマークアップ
「html5 boilerplate」から考える、これからのマークアップ「html5 boilerplate」から考える、これからのマークアップ
「html5 boilerplate」から考える、これからのマークアップYasuhito Yabe
 
レスポンシブWebデザイン【発展編】
レスポンシブWebデザイン【発展編】レスポンシブWebデザイン【発展編】
レスポンシブWebデザイン【発展編】Yasuhito Yabe
 
レスポンシブWebデザイン【基礎編】
レスポンシブWebデザイン【基礎編】レスポンシブWebデザイン【基礎編】
レスポンシブWebデザイン【基礎編】Yasuhito Yabe
 
静岡Web制作界隈 ゆく年くる年 2012
静岡Web制作界隈 ゆく年くる年 2012静岡Web制作界隈 ゆく年くる年 2012
静岡Web制作界隈 ゆく年くる年 2012Yasuhito Yabe
 
あらためて考えるCMS選択 2012
あらためて考えるCMS選択 2012あらためて考えるCMS選択 2012
あらためて考えるCMS選択 2012Yasuhito Yabe
 
Htmlコーディングの効率化 後編
Htmlコーディングの効率化 後編Htmlコーディングの効率化 後編
Htmlコーディングの効率化 後編Yasuhito Yabe
 
Htmlコーディングの効率化 前編
Htmlコーディングの効率化 前編Htmlコーディングの効率化 前編
Htmlコーディングの効率化 前編Yasuhito Yabe
 
jQueryでiTunes Store風スライドショーを作ってみる
jQueryでiTunes Store風スライドショーを作ってみるjQueryでiTunes Store風スライドショーを作ってみる
jQueryでiTunes Store風スライドショーを作ってみるYasuhito Yabe
 
Web制作者のためのWebマーケティング用語と計算式
Web制作者のためのWebマーケティング用語と計算式Web制作者のためのWebマーケティング用語と計算式
Web制作者のためのWebマーケティング用語と計算式Yasuhito Yabe
 
Knock! Knock! サイトができるまで
Knock! Knock! サイトができるまでKnock! Knock! サイトができるまで
Knock! Knock! サイトができるまでYasuhito Yabe
 
今日からはじめるHTML5 ver.2012
今日からはじめるHTML5 ver.2012今日からはじめるHTML5 ver.2012
今日からはじめるHTML5 ver.2012Yasuhito Yabe
 
みんビズ その傾向と対策
みんビズ その傾向と対策みんビズ その傾向と対策
みんビズ その傾向と対策Yasuhito Yabe
 
20111001 adobe edgeとhtml5_css3_javascrit
20111001 adobe edgeとhtml5_css3_javascrit20111001 adobe edgeとhtml5_css3_javascrit
20111001 adobe edgeとhtml5_css3_javascritYasuhito Yabe
 
a-blog cms 事例紹介(TalkNote Vol.1)
a-blog cms 事例紹介(TalkNote Vol.1)a-blog cms 事例紹介(TalkNote Vol.1)
a-blog cms 事例紹介(TalkNote Vol.1)Yasuhito Yabe
 

More from Yasuhito Yabe (17)

Designer Meets Bootstrap(22th Knock!)
Designer Meets Bootstrap(22th Knock!)Designer Meets Bootstrap(22th Knock!)
Designer Meets Bootstrap(22th Knock!)
 
20131206 静岡web制作界隈ゆく年くる年2013
20131206 静岡web制作界隈ゆく年くる年201320131206 静岡web制作界隈ゆく年くる年2013
20131206 静岡web制作界隈ゆく年くる年2013
 
「html5 boilerplate」から考える、これからのマークアップ
「html5 boilerplate」から考える、これからのマークアップ「html5 boilerplate」から考える、これからのマークアップ
「html5 boilerplate」から考える、これからのマークアップ
 
レスポンシブWebデザイン【発展編】
レスポンシブWebデザイン【発展編】レスポンシブWebデザイン【発展編】
レスポンシブWebデザイン【発展編】
 
レスポンシブWebデザイン【基礎編】
レスポンシブWebデザイン【基礎編】レスポンシブWebデザイン【基礎編】
レスポンシブWebデザイン【基礎編】
 
静岡Web制作界隈 ゆく年くる年 2012
静岡Web制作界隈 ゆく年くる年 2012静岡Web制作界隈 ゆく年くる年 2012
静岡Web制作界隈 ゆく年くる年 2012
 
あらためて考えるCMS選択 2012
あらためて考えるCMS選択 2012あらためて考えるCMS選択 2012
あらためて考えるCMS選択 2012
 
Htmlコーディングの効率化 後編
Htmlコーディングの効率化 後編Htmlコーディングの効率化 後編
Htmlコーディングの効率化 後編
 
Htmlコーディングの効率化 前編
Htmlコーディングの効率化 前編Htmlコーディングの効率化 前編
Htmlコーディングの効率化 前編
 
jQueryでiTunes Store風スライドショーを作ってみる
jQueryでiTunes Store風スライドショーを作ってみるjQueryでiTunes Store風スライドショーを作ってみる
jQueryでiTunes Store風スライドショーを作ってみる
 
Web制作者のためのWebマーケティング用語と計算式
Web制作者のためのWebマーケティング用語と計算式Web制作者のためのWebマーケティング用語と計算式
Web制作者のためのWebマーケティング用語と計算式
 
jQuery超入門編
jQuery超入門編jQuery超入門編
jQuery超入門編
 
Knock! Knock! サイトができるまで
Knock! Knock! サイトができるまでKnock! Knock! サイトができるまで
Knock! Knock! サイトができるまで
 
今日からはじめるHTML5 ver.2012
今日からはじめるHTML5 ver.2012今日からはじめるHTML5 ver.2012
今日からはじめるHTML5 ver.2012
 
みんビズ その傾向と対策
みんビズ その傾向と対策みんビズ その傾向と対策
みんビズ その傾向と対策
 
20111001 adobe edgeとhtml5_css3_javascrit
20111001 adobe edgeとhtml5_css3_javascrit20111001 adobe edgeとhtml5_css3_javascrit
20111001 adobe edgeとhtml5_css3_javascrit
 
a-blog cms 事例紹介(TalkNote Vol.1)
a-blog cms 事例紹介(TalkNote Vol.1)a-blog cms 事例紹介(TalkNote Vol.1)
a-blog cms 事例紹介(TalkNote Vol.1)
 

Recently uploaded

「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-LoopへTetsuya Nihonmatsu
 
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~arts yokohama
 
2024 01 Virtual_Counselor
2024 01 Virtual_Counselor 2024 01 Virtual_Counselor
2024 01 Virtual_Counselor arts yokohama
 
ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦
ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦
ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦Sadao Tokuyama
 
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見Shumpei Kishi
 
20240326_IoTLT_vol109_kitazaki_v1___.pdf
20240326_IoTLT_vol109_kitazaki_v1___.pdf20240326_IoTLT_vol109_kitazaki_v1___.pdf
20240326_IoTLT_vol109_kitazaki_v1___.pdfAyachika Kitazaki
 
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法ssuser370dd7
 
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdfTaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdfMatsushita Laboratory
 
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)ssuser539845
 

Recently uploaded (12)

「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
 
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
 
2024 01 Virtual_Counselor
2024 01 Virtual_Counselor 2024 01 Virtual_Counselor
2024 01 Virtual_Counselor
 
ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦
ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦
ARスタートアップOnePlanetの Apple Vision Proへの情熱と挑戦
 
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
 
2024 04 minnanoito
2024 04 minnanoito2024 04 minnanoito
2024 04 minnanoito
 
2024 03 CTEA
2024 03 CTEA2024 03 CTEA
2024 03 CTEA
 
20240326_IoTLT_vol109_kitazaki_v1___.pdf
20240326_IoTLT_vol109_kitazaki_v1___.pdf20240326_IoTLT_vol109_kitazaki_v1___.pdf
20240326_IoTLT_vol109_kitazaki_v1___.pdf
 
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
 
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdfTaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
 
What is the world where you can make your own semiconductors?
What is the world where you can make your own semiconductors?What is the world where you can make your own semiconductors?
What is the world where you can make your own semiconductors?
 
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
 

イラレでWebデザインしても嫌われないデータ作成術