みなさんこんにちはこんばんはおはようございます。 最近自宅勤務が板についてきた方の山﨑です。 コロナの影響で Chrome 82 が スキップされた世の中ですが、 5月19日に Chrome 83 がリリースされました。 というわけで今回は 83 で追加された機能から面白そうなものをいくつかピックアップしようと思います。 | 視覚障がいをエミュレート 視覚障がいというと、結構稀なケースに対応したもんだと思われるかもしれません。 でもでも、目薬で有名な参天製薬さんのサイトによると男性の 5% はなにかしらの色覚異常を持っているようです。 20人に1人ぐらいの割合だと、案外無視できない数字かなと思...
こんにちは！夜空に浮かぶお月さまがいつもより大きく見えてキレイダナーと思い目を凝らしてよく見たらどうやら乱視が進行しているっぽい事に気がついてあわあわしています。山﨑です。 みなさん Google Chrome、使ってますか？ 今日はフロントからのリクエストに関する２つのデバッグてくにっくを書いてみようと思います。 Replay XHR フロントからXHRを使って POST でバックエンドにデータを登録しにいく処理、よくありますよね。 大概フォームの入力を伴うので、名前住所生年月日会社名備考欄 etc.... といちいち入力しなきゃならなかったりするので、 何度もテストを行う内に入力するのがだ...
PhantomJS の開発が終了したらしい。 https://github.com/ariya/phantomjs/issues/15344 ということで、CI サーバ上で動作しているヘッドレスブラウザを Chrome にかえるべく以下のサイトにたどり着きました。 https://intoli.com/blog/installing-google-chrome-on-centos/ 以下のコマンドで一発インストール OK。 curl https://intoli.com/install-google-chrome.sh | bash 試した環境は以下の通り。 $ cat /etc/system...
Hello web developer :) Web屋さん御用達のChrome DevTools小ネタを紹介。第1弾。(シリーズ化する風) 要素にshadowを追加する時に便利なTipsです。 まずいつも通りDev Toolsを開きます。( Macは command + option + i ) 今回使うのは一番馴染みがあるであろう、ElementsのStylesタブです。 好きな要素のStylesにマウスカーソルを載せると5つアイコンが出てきます。左から2つめがshadowです。 吹き出しの中の青いトグルを動かすと直感的に影の向きと大きさ、影のぼやけ方、影の距離を変更できます。便利! こんな...
Webサイトを作る時、他のサイトさまを参考にすることってよくあると思います。 その際によく使うおすすめChromeExtensionをご紹介します。 1.スクリーンショットを撮る Awesome Screenshot https://chrome.google.com/webstore/detail/awesome-screenshot-screen/nlipoenfbbikpbjkfpfillcgkoblgpmj App版 https://chrome.google.com/webstore/detail/awesome-screenshot-app/mfpiaehgjbbfednooiha...