CSSの新しい単位（lvh, svh, dvh)がすべてのブラウザでサポート、100vhがビューポートの高さいっぱいにならない問題を解決
Safari, FirefoxでサポートされていたCSSの新しいビューポート単位「lvh」「svh」「dvh」などが、ついにChromeでもサポートされました！ CSSの新機能で、Chromeが一番最後というのは珍しいですね。 最も活躍するのがiOSのSafariだからでしょうか。とはいえ、主要ブラウザすべてにサポートされるようになるのは、嬉しいニュースです。 画像: @bramus 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに 新しいビューポート単位「lvh」「svh」「dvh」とは ブラウザのサポート状況 はじめに W3CのCSS Values and Units Module Level 4で、ビューポート単位についていくつか仕様が変更されました。Large、Small、Dynamicといったビューポートサイズ
Chromeに実装された疑似クラス「:has()」がjQueryの「:has()」に悪影響、一定の条件下でWebサイトが壊れる可能性
Chromeに実装された疑似クラス「:has()」がjQueryの「:has()」に悪影響、一定の条件下でWebサイトが壊れる可能性 最近リリースされたSafariとChromeで、CSSのSelectors Level 4（現時点でドラフト）仕様にある疑似クラス「:has()」が相次いで実装されました。 疑似クラス「:has()」は、カッコ内に要素を書くと、その要素を持つ親要素にのみ指定したスタイルを設定できる、という便利な機能を提供してくれます。 ところがこの「:has()」のChromeにおける実装は、jQueryで似たような機能（カッコ内の要素を持つ親要素を選択する）を提供する「:has()」に悪影響を及ぼし、このjQueryの「:has()」を使っているWebサイトでは、Chromeを利用した場合に一定の条件下でWebサイトが壊れるなどの問題を引き起こすことが分かりました（同じエ
Denoのフルスタックフレームワーク「Fresh 1.1」登場。プラグインシステム、Preact DevTools対応、404ページのレンダリングなど新機能
Denoのフルスタックフレームワーク「Fresh 1.1」登場。プラグインシステム、Preact DevTools対応、404ページのレンダリングなど新機能 JavaScriptやTypeScriptのサーバサイドランタイム「Deno」を開発するDeno Land Inc.は、Deno用のフルスタックフレームワーク「Fresh」最新版となる「Fresh 1.1」をリリースしました。 Fresh v1.1 has been released with significant improvements: Automatic mode JSX Plugin system Preact DevTools integration New Tailwind plugin Preact Signals support ...and much more! Read the full release not
定番のWebブラウザ「Google Chrome」。拡張機能によって便利な機能を簡単に追加できるのが特徴の一つだ。今使っているChromeにこの拡張機能が入っていたら、今すぐアンインストールすることをお勧めする。 Webブラウザ「Google Chrome」の特徴の一つに「拡張機能」がある。専用のプログラムをダウンロードしてインストールすることで簡単に機能を追加できる。拡張機能はGoogleの公式サイトで配布されていて、誰もがダウンロードできる。 しかし、Googleの公式サイトで提供されている拡張機能の中には怪しげな動作をするものがあると話題だ。しかも、それらは何十万回もダウンロードされている人気の拡張機能だという。今使っているChromeにこれらがインストールされていないかどうか、すぐに確認が必要だ。 2022年8月29日、セキュリティ企業McAfeeの研究チームが公開したセキュリティ
Google Chrome 105にゼロデイ脆弱性見つかる。今すぐアップデートを確認する必要あり | ライフハッカー・ジャパン
サンディスクのmicroSDカード 512GBが40%OFF。写真や動画のデータ置き場はこれで良くない?【Amazonセール】
Fresh 1.1 - automatic JSX, plugins, DevTools, and more Fresh is a new full stack web framework for Deno. By default, web pages built with Fresh send zero JavaScript to the client. The framework has no build step which allows for an order of magnitude improvement in development experience and deployment times. Today we are releasing the next significant version of Fresh. Version 1.1 brings a lot of
React Inspector というChrome拡張機能を作りました。 Chrome上でインスペクタを起動し、クリックしたReactコンポーネントのソースコードをピンポイントでエディターで開きます。(現在はVSCodeのみ対応) 追記: ↑2022/09/12 オプションページから "Open in Editor URL" を設定できるようにし任意のエディターのURLスキーマで開くことができるようになりました...! Chrome web store: https://chrome.google.com/webstore/detail/react-inspector/gkkcgbepkkhfnnjolcaggogkjodmlpkh GitHub: https://github.com/hand-dot/react-inspector Reactのソースコードに直接ジャンプできるのでUIか
米Googleは9月2日（現地時間）、Chromeブラウザのバージョン105.0.5195.102をWindows、Mac、Linux向けにリリースした。8月31日に105にメジャーアップデートしたばかりだが、「エクスプロイトが実際に存在すると報告」された1件のセキュリティ修正が含まれる。 修正される脆弱性「CVE-2022-3075」の重要度は上から2番めの「High」だが、匿名の研究者から既に悪用されたという報告があった。プロセス間のメッセージパッシングのためのランタイムライブラリコレクション「Mojo」に関連する脆弱性という。詳細は「大多数のユーザーが問題を修正するまで」制限するとしている。 この脆弱性は、Microsoft Edge、Brave、Operaなど、Chromiumベースの他のブラウザにも影響する。各ブラウザはそれぞれ、アップデートで対応している。 関連記事 Googl
ウェブブラウザ「Google Chrome」の最新安定版であるバージョン104.0.5112.81(Windows版、macOS版/Linux版は105.0.5195.52)がリリースされました。新たなCSS疑似クラスの実装など、ウェブUIの開発を容易にするであろうさまざまな機能が追加されています。 ◆CSS疑似クラスの追加 今回、新たに二つのCSS疑似クラスが追加されています。:has()は引数で渡された相対セレクター要素を1つ以上持っている場合に有効となります。 /* <div> 要素のうち直接 <img> を含んでいるもの */ div:has(> img) { background-color: black; } :modalは、それが存在している間は外部の要素とのすべての相互作用を排除する状態にある要素(つまりダイアログ的な要素)に対して有効となります。 :modal { bor
Google製のウェブブラウザChromeは、拡張機能を追加することでYouTubeの字幕読み上げ機能やウェブページのオフライン保存機能などの便利機能を追加できます。しかし、大手セキュリティ企業マカフィーの研究者によって、合計140万回ダウンロードされた5種の拡張機能に「アフィリエイト収益を不正に得るためのコード」が含まれていたことが報告されました。報告された拡張機能のうち1種は既に入手不可となっていますが、残りの4種は依然としてGoogle公式ウェブストアから入手可能で、中には「Googleのおすすめラベル」が付与されたものも存在しています。 Malicious Cookie Stuffing Chrome Extensions with 1.4 Million Users | McAfee Blog https://www.mcafee.com/blogs/other-blogs/mc
はじめに これは初めて Chrome 拡張を作る人が超基本を理解するのを手助けするための資料です。 ユニークビジョン社内のハンズオン勉強会の資料として作りました。 Chrome 拡張の全体像 Chrome 拡張のざっくりとした全体像を図にまとめてみました。 機能ごとに説明します。 ポップアップウィンドウの表示 拡張アイコンクリック時にポップアップウィンドウを表示できます。 popup と呼ばれています。 既存ページの DOM へのアクセス 任意のウェブサイトの DOM にアクセスし、情報を取得したり、改変したりできます。 content_script と呼ばれています。 html ファイルの表示 通常のウェブサイトのように任意の html + js ファイルを表示、動作させることができます。 ブラウザ自体の機能や外部 API へのアクセス ブックマーク / クッキー / タブ など、ブラウ
Google Chromeで開いたウェブサイトが、ユーザーの許可を得ることなく、クリップボードに任意の文字列を書き込み可能であることが指摘されています。Chromeのバグ管理システムにおいても認識はされているものの、修正はなされていない状態です。 Chrome allows websites to write to the clipboard without the user’s permission | Hacker News https://news.ycombinator.com/item?id=32614037 ソーシャルニュースサイト・Hacker Newsが示した再現手順を試してみました。まずは以下の「Web Platform News」というサイトにChromeでアクセス。 Web Platform News https://webplatform.news/ 次に、クリップ
Published: 23 August 2022 | Akira TanaveLast modified: 17 Feb 2024 【お知らせ】 2023.3.4 SlatickHTMLは現在、諸事情によりChrome ウェブストアでの公開を停止しておりますが、学術・研究目的または非営利の私的利用の方には無償にて配布いたします。 ご利用になりたい方は開発者のツイッターへDMか、メールで tanave@googlegroups.com 宛にお問い合わせください。１日以内にお返事させていただきます。※返信メールが迷惑メールフォルダに入れられてしまうことが多々ありますのでご注意ください。 【アップデート内容 Version 1.0.21】 2024.02.17ログ取得時にメールのメッセージでエラーが出る不具合の修正 Slack上でファイルが削除されているとエラーが出る不具合の修正 ログのスレッ
ブラウザー新興勢力、アップルとグーグル標的に
20年余り前に反トラスト法（独占禁止法）を根拠にハイテク大手に挑んだ初の大型訴訟の中心はWebブラウザー（インターネット閲覧ソフト）だった。ここに来てブラウザー市場が寡占状態にあるとして、新世代の同業他社や当局が再び疑問を呈するようになった。 1990年代の標的はマイクロソフトだったが、今ではアップルとアルファベット傘下のグーグルに注目が集まっている。アップルの「サファリ」とグーグルの「クローム」は、ブラウザー市場でのシェアが合わせて80%以上を占める。 英国ではアップルとグーグルに対する独禁調査の一環として、6月に競争市場局（CMA）がモバイル端末向けブラウザー開発業界の競争を点検すると表明した。 欧州連合（EU）執行機関の欧州委員会は「オープン・ウェブ・アドボカシー（OWA）」というソフト開発者団体の申し立てを受けて、先ごろ可決した「デジタル市場法（DMA）」にブラウザー開発者について
PCでChromeを使っていて、ページの上下移動にキーボードのHomeやEnd、PageUpやPageDownのキーを使用することがあると思います。 マウスのホイールやスクロールバーで移動するのもいいですが、例えばTwitterでTLを上から下へずっと見ていくときなどは、キー操作を使ったほうが素早く操作できて快適です。 そんなとき、いつもは使えていたHomeやEndのキーが反応しなかったり、挙動がおかしくなり効かなくなった！ということが実際に起こります。 何も設定をいじってないのに、勝手にそうなってしまうことがあります。 今回はその解決方法についてまとめました。 解決方法は簡単です この現象が起きる原因は【テキスト カーソルを使ってページ間を移動する】というChromeの機能がオンになっていることが原因であることが多いです。 これをオフにすることで正常にHomeやEndが機能するように戻り
2023年2月7日 便利ツール, 海外情報, 英語 DeepL（ディープエル）翻訳は、ドイツの企業が開発している機械翻訳エンジン。自然で高い品質の翻訳文が話題となっています。今回はそのDeepL翻訳を、Webデザインや制作、技術系の分野で活用していく方法を紹介します！ ↑私が10年以上利用している会計ソフト！ DeepL翻訳の使い方 DeepL翻訳の翻訳精度の高さは一度使ってみると実感できるかと思います。基本的にはDeepLのWebサイトにアクセスして、翻訳したい文章をコピペするだけ。ただ、毎回DeepL翻訳のWebサイトに文章をコピペするのって地味に面倒ですよね…。 そこでおすすめなのがDeepL翻訳のChrome拡張です。インストールしてWebサイト内の文章を選択すると、カーソル付近にDeepLマークが表示され、クリックすれば翻訳されます。 技術系ドキュメント特有の用語やコードを含んで
はじめに はじめまして、@nkato_です！ 普段は機械学習寄りのソフトウェアエンジニアとして、PythonでMLパイプラインを記述したりGoでバックエンド処理を記述しています。 便利アプリや各種ツールの拡張機能が好きで、これまでにも様々な機能を取り入れて試してきました。 自社エンジニア向けにそういったツールを共有したいと思ったのですが、どうせなら公開情報としてQiitaに投稿しようと思い立ち、まとめてみることにしました。 量は多いですが、どれもおすすめです！ アプリ Alfred ショートカットキーで検索窓を開いて、アプリ名で検索してアプリを起動するやつ アプリの起動以外でも、ファイルを開いたり計算したりできる 僕はアプリはAlfred経由でしか開かないので、ドックもランチャーもあまり使ってない App Storeのやつは古いので公式サイトからダウンロードする The Unarchive
レスポンシブの確認が簡単に！ iPhone, iPad, Androidなど各モデルのサイズ、操作や動画にも対応した優れもの -モバイルシミュレーター
iPhoneをはじめ、PixelやGalaxyのAndroidスマホ、iPadやGalaxyのタブレット、ラップトップ、ワイドスクリーンなど各モデルのサイズでWebページを表示して確認ができるChromeの機能拡張を紹介します。 デベロッパーツールのデバイスモード（command+shift+M）で各デバイスの表示を確認できますが、モバイルシミュレーターはさらに多くのデバイス、スクリーンショット・動画撮影など機能も充実しています。また、モバイルシミュレーターでデベロッパーツールを使用することも可能です。 無料で、多くのデバイスをサポートしているのがいいですね。 WinでもMacでも、ツールバーと右クリックから1クリックで簡単に起動できます！ Mobile FIRST レスポンシブの確認を簡単にできます。 スクロール・スワイプなどの操作をはじめ、リンクをクリックしてのページ移動もできます。
関連キーワード Windows 10 | Microsoft（マイクロソフト） | Windows クライアントOSとしてMicrosoftの「Windows 10」を搭載するPCの利用時に、処理速度などのパフォーマンスに関する問題が発生した場合、どのように対処すればよいのだろうか。パフォーマンスに関する主要な5つの問題のうち、2つ目の要因と対処法を説明しよう。 2．CPU使用率が高い 併せて読みたいお薦め記事 連載：Windows 10パフォーマンス問題「5つの対処法」 第1回：「Windows 10」がぎりぎり動く“最低PC”スペックは本当に低かった 第2回：Windows 10が快適に動く“本当の最低PC”スペックはこれだ 第3回：Windows 10の社用PCが“このスペック”以下なら仕事にならない？ 第4回：Windows 10「起動が遅過ぎ」問題が“ハイスペPC”でも発生するの
iOS16では、Microsoft Edge、Google Chrome、Mozilla Firefoxなど、Safari以外のブラウザでもApple Payによる決済が利用可能になることを示すスクリーンショットが投稿されました。 EdgeやChromeでもApple Pay支払いに対応か iOS16ベータ4では、EdgeやChromeなどサードパーティー製ブラウザでもApple Payが利用できるようだ、と米メディアMacRumorsのライターのスティーブ・モーザー氏（＠SteveMoser）がTwitterにスクリーンショットを公開しています。 モーザー氏のツイートには、Edgeで表示したAppleのオンラインストアで「Apple Payで支払い」のアイコンが表示されたスクローンショットが添えられています。 iOS15以前では、Apple Payの支払いに対応したブラウザはSafari
べ、べつにGoogleのことなんて好きじゃないんだからね！ ■動画内に出てきた他の動画 ・有能なChrome拡張＋意外にもEdgeが使いやすい件 https://youtu.be/05uf_4349HA ・【無料】今すぐ入れるべきWindowsフリーソフト6選 https://youtu.be/hAd-rJeYBfw ・マイクラ内で阿部寛のホームページを見ることに成功しました https://youtu.be/-raprmdaLrY ■Twitter https://twitter.com/YukkuriAIch ■ダウンロードリンク Screenshot YouTube https://chrome.google.com/webstore/detail/screenshot-youtube/gjoijpfmdhbjkkgnmahganhoinjjpohk Youtube Chat
先日、とても面白い動画がYouTubeにアップされていました: スライド: Flutterがどのように現在の形になったのか、Flutterと名前が付く前の歴史を、当時のFlutterの開発者であるEric Seidel氏とAdam Barth氏が振り返った動画です。 これがとても面白く、前史を理解することで、Flutterが実はどのような位置づけにいるのか、Flutterが何であって何でないのか、よくわかる内容だったため記事にまとめたいと思います。 （筆者は英語がそこまで得意ではありません。解釈違いなどあればコメントで教えてください。また、分かりやすさのために沢山省略しています。ぜひ元動画も併せてみてください。） 全ての始まり: WebKitからBlinkがフォークされた 2013年4月3日、GoogleはChrome/Chromiumに使用するブラウザエンジンを、WebKitからフォーク
ユーザーの直帰率や離脱率とパフォーマンスの関係から、コンテンツを表示する速度や応答性（ページがユーザー入力に応答する速度）がいかに重要であるかは、既によく知られるようになってきています。 ではコンテンツを表示する速度や応答性を上げるにはどうしたらいいでしょう。 結論から述べるとパフォーマンスを客観的な指標に基づいて正確かつ定量的に測定し、そこから課題を見つけて解決することが必要になります。 GoogleはChrome User Experience Reportに新しく応答性指標INPを導入しました。 INPとは INP（Interaction to Next Paint）は、ページの読み込みを開始してからユーザーがページを離れるまでの間に発生するユーザー入力の応答性（インタラクション）を評価する測定基準で、遅延時間を計測します。 計測対象のインタラクションは、以下となります。 ユーザー入
楽天銀行にログインできなくなって困っておりチャットサポートをお願いした「（3年前の）Chrome73以外のブラウザには対応してません」という回答が来た
knowrealkey @knowrealkey 楽天銀行にログインできなくなってめちゃ困ってるんだけど、チャットサポートをお願いした結果の回答がコレ（chromeを使用しており、現在のchromeはchrome103） pic.twitter.com/mXLL15af9Z 2022-07-01 12:09:30
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
「Google Chrome」に3件の脆弱性、対策版のv106.0.5249.91が公開／深刻度は「High」
「Google Chrome 106」が正式公開 ～20件の脆弱性に対処、「Android 6.0」対応は終了／オムニバーにはショートカットで対象を履歴やブックマーク、タブに絞って検索する機能
意外と知らない？ Webブラウザー「Google Chrome」のショートカット機能 [てっぱんアプリ！]
![意外と知らない？ Webブラウザー「Google Chrome」のショートカット機能 [てっぱんアプリ！]](https://cdn-ak-scissors.b.st-hatena.com/image/square/fd5badc5455269565c7f16bd133798b46ace8377/height=288;version=1;width=512/https%3A%2F%2Fk-tai.watch.impress.co.jp%2Fimg%2Fktw%2Flist%2F1442%2F080%2Fthumbnail.jpg)
なんとパスワードも。ChromeとEdge、スペルチェック時に入力データが外部送信される仕組みに注意【やじうまWatch】
「Google Chrome」は独自のルートストアへ ～「Chrome Root Program」の開始が発表／Windows/Macの「Chrome 105」よりロールアウト
入れてはいけない「Google Chrome」5つの拡張機能：678th Lap
「Chrome」は「MiraclePtr」でさらに安全に ～Googleが「解放後メモリ利用」対策を開設／診断性が向上するという副次的効果も
Webページの特定テキストへ直接ジャンプしてハイライトするリンクの作り方／「Chrome」「Edge」は標準機能で、「Firefox」は「Link to Text Fragment」拡張機能で【レビュー】
Fresh 1.1 - automatic JSX, plugins, DevTools, and more
React開発を快適にするChrome拡張を公開したので見てください！
Google Chromeアップデート 1件のゼロデイ脆弱性を修正
「Google Chrome」にゼロデイ脆弱性、対策版のv105.0.5195.102が緊急公開／
「Google Chrome 105」安定版リリース、ウェブUI開発に便利な機能が続々搭載
Chromeの人気拡張機能に「不正なアフィリエイトを挿入するコード」が仕込まれていることが判明
「Google Chrome 105」が正式版に ～独自のルートストアへ移行、Chromeアプリには警告メッセージ／深刻度「Critical」1件を含む多数の脆弱性にも対処
はじめての Chrome 拡張 最小構成ハンズオン - Qiita
Google Chromeはウェブサイトがユーザーの許可なくクリップボードに書き込みを行うことができる状態にある
Backup Slack as it looks - SlatickHTML
RSSフィードリーダーがデスクトップ版「Google Chrome」にやってくる！／早ければ「Chrome 106」でお披露目か【やじうまの杜】
グーグルの“中の人”が紹介する、「Chrome」の便利な使い方とは
選択テキストへジャンプする「Google Chrome」互換URLを生成可能になった「Vivaldi 5.4」／「Vivaldi メール」の速度とパフォーマンスも向上
【解決法】ChromeでHomeやEndが効かない!?挙動がおかしい!?テキストカーソルブラウジングとは何？
DeepL翻訳で海外のWebサイト制作情報を読みあさろう！
実際に使っていて便利だと感じたアプリ、Chrome拡張、ターミナル拡張、VSCode拡張まとめ - Qiita
Windows 10“CPU使い過ぎ”問題が「Chrome」で発生しがちなのはなぜ？
iOS16、ChromeやEdgeでもApple Pay決済が利用可能に？ - iPhone Mania
「PortableApps.com」で「Google セーフ ブラウジング」の誤検知が発生／「Google Chrome」などですべての配布アプリがブロックされてしまう
Google、「Chromeアイコンリニューアル」の背景を解説――さまざまな条件で最適なデザインを追求
「Twitter」のブックマークに検索機能を追加するGoogle Chrome/Firefox拡張機能／Microsoft Edgeでも利用可能【レビュー】
Googleが「Chrome OS Flex」をリリース ～古いPC/MacをChromebookとして再生／認定の対応デバイスは295モデルにまで拡大
【マジ便利】YouTubeの視聴環境を別物に変える！便利なChrome拡張5選！！【Chrome拡張】
Flutter前史: ChromeがFlutterになるまで
応答性を示す新しい指標「INP」 | フロントエンドBlog | ミツエーリンクス