ピクセルパーフェクトは必要なのか? HTMLコーダーの考え方まとめ

デザインデータどおりにぴったりHTMLコーディングすることは、「ピクセルパーフェクト」と呼ばれています。 ピクセルパーフェクト精度のHTMLコーディングをするのは大変ですが、それの是非について議論がおこなりました。
62
TAK @tak_dcxi

念のために言っておくと、カンプに対して忠実にコーディングするべきか?って話は(あまり複雑だと話は変わってくるけど)人間朝起きたら顔洗って歯を磨くべきかってのと同じような話だと思ってます。わざわざ議論するにも至らないレベル。

2020-09-20 11:13:30
𝕂𝕚𝕥𝕖 / KITERETZ inc. @ixkaito

結果的にピクセルパーフェクトにならかったのと、最初からピクセルパーフェクトにしようとしないのは、天と地の差があると思いますね。

2020-09-20 22:42:00
𝕂𝕚𝕥𝕖 / KITERETZ inc. @ixkaito

あえて言おう、コーダーがピクセルパーフェクトするとデザイナーにモテるよ。 マメだからモテるのか。ピクセルパーフェクトだからマメなのか。オレがピクセルパーフェクトなのか。

2020-09-21 00:30:53

ピクセルパーフェクト否定の意見

クマ🐻‍❄️ @bear_illust

ピクセルパーフェクトとかクソめんどくせえコーディングとかやってられっか

2020-09-20 01:59:02
クマ🐻‍❄️ @bear_illust

ピクセルパーフェクトにこだわる人ってフォントどうしてるんだろ?デバイスによってフォント違うし、フォント違うってことは同じ文字数フォントサイズでも改行位置変わることもあるし(あるよね?)、日本語Webフォントもサブセット化しても重いから現実的はなくない?

2020-09-20 02:14:34
eights@ヘリポ @eights_net

ピクセルパーフェクト、デザイナーの意見もコーダーの意見もすっごい理解できるけど、ユーザーから見てどこまでメリットがあるかなーというのはずっと疑問に思いながらコーディングしてる😂 twitter.com/tsudoi220/stat…

2020-09-20 09:38:44
吉本 集 / aru inc. @tsuDoi220

いやー、実際そうなんですよねー。 ピクセルパーフェクトに、そもそも拘っていない人に、仕事お願いしたくない。テクニックどうこうより、全然こっちのほうが大事。ほんとに。 後、速度とちゃんと納期守ること。 当たり前のようだけど、意外とね、、、 twitter.com/Makopontass/st…

2020-09-20 00:45:27
悉生 游漩 @StewEucen

@nibushibu デザイナーさんが、地球上の全デバイスサイズでピクセルパーフェクトにデザインしてくださるのであればコーディングできないこともないでござるが。 「iPhone Max のデザインだけ作ったので、他はこれに準じて作ってね」と云う業務では、ピクセルパーフェクトなんて不可能ッス

2020-09-20 18:02:13
たかもそ @takamosoo

ピクセルだいたいパーフェクトで良くない?だってfont-sizeにvw使いたいんだもの…

2020-09-20 12:40:01
えり@webデザイナー @webdesigner_mr

私も実はピクセルパーフェクトってよくわかんないんだよね… レスポンシブ時の感覚とか全部デザインまたは指示もらえるならわかるけど…

2020-09-20 12:57:43
ヒルデ @hildebrand_saga

PC、スマホ、全部ブラウザ含めてのピクセルパーフェクトは正直つらい。

2020-09-20 13:05:56
Kuni @Kuni49916778

僕みたいな底辺にはピクセルパーフェクトにしようの無いガタガタのデザイン+お任せ案件しか回って来ないのでピクセルパーフェクトした事ないです。

2020-09-20 13:25:38
ツカサ(9年目のウェブ屋)@京都 @CoComina_oki

すごいわかるわこれ。 固執しすぎてデザイン側がピクセルパーフェクトに使ってない時とかあるのにどうすんのこれ?ってなる。こっちで巻き取んの?小数点以下は切り上げる?切り捨てる?ってなる。 twitter.com/ake_nyanko/sta…

2020-09-20 16:00:21
にゃんこ@マークアップの人(減量中) @ake_nyanko

ピクセルパーフェクトにするのはデザイン自体がきちんと設計されていてかつデータもキッチリ作り込んである場合だけだな。感覚で配置してるデザインデータを元にピクセルパーフェクトなんかした日には設計どころじゃなくなるし。 twitter.com/tak_dcxi/statu…

2020-09-20 11:38:30
mikakane @_mikakane

