Step By Work

大阪のホームページ制作会社

開発者向けブラウザBliskを使ってみた感想とインストール、設定方法など

Date: 2016.07.13
Update: 2020.02.24

執筆・監修

上杉 洋 Hiroshi Uesugi

1991年生まれ。 株式会社ステップバイワーク代表。 2013年に株式会社n.uを設立。 2015年にStep by workとして独立。 2021年株式会社ステップバイワークとして法人化。 HP制作/SEO対策/コンテンツ制作/動画制作/YouTube運用/写真撮/WordPressを全て一人でやります。

スマホでのWeb閲覧率が50%を超えている中、Web開発者にとってスマホの表示を最適化することは必須だといえます。

私がWebサイトのレスポンシブ表示を確認する時は、Choromeの開発者ツールでウィンドウ幅を変えながら行っていました。
そうすると、スマホで表示がおかしい箇所を直したら、次はPCでの表示がバグっていたなんてこともたまにあります(CSSはしっかり書こう!笑)

そんな時に

http://brian.hatenablog.jp/entry/try-blisk

この記事を読んでBliskというブラウザの存在を知りました。
そこで今回はBliskを実際使ってみた感想と、設定方法などについて書いていきます。

Bliskを使ってみる

ざっと使ってみた感じ非常に使いやすいですね!
表示に対応している端末はiPad、iPhone、Nexus5/6/7、Galaxyなど主要なものは大体あるので「このサイズで確認したい~!」というところで困ることはないかと思います。

また、モバイル端末の切り替えも写真左側のリストをクリックするだけで表示を変更することができますし、切り替えにタイムラグもなく、サササっと確認も可能です。

Choromeと同じ感覚で使える

正直これが一番うれしいです。
BliskはChoromeと同じBlinkエンジンを利用しているので開発者ツールもChoromeと同じものを使えますし、拡張機能も同じものを使えます。

実際、私個人的にはWeb開発で便利なブラウザがあったとしても開発者ツールを理由に定番ツールになることはありませんでしたが、Bliskはこの点で非常に嬉しいです。

Bliskのダウンロード場所とインストール方法

https://blisk.io/

上記サイトの右上からインストーラーをダウンロードし、インストールするだけですね。

Bliskの便利機能

Bliskの機能としてモバイル端末での同時エミュレート機能の他にも

  • 自動更新機能
  • スクリーンショット機能
  • エラー解析機能

などがあります。

スクリーンショット機能や解析機能は現在開発中で、
自動更新機能はエディターでコードの編集をすると自動で表示が更新される機能です。

ただこれらの機能は特に使う必要もないかな、というのが感想です。

それぞれの機能はBliskの右上の歯車マークから簡単に設定できるので助かります。
このブラウザはまだ英語にしか対応していないので、設定画面を見るのも一苦労ですが、あんまり設定項目が無くて迷うこともないのでかなり助かります笑

まとめ

私は現時点でスマホとPCでの表示を確認するためにかなり重宝しています。
しかし、普段使いはもちろんのことプロトタイプの製作段階ではまだ必要ないのかなという印象です。
なんだかんだ使い慣れたChoromeを手放すことはできませんでした^^;

この記事へのコメント 0件