2013年12月12日木曜日

IE10から出るようになった、inputフォームの文字を消す×印を消す

IE10からだと思うんですが、フォームに文字を入力すると削除できる×印が出るようになりました。
便利なんだけど、邪魔なときもある。

消すにはブラウザのプレフィックス付きのcssで制御するということです。
同じように、パスワードを一瞬見えるようにする目のアイコンも非表示にできます。

◆クリアーボタン?×印のやつ
.hogehoge input::-ms-clear{
visibility:hidden
}

◆リビールボタン?目の印のやつ
.hogehoge input::-ms-reveal {
    visibility:hidden
}

2013年12月9日月曜日

GoogleAnalyticsにIE11が出てこない?

表題の通り、GoogleAnalytics上でInternet Explorer11がIEとしてカウントされていないみたい(2013年12月9日現在)です。

公開されてから、ずっとゼロって、ありえるのかなー。と不思議には思っていました。
いやでも、まだ世間はそんなに関心が無いし、ウチのサイトに来るユーザーはまだIE6とか多いし、そういう事もあるのかも?とも思うし。

が、先日放置気味のタブレットPCをWindows8.1にバージョンアップし同時にIE11になったのでかなり確認に使用していたのですが、やっぱり出てこない。

これはおかしいと思って色々確認&調べていたら、GoogleAnalyticsでIE11はMozillaブラウザのVersion11.0として認識されている事が判明しました(たぶん、きっと。)

図のように、ユーザーの環境(Mozilla ブラウザ Version 11.0)として出ている雰囲気です。
IE11が公開されたのは2013年10月17日(日本時間)なのでちょうどその頃ですしね。バージョンも11、ですし。

これはGoogle様が対処してくれるのを待つしかないですね。
でももうけっこう日が経ってるのにな。いつかな…

GoogleAnalytics、IE11がMozillaとしてカウントされる不具合
GoogleAnalytics、IE11がMozillaとしてカウントされる不具合

2014年1月17日追記:

いつのまにか、Internet Explorer11もちゃんとIEとしてカウントされるようになっていました。
カウントが突然増加しているのが、2013年12月18日。
この日以降、正しくカウントされてるんじゃないでしょうか。

GoogleAnalytics、IE11が正しくカウントされるようになった様子
GoogleAnalytics、IE11が正しくカウントされるようになった様子

2013年11月14日木曜日

スライスとオブジェクトを同時に移動できない:Photoshopの不便なところ

別の場所にシェイプなどを移動したい時、スライスと一緒に選択して移動することができない。

サイトで使用するボタンやアイコンなどを書き出すために、まとめて1個のファイルに置いているんですが、場所が手狭になってきたり、やっぱりこれは背景を透明にしておこうと思った時に別の位置に移動したいんですが、1回で移動できない。


  1. シェイプを選択ツールで選択し移動
  2. スライスをスライス選択ツールで選択し移動
  3. 拡大してシェイプとスライスの場所を細かく合わせ直す←これが面倒すぎ!

なんというバカバカしさ。それともカンタンに同時に移動できる方法があるのかな…

Fireworksだと画像もベクトルもスライスも全部同じもののように扱われるので、選択ツールでまとめて移動、削除ができます。

てかなんでできないの?ひと通り使ってみたら、あたりまえに必要な機能だから追加しようって思うはずなのに。テスターいないのか。
というか機能というほどのものでもないし。

※文だとあまりわかりづらいのであとでいつか説明画像添付予定。たぶん。

◆Adobe様への要望
スライスとシェイプを同時に選択して、削除・移動できるようにしてください。

2013年11月7日木曜日

ファイルサイズがでかくなりがち:Photoshopの不便なところ

サンプルはほぼ同じものをPhotoshopとFireworksで作ったもの。
ファイルのサイズは

Fireworks:  716 KB
Photoshop:1,136 KB

これくらいの内容のファイルだとこの程度の差ですが(といっても1.5倍くらい大きい)パーツが増えてくるうちに差がどんどん開き、通常サイトラフ1ページFireworksで2~3MBくらいで収まっていたのが、同じようなものを作ってもPhotoshopだと15~20MBくらいかるく行きます。

もちろん、突然に複雑で美麗で繊細なタッチのサイトを作れるようになったセンスが付いたわけではありません…

Photoshopはファイルサイズなどにはまったくこだわっていないんだと思いますが、もうちょっとできたら小さいといいんですけどねー。
HDDがどんどん減りまくり。

まぁでもいくら大きくなってもPhotoshopはあまり心配ないのがいいかな。
Fireworksで15MBのファイルなんか怖くて扱えない。絶対保存時にファイル壊れて保存できなかったり、二度と開けない可能性大… → 関連:Fireworksの内部エラー