また、ピクセルパーフェクトの話してる。 ピクセルパーフェクトにすべき理由なんて、どこにも一切ないので、そんなものは全く従う必要がないんですよ

2020-09-20 20:35:14
mikakane @_mikakane

要はですね、マージンなりなんなりの問題は、このレスポンシブ時代、ピクセルピックで解決できる問題じゃないんですよ。%なのか、emなのかremなのかpxなのか、その辺の判断をコーダーに委ねてる時点でデザイナとして負けてるので、ピクセルパーフェクト云々いう資格がそもそもないんですよ

2020-09-21 04:43:41
Masahiko Sakakibara @rdlabo

ピクセルパーフェクトを求めるのは、本来はコンポーネントの再利用性やCSS設計、表示速度を評価すればいいのに、その評価ができないから手っ取り早くデザインの再現性を求めてるだけかなと思ってる。 とはいえ、そちらを求められると一部では辛くなるから再現性を売りにしてる人がいるのもわかる。

2020-09-20 21:41:27
Masahiko Sakakibara @rdlabo

発想を転換して「ピクセルパーフェクトを求めずに別の評価指標を立てて外注」した場合、評価する側もそうだけど、評価される側はただHTML/CSSを書けるだけでは仕事にならなくなる。そう思うと、一定以上の「ピクセルパーフェクトこそが大切」という声があがるのは理解はできる。

2020-09-20 21:42:32

デザイナーの意見

ウチヤマタカヒロ|家族でシンプルライフ @michidesign0809

僕の場合、ピクセルパーフェクトでやってもらえたらとてもうれしいです!感動してうれし泣きしてしまうかもしれません!😂笑 ……が決してそこまでは求めてはいません。見た目の印象がデザインと相違なければいいかなと思ってます。 先述の場合、たいてい見た目の印象も合っていませんが……😇

2020-09-20 01:26:02
シノ @shippo_luca

ピクセルパーフェクトを目指して実装してくれる方、いつもありがとうございます。コンテンツ間のマージンとか、デザイン理由を持ってるので。本意ではない状態のページを見かけると辛いです

2020-09-20 07:03:27
コジサン - 鳥取倉吉のWebデザイナー / Web鳥〜みんぐ / 流浪人 / 裏山田 @kuroro0319

@tsuDoi220 制作会社の時にスクリーンショットとコーディング結果を差の絶対値でPhotoshopで重ねられたことがあって、それ依頼かなり厳密になりましたね 僕もデザインをやる人間なので、できる限り合わして欲しいと思います ただ、最近は案件ごとにデザイナー含めてどうするか話し合ってます😅

2020-09-20 08:44:49
823・生き方模索中双子親デザイナー @823designer

ピクセルパーフェクトである必要はなくて気付いて指摘し続けるのがデザイナーの役割でもあると思っている。デザイナーから1pxの違いに気付き続けることでこの1pxの大切さを伝え続けるしかない 経験上インハウスで作ってると別にカンプ通りの必要ない思っていて、実装見て最後調整するでも私はいい思う

2020-09-20 22:39:01

デザインデータをちゃんとしてくれ論

𝕣𝕖𝕘𝕖𝕡𝕒𝕟 @regepan

これの難しいところは、たまに奇数になってる時w これは...ってなる...偶数にすると他の画像とかも入らなくなったりして...地味にここが難所。多分答えはケースバイケース。 twitter.com/tsuDoi220/stat…

2020-09-20 01:09:13
吉本 集 / aru inc. @tsuDoi220

デザインのことは詳しくないけど、8の倍で揃えると綺麗だー、とかあって、デザイナーさんは細かくデザインされるんですよね。 で、いざ、実装するときに、1pxとか別によくね?って、実装するの? デザイナーさんが拘ったのに? マジか、ってなる。

2020-09-20 00:59:48
にゃんこ🍥マークアップの人(お仕事募集中) @ake_nyanko

ピクセルパーフェクトにするのはデザイン自体がきちんと設計されていてかつデータもキッチリ作り込んである場合だけだな。感覚で配置してるデザインデータを元にピクセルパーフェクトなんかした日には設計どころじゃなくなるし。 twitter.com/tak_dcxi/statu…

2020-09-20 11:38:30
TAK @tak_dcxi

ChromeにPerfectPixelインストールしてデベロッパーツールで画面幅をカンプのサイズと同じにしてコーディングすればピクセルパーフェクトなんて簡単にできる。ただ、これだとあくまでCSSを書いただけで設計して書くとなったら面倒になるわけで😅

2020-09-20 11:08:08