A place to cache linked articles (think custom and personal wayback machine)
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

index.html 13KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184
  1. <!doctype html><!-- This is a valid HTML5 document. -->
  2. <!-- Screen readers, SEO, extensions and so on. -->
  3. <html lang="fr">
  4. <!-- Has to be within the first 1024 bytes, hence before the `title` element
  5. See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  6. <meta charset="utf-8">
  7. <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  8. <!-- The viewport meta is quite crowded and we are responsible for that.
  9. See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  10. <meta name="viewport" content="width=device-width,initial-scale=1">
  11. <!-- Required to make a valid HTML5 document. -->
  12. <title>Google introduces a new way to search that combines images and text into one query (archive) — David Larlet</title>
  13. <meta name="description" content="Publication mise en cache pour en conserver une trace.">
  14. <!-- That good ol' feed, subscribe :). -->
  15. <link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
  16. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  17. <link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
  18. <link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
  19. <link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
  20. <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  21. <link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
  22. <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  23. <meta name="msapplication-TileColor" content="#f7f7f7">
  24. <meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
  25. <meta name="theme-color" content="#f7f7f7" media="(prefers-color-scheme: light)">
  26. <meta name="theme-color" content="#272727" media="(prefers-color-scheme: dark)">
  27. <!-- Documented, feel free to shoot an email. -->
  28. <link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
  29. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  30. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  31. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  32. <link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin>
  33. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  34. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  35. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  36. <script>
  37. function toggleTheme(themeName) {
  38. document.documentElement.classList.toggle(
  39. 'forced-dark',
  40. themeName === 'dark'
  41. )
  42. document.documentElement.classList.toggle(
  43. 'forced-light',
  44. themeName === 'light'
  45. )
  46. }
  47. const selectedTheme = localStorage.getItem('theme')
  48. if (selectedTheme !== 'undefined') {
  49. toggleTheme(selectedTheme)
  50. }
  51. </script>
  52. <meta name="robots" content="noindex, nofollow">
  53. <meta content="origin-when-cross-origin" name="referrer">
  54. <!-- Canonical URL for SEO purposes -->
  55. <link rel="canonical" href="https://techcrunch.com/2021/09/29/google-introduces-a-new-way-to-search-that-combines-images-and-text-into-one-query/">
  56. <body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">
  57. <article>
  58. <header>
  59. <h1>Google introduces a new way to search that combines images and text into one query</h1>
  60. </header>
  61. <nav>
  62. <p class="center">
  63. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  64. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
  65. </svg> Accueil</a> •
  66. <a href="https://techcrunch.com/2021/09/29/google-introduces-a-new-way-to-search-that-combines-images-and-text-into-one-query/" title="Lien vers le contenu original">Source originale</a>
  67. </p>
  68. </nav>
  69. <hr>
  70. <p id="speakable-summary">Earlier this year, at Google’s I/O annual developer conference, the company <a href="https://www.blog.google/products/search/introducing-MUM/">introduced</a> a new AI milestone called Multitask Unified Model, or MUM. This technology can simultaneously understand information across a wide range of formats, including text, images and videos, and draw insights and connections between topics, concepts and ideas. Today, Google announced one of the ways it’s planning to put MUM to work in its own products with an update to its Google Lens visual search.</p>
  71. <p><a href="https://lens.google/">Google Lens</a> is the company’s image recognition technology which lets you use the phone’s camera to perform a variety of tasks, like real-time translation, identifying plants and animals, copying and pasting from photos, finding items similar items to what’s in the camera’s viewfinder, getting help with math problems and much more.</p>
  72. <p>Soon, Google says it will leverage MUM’s capabilities to upgrade Google Lens with the ability to add text to visual searches in order to allow users to ask questions about what they see.</p>
  73. <p>In practice, this is how such a feature could work. You could pull up a photo of a shirt you like in Google Search, then tap on the Lens icon and ask Google to find you the same pattern — but on a pair of socks. By typing in something like “socks with this pattern,” you could direct Google to find relevant queries in a way that may have been more difficult to do if you had only used text input alone.</p>
  74. <p></p>
  75. <div id="attachment_2209102" class="wp-caption aligncenter"><img aria-describedby="caption-attachment-2209102" loading="lazy" class="size-large wp-image-2209102" src="https://techcrunch.com/wp-content/uploads/2021/09/Search-On-MUM-x-Lens-Shirt-Example.gif?w=680" alt=""><p id="caption-attachment-2209102" class="wp-caption-text"><strong>Image Credits:</strong> Google</p></div>
  76. <p>This could be particularly useful for the type of queries that Google today struggles with — where there’s a visual component to what you’re looking for that is either hard to describe using words alone or that could be described in different ways. By combining the image and the words into one query, Google may have a better shot at delivering relevant search results.</p>
  77. <p>In another example, a part of your bike has been broken and you need to search on Google for repair tips. However, you don’t know what the piece is called. Instead of delving into repair manuals, you could point Google Lens at the broken part of your bike, then type in “how to fix.” This could connect you directly with the exact moment in a video that could help.</p>
  78. <p></p>
  79. <div id="attachment_2209100" class="wp-caption aligncenter"><img aria-describedby="caption-attachment-2209100" loading="lazy" class="size-large wp-image-2209100" src="https://techcrunch.com/wp-content/uploads/2021/09/Search-On-MUM-x-Lens-Bike-Example.gif?w=680" alt=""><p id="caption-attachment-2209100" class="wp-caption-text"><strong>Image Credits:</strong> Google</p></div>
  80. <p>The company sees these AI-driven initiatives as ways to make its products “more helpful” to end-users by enabling new ways to search. By making use of the phone’s camera as part of Search, Google is aiming to stay relevant in a market where many of its core use cases are starting to shift to other properties. For instance, many shopping searches today <a href="https://britewire.com/amazon-beats-google-in-product-searches/">now start directly</a> on Amazon. And when iPhone users need to do something specific on their phone, they often just turn to Siri, Spotlight, the App Store or a native app to get help. And Apple is<a href="https://www.cnbc.com/2020/10/28/apple-steps-up-effort-to-build-google-search-alternative.html"> developing</a> its own alternative to Google Search as well. You could see the beginnings of this work in the iOS 15 <a href="https://www.macrumors.com/guide/ios-15-spotlight/">update to Spotlight search</a>, which now directly connects users to the information they need without the need for a Google query.</p>
  81. <p>Google says it’s also putting MUM to work in other ways across Google Search and video searches, the company announced at its <a href="https://searchon.withgoogle.com/live/">Search On</a> live event today.</p>
  82. <p>The Google Lens update will roll out in the months ahead, noting that it still needs to go through “rigorous testing and evaluation,” which is a part of every new AI model that its deploys.</p>
  83. </article>
  84. <hr>
  85. <footer>
  86. <p>
  87. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  88. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
  89. </svg> Accueil</a> •
  90. <a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
  91. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-rss2"></use>
  92. </svg> Suivre</a> •
  93. <a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
  94. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-user-tie"></use>
  95. </svg> Pro</a> •
  96. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
  97. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-mail"></use>
  98. </svg> Email</a> •
  99. <abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
  100. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-hammer2"></use>
  101. </svg> Légal</abbr>
  102. </p>
  103. <template id="theme-selector">
  104. <form>
  105. <fieldset>
  106. <legend><svg class="icon icon-brightness-contrast">
  107. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-brightness-contrast"></use>
  108. </svg> Thème</legend>
  109. <label>
  110. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  111. </label>
  112. <label>
  113. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  114. </label>
  115. <label>
  116. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  117. </label>
  118. </fieldset>
  119. </form>
  120. </template>
  121. </footer>
  122. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  123. <script>
  124. function loadThemeForm(templateName) {
  125. const themeSelectorTemplate = document.querySelector(templateName)
  126. const form = themeSelectorTemplate.content.firstElementChild
  127. themeSelectorTemplate.replaceWith(form)
  128. form.addEventListener('change', (e) => {
  129. const chosenColorScheme = e.target.value
  130. localStorage.setItem('theme', chosenColorScheme)
  131. toggleTheme(chosenColorScheme)
  132. })
  133. const selectedTheme = localStorage.getItem('theme')
  134. if (selectedTheme && selectedTheme !== 'undefined') {
  135. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  136. }
  137. }
  138. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  139. window.addEventListener('load', () => {
  140. let hasDarkRules = false
  141. for (const styleSheet of Array.from(document.styleSheets)) {
  142. let mediaRules = []
  143. for (const cssRule of styleSheet.cssRules) {
  144. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  145. continue
  146. }
  147. // WARNING: Safari does not have/supports `conditionText`.
  148. if (cssRule.conditionText) {
  149. if (cssRule.conditionText !== prefersColorSchemeDark) {
  150. continue
  151. }
  152. } else {
  153. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  154. continue
  155. }
  156. }
  157. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  158. }
  159. // WARNING: do not try to insert a Rule to a styleSheet you are
  160. // currently iterating on, otherwise the browser will be stuck
  161. // in a infinite loop…
  162. for (const mediaRule of mediaRules) {
  163. styleSheet.insertRule(mediaRule.cssText)
  164. hasDarkRules = true
  165. }
  166. }
  167. if (hasDarkRules) {
  168. loadThemeForm('#theme-selector')
  169. }
  170. })
  171. </script>
  172. </body>
  173. </html>