--- title: "MacでWeb制作をしている人にWindows検証について聞いてみました" canonical_url: "https://olein-design.com/blog/verification-windows-browser-by-using-mac-developer" language: "ja" date_published: "2019-01-04T11:48:23+09:00" date_modified: "2019-01-04T11:48:23+09:00" content_type: "post" author: "久野晃司" taxonomies: category: - "お知らせ" post_tag: - "Windows検証" --- # MacでWeb制作をしている人にWindows検証について聞いてみました 問題が発生しないとWindows検証はぬるりとしかやっていませんでしたOleinです。 みなさん、Windows検証ってどうしていますか？「しない」派ですか？「実機で検証」派ですか？「仮想環境で検証」派ですか？ 定期的に同じようなことが気になっていたので、Twitterアンケートでフォロワーのみなさんを中心に聞いてみました。フォロワーでない方もお答えいただけたりコメントをいただけたりしました。ご協力ありがとうございました。 ## アンケートの結果はこちら https://twitter.com/Olein_jp/status/1078165171808329728 ## 「Windows実機を用意して検証」が44% 結果としてはご覧いただける通り、**「Windows実機を用意して検証」が44%**という結果になりました。やはり実機で検証している方が多かったですねーなるほど。 ただし、会社にお勤めの方だと会社には少なからず１台くらいはWindowsが置いてあったりすると思うので、そういう意味ではWindows環境にアクセスしやすいという側面はあるかなと感じました。 逆にフリーランスなど小規模で事業を行なっている場合には、自分で環境を用意しないといけないのでコストがどうしても発生してしまいます。なので用意に二の足を踏んでしまうという点もあるかもしれませんね。 僕の場合は、必要な時だけ実機で検証するというパターンが一番多いです。制作はMacで行なっていて、何かのタイミングでWindows実機で確認するという感じです。「常に確認」という訳ではありません。 ## 「しない」が26% ちょっと驚きなのが、26%の方が「検証をしない」を選ばれていました。見方を変えると**「確認しなくても大丈夫」なスキルがある**という解釈もできるのかなと思っています。 というのも、「どのような記述をしたらIE11ではうまくいかな」というような経験値がしっかりとあり、そういった点を考慮した開発ができるから**「確認をするする必要がない」**のではないかとも推測できます。 僕はまだまだ予測外の挙動をIE11などで起こしてしまうので、スキル的にまだまだだなぁと痛感しております。 ## 「Mac内でバーチャルWindows立ち上げる」が25% 個人的には、こちらが一番多いのではないかと考えていました。しかし、実際は実機で確認される方の方が多かったですね。 どんな感じでバーチャル環境を作っているかという点ですが、Parallelsを使っている方が複数人みえました。 [埋め込みコンテンツ](https://www.parallels.com/jp/) 実は僕も昔はこちらのParallelsを使ってMac内にWindowsを立ち上げて検証する形にしていました。しかし、いつしか必要な時にしか立ち上げなくなったのでアップグレードもしなくなってしまい、結局は必要な時だけ実機で検証するという感じに落ち着いてしまいました。 また、バーチャル環境では大丈夫でも実機ではうまく動作しないという経験をされた方もみえるようで https://twitter.com/yat8823jp/status/1078181384366116866 あと、未確認なんですが、Macのバーチャル環境でWindows検証すると、フォントとかも正確に再現されるんですかね？？ 他には、BootCampを使っているという方もみえましたねー https://twitter.com/miu0512/status/1078464566386782208 僕はBootCamp使ったことなくてアレなんですけど、使っているという方他にもいそうですねー。 ## 「旧ModernIE（現MED）」が5% [埋め込みコンテンツ](https://developer.microsoft.com/en-us/microsoft-edge/) *Microsoft Edge Development、略してMED（勝手に略した）* 僕もModernIEを使ってたこともあったんですが、ウィンドウがめっちゃ小さくなってしまって検証がしにくいという経験が印象強くて、あまり定着しませんでした。 もっとちゃんと調べれば活用の方法があるのかもしれませんが、現時点では「お金をかけたくない場合の最終手段」的な感覚で捉えていますねー。 ## どんな環境で制作するべきか では、どんな環境で制作するべきなのかを考えてみます。これは僕のケースなので、人が変われば環境も変わると思っていますのでご了承を。 現在、僕のメインの制作環境は、 - MacBookPro 15inch（スタンドに乗せて） - Iiyama 27inch x 2 - 有線外付けApple純正キーボード という感じになっています。モニターは３枚ということになります。もっと詳しく言うと、左から15インチ、27インチ、27インチという並びで、正面に27インチがくる感じです。 画面それぞれの役割もある程度決まってきていて、MBPのモニターにはSNS関係と必要な時はデザインデータの閲覧用、正面はメイン作業用です。マークアップの時はPhpstormですね。デザイン制作作業の時にはXDやAiが立ち上げてあります。右側にはブラウザが立ち上げてあって、マークアップしたものがBrowser-syncで同期されて表示されます。 27インチよりも小さい画面だと、画面幅を1200pxくらいまで広げた時のデベロッパーツールが見づらくなるので、やはり27インチは欲しいなといったところ。以前は24インチを使っていたこともありましたが、やはりディスプレイに関しては**大きいのが正義**という考えを個人的には持っています。（50インチくらいの１つほしいとか思っているくらい）あと、iPhoneやiPadの表示を確認するためにシミュレーターを立ち上げることがあるのですが、こちらで立ち上げます。 あと、ブラウザで確認しながら調べ物も同じブラウザでタブ展開で行います。あまりブラウザウィンドウを乱立させたくない派なんで。 ![新居の制作環境](https://olein-design.com/wp-content/uploads/2017/10/feature-image_about2-1024x745.jpg)*だいたいこんな感じ。こんな綺麗になってないけど。（新居に引っ越したあとすぐの写真だから机の上がきれい）* 現状の環境の紹介はここまでにしておいて、どうやってWindows実機検証をするかという点なんですけど、上に書いたようにそれぞれのモニターの役割はすでに固まったいて、削減することは難しそうです。 ですので、一番現実的な形としては、モニターをもう一枚新調して、Windows実機と繋げて検証する、と言う感じでしょうか。Browser-syncでローカルIPでサーバー立ち上がるので、そのIPにWindows実機でアクセスしたら、同様に動きそうな気がするんですがどうでしょうか？（同じネットワーク下なんでどうでしょう？） で、モニターの設置位置ですが、現状机の幅いっぱい使っているので、横に置くことは難しそうですね。なので、上部に見下ろしてくる形で設置するしかなさそうです。あと、モニターを横に４枚並べると首痛くなりそうだし。 [!\[\](//ws-fe.amazon-adsystem.com/widgets/q?_encoding=UTF8&MarketPlace=JP&ASIN=B07FMM3S4H&ServiceVersion=20070822&ID=AsinImage&WS=1&Format=_SL250_&tag=oleindesign-22)](https://www.amazon.co.jp/gp/product/B07FMM3S4H/ref=as_li_tl?ie=UTF8&camp=247&creative=1211&creativeASIN=B07FMM3S4H&linkCode=as2&tag=oleindesign-22&linkId=78038d5b329949dd9d54d04677492113) こういったアームだったら大丈夫そうですね。なんかトレーダーっぽい感じになってしまいますが、モニターたくさんあるのなんかかっこよさそうなイメージ（あるあるでしょ？）。 こういった形で、Windows実機での検証環境を作るのがベターな気がしています。お手軽にということであれば、バーチャル環境は導入コストも知れていますし良さそうなんですが、やはり実機の方が変な安心感がありますね。 こういった**Windows常時検証環境**を整えるのも、今年の目標にしていきたいと思います。