12 comments

  • Lee MartinezLee Martinez, 5 years ago (edited 5 years ago )

    Icons for Pinned Tabs

    Pinned Sites allow your users to keep their favorite websites open, running, and easily accessible. You can set the icon that the user sees when they pin your site by providing a vector image. Use 100% black for all vectors with a transparent background in SVG format and add the following markup to all webpages that the icon should represent (replacing "website_icon" with your own file's name).

    <link rel="icon" sizes="any" mask href="website_icon.svg">

    To specify the color the icon should be displayed in, add the theme-color meta element to your webpage:

    <meta name="theme-color" content="red">

    The content attribute can specify a color in hexadecimal color values (#990000) or RGB formatted colors (rgb(153, 0, 0)), or recognized color-keywords, such as: red, lime, or navy.

    Not another one!

    10 points
    • Sri KadimisettySri Kadimisetty, 5 years ago

      Slightly related, there's more work on the web's end if the website would like to show up on iOS's new search screen.

      1 point
    • Wil NicholsWil Nichols, 5 years ago

      maybe if they're rendering SVGs as uielemenets, we'll see improvements to inline sag rendering... prays

      0 points
  • Eytan DavidovitsEytan Davidovits, 5 years ago

    I'm not the biggest fan of Google Chrome, but Safari 9.0 seems like they took all the features Chrome had and threw them on claiming they're new and revolutionary (i.e. pinned tabs, muting audio).

    2 points
  • Leon KLeon K, 5 years ago

    backdrop-filter seems useful. Will it be supported be support by other browsers? And would anyone know how soon that feature might be added?

    2 points
    • Navarr BarnierNavarr Barnier, 5 years ago

      From some cursory searches it doesn't appear to have been standardized at all.

      0 points
      • Andrew McWattersAndrew McWatters, 5 years ago

        Yeah, but they utilize standardized filter effects. This can probably be shimmed into other browsers.

        0 points
      • Leon KLeon K, 5 years ago

        Thats what I found too. It seems like it's webkit only for now.

        0 points
  • Bob CechacekBob Cechacek, 5 years ago

    “Only Safari Extensions installed from the Safari Extensions Gallery can be updated automatically.”

    I’ve just noticed the extension do not auto-update in Safari 8, despite settings tab clearly stating “Extensions will be automatically updated.”

    What year is it?

    Google Chrome also restricts extensions now, but at least they have an official repository (including malware, defeating the purpose). Apple’s repository with some 20 privileged extensions won’t cut it.

    2 points
  • Arjun PenemetsaArjun Penemetsa, 5 years ago

    They still haven't fixed the fact that all tabs don't have fav icons. If I'm trying find a tab (unlike in Chrome) , I have to read all the text to figure out which tab I wanted.

    I can always zoom out to see the content or install a hack SIMBL extension but this is a horrible user experience by default.

    0 points
  • Pirijan KethPirijan Keth, 5 years ago

    Use 100% black for all vectors with a transparent background in SVG format:

    <link rel="icon" sizes="any" mask href="website_icon.svg">

    To specify the color the icon should be displayed in, add the theme-color meta element to your webpage:

    <meta name="theme-color" content="red">

    It sounds like pinned tab icons will only support 1 color? Wonder what we should do for sites with multi color logos?

    0 points