Submit Search
Upload
イラレでWebデザインしても嫌われないデータ作成術
•
37 likes
•
38,263 views
Yasuhito Yabe
Follow
http://knock3.hamnaly.com/vol20/20thKnock-follow-yabe-illustrator-de-WebDesign.html
Read less
Read more
Technology
Report
Share
Report
Share
1 of 50
Download now
Download to read offline
Recommended
デザインはおまかせで、丸投げされた時どうする?
デザインはおまかせで、丸投げされた時どうする?
rie05
デザイン仕様書(ガイド)の書き方 (初歩者用)
デザイン仕様書(ガイド)の書き方 (初歩者用)
witstudio
レスポンシブWebデザインの基礎
レスポンシブWebデザインの基礎
Hiroyuki Ogawa
コーディングを考慮したWebデザインガイドライン
コーディングを考慮したWebデザインガイドライン
Hiroyuki Makishita
Webデザインのトーン&マナーを導き出す手法
Webデザインのトーン&マナーを導き出す手法
Katsumi Tazuke
Webデザインのセオリーを学ぼう
Webデザインのセオリーを学ぼう
Toshiaki Sasaki
141219 まにフェス
141219 まにフェス
rie05
WordCamp Kansai 2015 デザイン初心者向けワークショップ〜 ブログデザインを実際に作ってみよう〜
WordCamp Kansai 2015 デザイン初心者向けワークショップ〜 ブログデザインを実際に作ってみよう〜
Ayaka Sumida
Recommended
デザインはおまかせで、丸投げされた時どうする?
デザインはおまかせで、丸投げされた時どうする?
rie05
デザイン仕様書(ガイド)の書き方 (初歩者用)
デザイン仕様書(ガイド)の書き方 (初歩者用)
witstudio
レスポンシブWebデザインの基礎
レスポンシブWebデザインの基礎
Hiroyuki Ogawa
コーディングを考慮したWebデザインガイドライン
コーディングを考慮したWebデザインガイドライン
Hiroyuki Makishita
Webデザインのトーン&マナーを導き出す手法
Webデザインのトーン&マナーを導き出す手法
Katsumi Tazuke
Webデザインのセオリーを学ぼう
Webデザインのセオリーを学ぼう
Toshiaki Sasaki
141219 まにフェス
141219 まにフェス
rie05
WordCamp Kansai 2015 デザイン初心者向けワークショップ〜 ブログデザインを実際に作ってみよう〜
WordCamp Kansai 2015 デザイン初心者向けワークショップ〜 ブログデザインを実際に作ってみよう〜
Ayaka Sumida
Webサービスをデザインするってどういうこと?
Webサービスをデザインするってどういうこと?
Kanako Kawahara
プログラマがデザインをがんばってみた
プログラマがデザインをがんばってみた
だいすけ ふるかわ
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
Akiko Kurono
WEBデザインにおける、Photoshopの作業速度向上テクニック 先生:黒葛原 道
WEBデザインにおける、Photoshopの作業速度向上テクニック 先生:黒葛原 道
schoowebcampus
聞いて覚えるマテリアルデザイン入門
聞いて覚えるマテリアルデザイン入門
正樹 平野
アクセシビリティとこれからのWebデザイン
アクセシビリティとこれからのWebデザイン
力也 伊原
これからのWebデザイナーのキャリアプラン
これからのWebデザイナーのキャリアプラン
Sasaki Kouhei
「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)
「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)
swwwitch inc.
20160124_GPL勉強会
20160124_GPL勉強会
rie05
コンバージョン心理学によるウェブ・デザイン
コンバージョン心理学によるウェブ・デザイン
Toshihiko Yamakami
習ったことはありませんがこんな感じでWebデザインを教えてます
習ったことはありませんがこんな感じでWebデザインを教えてます
Kyo Kaji
Illustratorのカンプとうまく付き合う方法
Illustratorのカンプとうまく付き合う方法
Takuya Nishitani
アイデアを塩漬けにしない-世界中の人に手伝ってもらう方法-
アイデアを塩漬けにしない-世界中の人に手伝ってもらう方法-
nishio
プロトタイピングツール投入のケーススタディ
プロトタイピングツール投入のケーススタディ
力也 伊原
Webデザイナー1年生の為のしおり
Webデザイナー1年生の為のしおり
tomoakitomono
フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大
フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大
schoowebcampus
20121117 01 dir-mtgスライド01
20121117 01 dir-mtgスライド01
Kenta Nakamura
ディレクターが知っておくべき3つのデザインディレクションのルール
ディレクターが知っておくべき3つのデザインディレクションのルール
INFOBAHN.inc(株式会社インフォバーン)
Webサイトのようには作れない!Webアプリ設計の考え方
Webサイトのようには作れない!Webアプリ設計の考え方
girigiribauer
Indigo.Design概要
Indigo.Design概要
インフラジスティックス・ジャパン株式会社
さあ、デザインをはじめよう。DevLOVE関西
さあ、デザインをはじめよう。DevLOVE関西
rie05
2012 12-17-titanium meetupvol4
2012 12-17-titanium meetupvol4
Hiroshi Oyamada
More Related Content
What's hot
Webサービスをデザインするってどういうこと?
Webサービスをデザインするってどういうこと?
Kanako Kawahara
プログラマがデザインをがんばってみた
プログラマがデザインをがんばってみた
だいすけ ふるかわ
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
Akiko Kurono
WEBデザインにおける、Photoshopの作業速度向上テクニック 先生:黒葛原 道
WEBデザインにおける、Photoshopの作業速度向上テクニック 先生:黒葛原 道
schoowebcampus
聞いて覚えるマテリアルデザイン入門
聞いて覚えるマテリアルデザイン入門
正樹 平野
アクセシビリティとこれからのWebデザイン
アクセシビリティとこれからのWebデザイン
力也 伊原
これからのWebデザイナーのキャリアプラン
これからのWebデザイナーのキャリアプラン
Sasaki Kouhei
「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)
「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)
swwwitch inc.
20160124_GPL勉強会
20160124_GPL勉強会
rie05
コンバージョン心理学によるウェブ・デザイン
コンバージョン心理学によるウェブ・デザイン
Toshihiko Yamakami
習ったことはありませんがこんな感じでWebデザインを教えてます
習ったことはありませんがこんな感じでWebデザインを教えてます
Kyo Kaji
Illustratorのカンプとうまく付き合う方法
Illustratorのカンプとうまく付き合う方法
Takuya Nishitani
アイデアを塩漬けにしない-世界中の人に手伝ってもらう方法-
アイデアを塩漬けにしない-世界中の人に手伝ってもらう方法-
nishio
プロトタイピングツール投入のケーススタディ
プロトタイピングツール投入のケーススタディ
力也 伊原
Webデザイナー1年生の為のしおり
Webデザイナー1年生の為のしおり
tomoakitomono
フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大
フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大
schoowebcampus
20121117 01 dir-mtgスライド01
20121117 01 dir-mtgスライド01
Kenta Nakamura
ディレクターが知っておくべき3つのデザインディレクションのルール
ディレクターが知っておくべき3つのデザインディレクションのルール
INFOBAHN.inc(株式会社インフォバーン)
Webサイトのようには作れない!Webアプリ設計の考え方
Webサイトのようには作れない!Webアプリ設計の考え方
girigiribauer
What's hot
(19)
Webサービスをデザインするってどういうこと?
Webサービスをデザインするってどういうこと?
プログラマがデザインをがんばってみた
プログラマがデザインをがんばってみた
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック
WEBデザインにおける、Photoshopの作業速度向上テクニック 先生:黒葛原 道
WEBデザインにおける、Photoshopの作業速度向上テクニック 先生:黒葛原 道
聞いて覚えるマテリアルデザイン入門
聞いて覚えるマテリアルデザイン入門
アクセシビリティとこれからのWebデザイン
アクセシビリティとこれからのWebデザイン
これからのWebデザイナーのキャリアプラン
これからのWebデザイナーのキャリアプラン
「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)
「Webデザイナーのためのタイポグラフィと文字組版(Reloaded)」鷹野 雅弘(スイッチ)
20160124_GPL勉強会
20160124_GPL勉強会
コンバージョン心理学によるウェブ・デザイン
コンバージョン心理学によるウェブ・デザイン
習ったことはありませんがこんな感じでWebデザインを教えてます
習ったことはありませんがこんな感じでWebデザインを教えてます
Illustratorのカンプとうまく付き合う方法
Illustratorのカンプとうまく付き合う方法
アイデアを塩漬けにしない-世界中の人に手伝ってもらう方法-
アイデアを塩漬けにしない-世界中の人に手伝ってもらう方法-
プロトタイピングツール投入のケーススタディ
プロトタイピングツール投入のケーススタディ
Webデザイナー1年生の為のしおり
Webデザイナー1年生の為のしおり
フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大
フラットデザインに出来ること/出来ないことを学ぶ 先生:橘 雄大
20121117 01 dir-mtgスライド01
20121117 01 dir-mtgスライド01
ディレクターが知っておくべき3つのデザインディレクションのルール
ディレクターが知っておくべき3つのデザインディレクションのルール
Webサイトのようには作れない!Webアプリ設計の考え方
Webサイトのようには作れない!Webアプリ設計の考え方
Similar to イラレでWebデザインしても嫌われないデータ作成術
Indigo.Design概要
Indigo.Design概要
インフラジスティックス・ジャパン株式会社
さあ、デザインをはじめよう。DevLOVE関西
さあ、デザインをはじめよう。DevLOVE関西
rie05
2012 12-17-titanium meetupvol4
2012 12-17-titanium meetupvol4
Hiroshi Oyamada
20140913 ディレクション講演資料(山盛り)
20140913 ディレクション講演資料(山盛り)
Kenta Nakamura
私がRails Girls Sendaiをやろうと思ったワケ
私がRails Girls Sendaiをやろうと思ったワケ
thatblue
改善したほうがいい私の7つの開発習慣
改善したほうがいい私の7つの開発習慣
Noriaki Kadota
ゼミ報告会20141203
ゼミ報告会20141203
Sayaka Mine
Wcan2011 winter takeproject
Wcan2011 winter takeproject
TRIDENT
UIの色のコントラスト比十分ですか?
UIの色のコントラスト比十分ですか?
Kasumi Morita
Data Visualizationしてみた [ D3.js編 ]
Data Visualizationしてみた [ D3.js編 ]
weddingpark
Lt41
Lt41
GIG inc.
簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション
簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション
Yuji Nojima
Similar to イラレでWebデザインしても嫌われないデータ作成術
(12)
Indigo.Design概要
Indigo.Design概要
さあ、デザインをはじめよう。DevLOVE関西
さあ、デザインをはじめよう。DevLOVE関西
2012 12-17-titanium meetupvol4
2012 12-17-titanium meetupvol4
20140913 ディレクション講演資料(山盛り)
20140913 ディレクション講演資料(山盛り)
私がRails Girls Sendaiをやろうと思ったワケ
私がRails Girls Sendaiをやろうと思ったワケ
改善したほうがいい私の7つの開発習慣
改善したほうがいい私の7つの開発習慣
ゼミ報告会20141203
ゼミ報告会20141203
Wcan2011 winter takeproject
Wcan2011 winter takeproject
UIの色のコントラスト比十分ですか?
UIの色のコントラスト比十分ですか?
Data Visualizationしてみた [ D3.js編 ]
Data Visualizationしてみた [ D3.js編 ]
Lt41
Lt41
簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション
簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション
More from Yasuhito Yabe
Designer Meets Bootstrap(22th Knock!)
Designer Meets Bootstrap(22th Knock!)
Yasuhito Yabe
20131206 静岡web制作界隈ゆく年くる年2013
20131206 静岡web制作界隈ゆく年くる年2013
Yasuhito Yabe
「html5 boilerplate」から考える、これからのマークアップ
「html5 boilerplate」から考える、これからのマークアップ
Yasuhito Yabe
レスポンシブWebデザイン【発展編】
レスポンシブWebデザイン【発展編】
Yasuhito Yabe
レスポンシブWebデザイン【基礎編】
レスポンシブWebデザイン【基礎編】
Yasuhito Yabe
静岡Web制作界隈 ゆく年くる年 2012
静岡Web制作界隈 ゆく年くる年 2012
Yasuhito Yabe
あらためて考えるCMS選択 2012
あらためて考えるCMS選択 2012
Yasuhito Yabe
Htmlコーディングの効率化 後編
Htmlコーディングの効率化 後編
Yasuhito Yabe
Htmlコーディングの効率化 前編
Htmlコーディングの効率化 前編
Yasuhito Yabe
jQueryでiTunes Store風スライドショーを作ってみる
jQueryでiTunes Store風スライドショーを作ってみる
Yasuhito Yabe
Web制作者のためのWebマーケティング用語と計算式
Web制作者のためのWebマーケティング用語と計算式
Yasuhito Yabe
jQuery超入門編
jQuery超入門編
Yasuhito Yabe
Knock! Knock! サイトができるまで
Knock! Knock! サイトができるまで
Yasuhito Yabe
今日からはじめるHTML5 ver.2012
今日からはじめるHTML5 ver.2012
Yasuhito Yabe
みんビズ その傾向と対策
みんビズ その傾向と対策
Yasuhito Yabe
20111001 adobe edgeとhtml5_css3_javascrit
20111001 adobe edgeとhtml5_css3_javascrit
Yasuhito Yabe
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!)
20131206 静岡web制作界隈ゆく年くる年2013
20131206 静岡web制作界隈ゆく年くる年2013
「html5 boilerplate」から考える、これからのマークアップ
「html5 boilerplate」から考える、これからのマークアップ
レスポンシブWebデザイン【発展編】
レスポンシブWebデザイン【発展編】
レスポンシブWebデザイン【基礎編】
レスポンシブWebデザイン【基礎編】
静岡Web制作界隈 ゆく年くる年 2012
静岡Web制作界隈 ゆく年くる年 2012
あらためて考えるCMS選択 2012
あらためて考えるCMS選択 2012
Htmlコーディングの効率化 後編
Htmlコーディングの効率化 後編
Htmlコーディングの効率化 前編
Htmlコーディングの効率化 前編
jQueryでiTunes Store風スライドショーを作ってみる
jQueryでiTunes Store風スライドショーを作ってみる
Web制作者のためのWebマーケティング用語と計算式
Web制作者のためのWebマーケティング用語と計算式
jQuery超入門編
jQuery超入門編
Knock! Knock! サイトができるまで
Knock! Knock! サイトができるまで
今日からはじめるHTML5 ver.2012
今日からはじめるHTML5 ver.2012
みんビズ その傾向と対策
みんビズ その傾向と対策
20111001 adobe edgeとhtml5_css3_javascrit
20111001 adobe edgeとhtml5_css3_javascrit
a-blog cms 事例紹介(TalkNote Vol.1)
a-blog cms 事例紹介(TalkNote Vol.1)
Recently uploaded
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
Toru Tamaki
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
CRI Japan, Inc.
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
iPride Co., Ltd.
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NTT DATA Technology & Innovation
新人研修 後半 2024/04/26の勉強会で発表されたものです。
新人研修 後半 2024/04/26の勉強会で発表されたものです。
iPride Co., Ltd.
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
atsushi061452
Utilizing Ballerina for Cloud Native Integrations
Utilizing Ballerina for Cloud Native Integrations
WSO2
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
iPride Co., Ltd.
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
CRI Japan, Inc.
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
Toru Tamaki
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
Hiroshi Tomioka
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
sn679259
Recently uploaded
(12)
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
新人研修 後半 2024/04/26の勉強会で発表されたものです。
新人研修 後半 2024/04/26の勉強会で発表されたものです。
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
Utilizing Ballerina for Cloud Native Integrations
Utilizing Ballerina for Cloud Native Integrations
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
イラレでWebデザインしても嫌われないデータ作成術
1.
イ ス レーターでWebデザ
ンしても ラ ト イ 制作現場で嫌われないデータ作成術 2013年12月6日 Knock! Knock! 勉強会 矢部靖人
2.
1)Webデザインでイ ラレはなぜ嫌われるのか 2)今イラレが注目される理由 3)Webデザイ ンでイ ラレを使うTips
3.
今日の話は Webデザインの良し悪し」 「 ではなく、 「Webデザイ “データ” ン用 の良し悪し」 です
4.
1) ラレはなぜ嫌われるのか Webデザインでイ
5.
6.
・ ラレ て…DTPの人がデザインしたんでし
? イ っ ょ → Webのお作法とかわかっ てないんだか ら… ・ ん りイ あ ま ラレ得意じゃないんだよね → 普通Psでし ? 微妙に使いにく ょ いんだよね… ・ エッジがにじむし、 画像が足 りなかった るし りす → データ が汚いんだよね…
7.
8.
イ ラレがWeb制作現場で嫌われる原因 その多く は先入観… お互いに歩み寄 ませ り んか DTPもWebもない、
9.
CS4まではWeb向きではなかった 今は? り使え うにな ま るよ り
した Webでもかな イ ラレだっ てデキ る子なんです !
10.
ただ、 これだけだと “積極的にイ ラレ” とはいかない…
11.
2) ラレが注目される理由 今イ
12.
13.
Fireworks CS6で事実上の開発停止 なく なったわけないけど、 次を考えないと…
14.
15.
求められるマルチデバイ ス対応 ・ 多様なデバイ (PC スマホ
ゲーム機…) ス ・ ・ ・ 多様なスク リーンサイ (スマホ∼PC) ズ ・ 多様な画面解像度 device pixel ratio) ( 個別最適化は不可能 → 汎用的に構築したい
16.
汎用的なパーツ制作 ・ ・ ・ CSS3によるグラデーション 角丸 変形
etc... ・ ォン Webフ ト ・ (ベク ター形式によ Web用画像) る SVG ベク ター形式 = 拡大縮小に強い → 画面サイ ・ ズ 画面解像度に依存しない
17.
18.
ター形式といえば Adobeでベク Illustrator! Illustrator! Illustrator!
19.
このあた りのお話は、 またいずれかの機会に…
20.
3) ラレを使うTips Webデザインでイ
21.
問題 :エッジがにじむ 原因 :
ピクセルに整合し ていない
22.
23.
24.
25.
要は、 ピクセルとい“単位” の上手なお付き合い う と
26.
大原則:単位はピクセル、 数値は整数
27.
単位はピクセル
28.
29.
30.
数値は整数
31.
・ 「ピクセルグリ ドに整合」 ェ ッ にチ
ック ・ 「新規オブジェ ト ク をピクセルグリ ドに整合」 ェ ッ にチ ック ・ 情報パネル / 変形パネルでこ まめに確認 ・ ただし例外もあ (数幅が奇数の線など) る ・ と、 あ 安易な拡大縮小はデータ を汚す原因
32.
基準点は左上がベター Webのお作法) ( チ ック ェ ※「線幅と効果も拡大
縮小」 ェ を入れないのがオススメ ・ はチ ック
33.
線の位置
34.
イ ラレ上のオブジェ トサイ ク ズはすべて30px ×
30px 赤のエリ ア 29px × 29px 赤のエリ ア 28px × 28px 赤のエリ ア 3 px × 30px 0 線を中央に揃え る 線を内側に揃え る 線を外側に揃え る
35.
・ 線の位置は 「内側に揃え or る」「外側に揃え る」 ・ 「外側」 がいいとい う話も… → http://www.dtp-transit.jp/adobe/illustrator/post_1797.html
36.
参) スモデル Webのボック (外側の余白) Margin (内側の余白) Padding Width Height ( Border 線)
37.
イ ラレ上でピクセル描画を確認す る
38.
ちなみに 「校正設定」 は 「インターネッ ト標準RGB(sRGB)」
39.
「新規ドキ メン ダ
アログでは Web」 ュ ト」 イ 「 を選択 ドキ メント製作時の設定で、 ュ 大半はク アでき リ ます
40.
プロフ イ ァ ルはWebを選択 複数ページを
ファ ルに入れるな 1 イ ら ページごとにアート ボードを分けま ょ しう ※ 設定を変更す と カスタ にな ます る ム り サイ ズは任意 らいが一般的?) (w1200く プレビューモードは 「ピクセル」 に変更
41.
・ Web特有のデザイン 情報
42.
・ そんなフ ト、 ォン 普通入っ てませんか
! ら (デバイ ステキストのフ ォント指定 / アウト ライン化) ・ 画像にし て欲しいテキスト / 画像にしないテキ スト ・ マウスオーバー時の変化 (ボタ / リ ン ンクテキ スト) ・ (アニメーション)/ ギミ 動き ックは伝わるよ うに ・ 画像は72dpiで くは150dpi) 350dpiとか重いだけです (もし 。 ・ ブラウザによ る差異もあ 完璧な再現は不毛です り、
43.
結局は人と人
44.
DTPにはDTPの、 WebにはWebのお作法がある つま 「郷に入 ては郷に従え」
う と り、 り とい こ
45.
デザイナー: 今度のWebデザイン、 ラレでいいですか? イ コーダー
:うーん (仕方ない っすね) デザイナー: あ りWebに慣れてないん ま で、 何か不都合があ ったら直すので言っ てくださいね コーダー :じゃあ、 っちでいい感じに直し こ ますよ。 う く ま ないとこ ろは、 らチ ック てく 後か ェ し ださい。 両者 :そんな感じでお願いし ます
46.
47.
参考
48.
・ 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
49.
実装に困っ ら た ご連絡く ださい !
50.
本日はあ がと ございま り
う した ご連絡 ご質問など下記までお願いし ・ ます E-mail : info@hamnaly.com Facebook / Twitter : yabecchy
Download now