↓画像サンプル といっても、pngで保存し直したものだしこれ自体には意味ありませんが。
Photoshopで作成したもの(1,136KB)
Fireworksで作成したもの(716KB)

2013年10月29日火曜日

たくさん物置いてもファイルが壊れない:Photoshopのいいところ(対比:Fireworks)

Photoshopの悪いところばっかり見つけてもアレなので、いいところも書こうと思う。

ちなみにもともとはPhotoshop好きだし、Photoshopがダメなんかぜんぜん思ってません。
さらっとカンタンにWeb用パーツとか作ったりするのはFireworksの方がイイ!ということなだけです。
Photoshopは何でもできちゃうんです。たぶん。だからこそ、ほーんのちょっとしたことをやるのにも手順が多くなったりしがちです。
カンタンな事はカンタン操作でできるように機能追加してくれないかなー。


で、ここから今回の本題。

Photoshopはたくさん字や画像やベクトルパーツを置いても、ファイルサイズが何十MB、何百MBになっても特に問題なく開いて操作して保存できて、後でまた何事もなく開いて作業できます。(もちろんある程度PCスペック必要ですけど)

対してFireworks
お使いの方は絶対一度は体験していることだと思いますが、字やパーツをたくさん置いて作業していると、いつの間にか操作がガクガクしてくる、レイヤーなど各パネルの表示がおかしくなってくる。
よくわからないダイアログ(操作が完了できませんでした など)が出だす。

そして極めつけは、「内部エラーが発生しました。」連続ダイアログが出て保存さえできなくなります。(対策としてヒストリー消すとか、レイヤーを全て非表示に一時的にするとか、そんなの聞きますが、ほとんどの場合効果なし。

そしてそういう問題がなく保存できた場合でも、次に開くとまったくファイルが開けなくなる現象も多数。
以下のような時、そのような内部エラーが出る確率が上がるような気がします。

  1. ファイルサイズが大きくなる(数MBでも)
  2. パーツ(特にパスが多いベクトルパーツ)をたくさん置き過ぎる
でもちょっとページのラフ作るだけでも結構パーツ必要だから無理…

Fireworksの内部エラーに対抗する対策としては

  1. いらないパーツはこまめに消す。
  2. 早めに保存。
  3. 名前を変えてファイルの履歴を残しておく。

Fireworksの「内部エラーが発生しました。」あーもうこの表示大嫌い。内部エラーってなんだよ。自分でどうにかしろよ。なんの解決の糸口も掴めないエラー表示ほどムカつくものはありません。

2013年10月23日水曜日

シェイプがコピー&ペーストで複製できない:Photoshopの不便なところ


シェイプを移動ツールで選択してコピー→別のファイルを開いてそこにペーストという簡単な動作ができない。

  1. 目的のシェイプを移動ツールで選択
  2. レイヤーのとこで右クリック(またはメニューのレイヤーから)レイヤーの複製を選ぶ
  3. 保存先-ドキュメント でペーストしたいファイル選ぶ

というなんだか面倒な手順が必要。
Fireworksみたいに普通にコピーペーストできればいいのに。
(ちなみに、「パスコンポーネント選択ツール」で選択してコピペ、はできるけど、パスだけがペーストされる。シェイプでなく。これはこれで使うとは思うけどさー)

同一ファイル内ならAltキー+ドラッグで複製できるからまぁいいけど、シェイプでちょっとした三角アイコンとかつくって別でも使いたい時、ちょっと面倒。

せめてシェイプ右クリックで複製が選べればいいのに。

なんとかしてほしいPhotoshop。

塗りの無い部分も選択できてしまう:Photoshopの不便なところ

枠だけで塗りの無いシェイプ(四角の枠だけのパーツ)を作って、その中に別のシェイプがいくつかある状態。
その時、外側の枠は選択せずに、中のパーツ群を選択したくてもできない。
塗りがないから空欄の状態になっているかとおもいきや、枠だけでもそこが選択できてしまうので、結局外側の枠だけ動いてしまう。

青枠の塗りは無しになっている。
赤と緑だけを選択したいので、青枠の空欄(塗りなし部分)から移動ツールで囲い始めて目的の2個をまとめて囲いたいが…(PhotoshopCC)
実際には塗りなしでも白い部分は青枠として認識しているので、結局青枠だけ選択されて移動してしまう。
移動ツールでは塗りなし部分は透明として扱って欲しい(PhotoshopCC)


Fireworksだと、塗りがなかったら選択対象は枠の部分のみで内部は選択対象にならないから、中の選択ができてラクなのに。
というかそれが自然な動作だと思うんだけどなー。

今は仕方ないので全部を囲って青枠を改めて選択からはずすという面倒な作業。
例みたいな簡単な物ならそれでもいいのですが、通常は複雑な構造になっていることが多いのでそれも難しい状態です。

なんとかしてほしいPhotoshop。