Home » Computer » Network » WWW » Archive by category "CSS" (Page 3)

關於 CSS 中 :visited 的隱私問題

在七年半前 (2008 年八月) 寫的「利用 CSS 產生的隱私問題」文章,最近好像是因為 Rplus ChenFacebook 上的這邊提到而又有不少點擊進來,不過這個問題在 2010 年左右已經被解決了。

可以參考 MDN 上「:visited - CSS」的說明,以及當時 Mozilla 所發佈的文章:「privacy-related changes coming to CSS :visited」。

由於隱私問題,Mozilla 的作法是限制 :visited 可以改變的項目,只剩下少數與呈現方式有關的屬性可以用:

For privacy reasons, browsers strictly limit the styles you can apply using an element selected by this pseudo-class: only color, background-color, border-color, border-bottom-color, border-left-color, border-right-color, border-top-color, outline-color, column-rule-color, fill and stroke.

另外各種想要取得 :visited 的 CSS 資訊的方法,也會以沒有瀏覽過該網站重新計算,並且傳回假資料以確保還是不會洩漏:

The first change is that Gecko will lie to web applications under certain circumstances. In particular, getComputedStyle() and similar functions such as element.querySelector() always return values indicating that a user has never visited any of the links on a page.

18F 丟出 CSS 的代碼風格指南

好幾個禮拜前的東西,這幾天才上 Hacker News:「Introducing the CSS coding style guide」。

18F 是美國政府的官方單位,取名自辦公室所在的地址:(取自 Wikipedia 的「18F」說明)

Its name refers to its office location in northwest Washington, D.C., on 18th and F Streets.

不只是定義了 CSS Coding Style Guide,還給了 SCSS Lint 工具使用:

The styleguide provides a method of linting Sass (SCSS) code to ensure it conforms to the rules in the styleguide.

把 HTTP 站台逐步換向 HTTPS 站台的步驟

Jerry Qu 寫的「关于启用 HTTPS 的一些经验分享」這篇文章講了要怎麼將 HTTP 站台逐步換成 HTTPS 站台的方式 (以及工具)。

一開始會遇到 Mixed Content,瀏覽器預設值不會直接全部擋掉,而是會放行圖片類資源 (但是出現對應的警告)。然後可以用 upgrade-insecure-requests 來幫助邊換,讓 url 裡指定 http 的自動連到 https。

當全站把 url 都修完後,接著就可以考慮用 HSTS 強制全上 HTTPS。

做到這邊的安全性已經到一定程度了,接下來要不要進 HSTS Preload List 就看大家自己的想法了。

在 Gmail 上做 CSS 效果的問題

TechCrunch 上看到的「Gmail, We Need To Talk」這篇裡提到 Gmail 的問題,尤其是 CSS 這塊:

Each Gmail client renders email differently. You may not be aware of this, but each Gmail client has its own set of frustrating quirks. Having to deal with each version of Gmail makes creating email a nail-biting chore:

  • Gmail.com Webmail. Supports <style> but does not support ids and classes.
  • Gmail Webmail for Business. Does not support <style>.
  • Gmail App for iOS. Randomly increases font sizes by 50 percent (no <style>).
  • Gmail App for Android. Randomly ignores container widths (no <style>).
  • Gmail App for Android (for non Gmail.com addresses). Does not support background images in addition to ignoring container widths (no <style>).
  • Inbox by Gmail for Android. Randomly ignores container widths but does so differently than Gmail App for Android (no <style>).
  • Inbox by Gmail for iOS. Does not support <style> but seems to not suffer from as many quirks as other Gmail mobile apps.

這也就可以理解為什麼有時候手機上看起來怪怪的了 XD

Adobe Typekit 支援 CJK 字型

Adobe Typekit 宣佈支援 CJK 字型:「Announcing East Asian web font support and new font browsing tools for Japanese customers」。中文的公告在「正式公開東亞網頁字體支援以及日文客戶適用的全新字體瀏覽工具」這邊。

這也包括了網頁版的部份。對於 CJK 單一字型檔案過大的問題,與大家的解法也都一樣,取出對應的字組出來給使用者作為 workaround (稱為 Dynamic Subsetting):

會稱為這是 workaround 是因為當網路速度愈來愈之後,就會又變成最單純的直接整包下載...

Anyway,Adobe 這個新功能是一個大邁進,不過他用的 HTTPS (EdgeCast) 還沒支援 SPDY 或是 HTTP/2 啊... :/

jQuery 1.11.2 與 2.1.3 修正 iOS 8 上 Safari 7.1/8 的嚴重 bug

看到 jQuery 官方放出一個特別更新,專門為了 iOS 8 + Safari 7.1/8 的修正:「jQuery 1.11.2 and 2.1.3 Released – Safari Fail-Safe Edition」。

依據「Test failure on iOS 8: child and adjacent -> p#firstp + p」的說明,死在 document.querySelectorAll("p#firstp + p") 這邊,另外以下的 selector 也都掛掉:

p#a + p
p#a ~ p
.b#a ~ [id]
[style]#a ~ p

由於這個用法太基本,讓 jQuery 官方決定在 library 放 workaround 修正這個問題...