対象:ホームページ・Web制作
回答数: 3件
回答数: 7件
回答数: 3件
HTMLで画像を拡大表示させると、勝手にアンチエイリアスされてピントがぼやけたような画像で表示されます。
このアンチエイリアス機能、便利な場合もあるとは思いますが、不便な場合もあります。
IEとFireFoxでは、無効にする方法が用意されてます。
しかしGoogleChromeとOperaは、その方法が用意されてないようです。
なぜ用意されてないのでしょう?そこが不思議でなりません。
アンチエイリアスしない方がいい場合など、いくらでもあります。
横3ピクセルの画像を拡大表示させ、フランス国旗を描きたい場合だってあるでしょう。
網目模様を拡大表示させ、市松模様を表示させたい場合だってあるでしょう。
横縞模様を拡大表示させ、ストライプを表示させたい場合だってあるでしょう。
なのに、なぜ、その方法すら、用意されてないのでしょう?
こうした画像節約手法は廃れた考えだということは理解してます。
ですが、方法としては残しておくべき。その方法を採用するかどうかはHP制作者に委ねるべきです。
なのに、なぜ、その選択肢すら用意されてないのか?そこが、不思議でなりません。
一番困るのはドット絵講座です。
ドット画像を、実寸、2倍、4倍、8倍、それぞれで表示させたい場合だってあるでしょう。
それともいちいちそれら画像を用意せねばならないのでしょうか?
ChromeとOperaの開発者は、ドット絵講座のようなサイトを、見たことがないのでしょうか?
プロのブラウザ開発者が、なぜこんなことにすら気付かないのでしょうか?
それともアンチエイリアスを無効にできない理由があるというのなら、ぜひお聞かせいただきたいものです。
専門家の方々は、この事実について、どのようにお考えですか?ご意見お聞かせいただければ幸いです。
以上、よろしくお願いします。
Hajestiaさん ( 長野県 / 男性 / 31歳 )
回答:1件
井上 みやび子
Webエンジニア
-
バグに近いのではないかと思います
始めまして。Web開発などを行っております、すぐ使える株式会社の井上と申します。
画像のアンチエイリアスの件ですが、確かにおっしゃる通りですね。
少し調べてみましたら、やはり、Google Chrome ではCSSでの調整が有効にならない、なぜだ、という議論は続いているようです。
CSS3 でもこのあたりをコントロールする仕様が提案されていますので、実装が無いのはブラウザの機能不足という気がします。
「Chrome での設定方法」として検索するとヒットする方法はあるのですが、現時点(2012年12月)では実際にやってみるとアンチエイリアスされてしまう事から、少なくとも現在の最新バージョンではバグなのか、意図したものなのか、対応が無い事は確かなようです。
ただし、Opera の方では以下の設定でアンチエイリアス無しが可能です(Opera 12.11 で確認)。Chrome の方もある日対応されているかもしれませんね。
【現在の所Webを探して見つかった「ベストプラクティス」】
img.pixelated {
image-rendering: optimizeSpeed;
image-rendering: -moz-crisp-edges; /* Firefox */
image-rendering: -o-crisp-edges; /* Opera */
image-rendering: -webkit-optimize-contrast;/* Mac Safari (Chrome?) */
image-rendering: crisp-edges;
-ms-interpolation-mode: nearest-neighbor; /* IE */
}
Safari はMacだと期待通りですが、Windowsの方は若干アンチエイリアスされてしまうようです。
現時点で Chrome を無視したサイト制作は難しいですので、結局の所あまりお役に立てない感じですが、ご参考になりましたら幸いです。
評価・お礼
Hajestiaさん
2012/12/12 02:11井上様、ご回答ありがとうございます。
ご教授いただいた方法を試してみましたが、Operaでは上手く行きましたが、Chromeではアンチエイリアスされたままでした。
これは、バグでも機能不足でもなく、「配慮不足」だと私は思います。開発者の。
「アンチエイリアスができて、非アンチエイリアスができない」なんてこと、技術的にあり得ませんからね。
疑問に思うのは私だけではないのですね。ならばなおさら不思議です。Chromeの開発者は、いったい何を考えているのでしょう…?
それにしても、無効にするための記述が、なぜブラウザごとに違うのでしょう?
CSSで統一すればいいのに、それができない理由でもあるのでしょうか?
CSSにせよブラウザにせよ、「こうすればいいだろう」と思ったことがうまく行かない…そんなことが多すぎて、Web制作がイヤになりつつありますよ…orz
(現在のポイント:-pt)
このQ&Aに類似したQ&A
表示中のコンテンツに関連する専門家サービスランキング