作者BLOG:http://chouyuchouyu.bokee.com
本文將討論中文絕對字號在瀏覽器的縮放顯示過程中的顯示效果。
先來說一下宋體中文的顯示效果。宋體文字顯示成12px、13px、14px、15px、16px、18px以及25px+的時候,效果是比較理想的。
下圖是宋體不同字號文字在瀏覽器(IE7 beta除外)中顯示的效果:
從圖中可以看到,當宋體顯示為17px、19px-24px時,易出現(xiàn)鋸齒、筆畫不均的現(xiàn)象。顯示為25px以上時,文字邊界被平滑處理,但是明顯不如12px或14px時顯示的那樣清晰。
瀏覽器是如何放大頁面文字的:
當我們將網(wǎng)頁上的文字放大的時候,實際上是使文字以另外一個較大的字號顯示。比如,在Firefox中,一個14px的中文被放大一擋的時候,顯示為15px;再放大一擋則顯示為17px。當Firefox將文字放大為17px的時候,顯示效果也是不理想的,象IE中顯示17px中文一樣的不理想。
在我們的印象中,似乎是IE瀏覽器不能縮放,而其它瀏覽器(比如,F(xiàn)irefox、Opera…)可以,可以縮放文字甚至是整個頁面。而實際上它們的區(qū)別是,IE瀏覽器只能對相對字號起作用,其它瀏覽器對相對、絕對字號都有效。不過,無論是哪一個都沒能克服宋體“12-16px、18px”的局限。
下面,我們來看看目前幾個主流瀏覽器的縮放功能:
Mozilla Firefox
Firefox的“縮放功能”是縮放文字大小,而不改變頁面上的其它元素。在“查看-文字大小”中,用戶可以選擇放大或縮小文字的顯示。無論使用的是相對字號還是絕對字號,一視同仁。
Firefox的“縮放功能”只提示通過chtrl+“+/—”可以放大或縮小文字,并沒有顯示當前的縮放倍數(shù)。所以,在這里,我只能用“放大一擋…”來描述。下表是12px的宋體文字在Firefox中,逐級放大后的效果:
在12px-18px的區(qū)間里,出現(xiàn)了17px。雖然,用戶將12px的文字放大4檔,顯示為17px的可能性并不大,但是,將12px放大兩檔,顯示為14px的需求還是存在的,而此時,頁面上原本是14px的文字正好顯示為17px。原本完美的14px變得慘不忍睹了。
Opera
Opera的縮放功能是將頁面整體縮放,文字、圖片、gif動畫、flash動畫,網(wǎng)頁上的所有內(nèi)容無一漏網(wǎng)。這個功能最接近真實的放大鏡。“如果您覺得網(wǎng)頁太小了,那就給您來一個放大鏡!边@個放大鏡最多可以將頁面放大為原先的1000%,當然,多數(shù)用戶是沒有必要這樣瀏覽網(wǎng)頁的,并且此時瀏覽器的響應(yīng)異常緩慢。這種整體放大可以保證頁面的布局基本不變。在IE7 beta出現(xiàn)之前,Opera是唯一一個能將頁面整體放大的瀏覽器。
下表是12px的宋體文字在Opera中,逐級放大后的效果:
在12px-18px的區(qū)間里正好跳過了17px,完美!使用1024×768分辨率的用戶如果希望放大寫顯示頁面,可以將顯示比例調(diào)整為120%。這樣原本12px的文字變成14px,原本14px的文字顯示為16px。頁面寬度由760px變?yōu)?12px,在1024×768的分辨率下,瀏覽器的顯示寬度約為1000px。一切都這么理想。難道是在天堂?
Netscape
Netscape的縮放功能與Firefox相似,只縮放文字,圖片不變。使用ctrl+“+/—”操作,頁面可以逐級被放大為120%、150%、200%。下表是12px的宋體文字在Netscape中,逐級放大后的效果:
似乎放大比例的變化量太大了。實際上,Netscape還提供了更精確的縮放功能,通過菜單欄的選擇,用戶可以輸入任意的整數(shù),調(diào)整縮放比例,只是操作起來不方便。
Internet Explorer
IE6的windows版中只支持文字大小的縮放,似乎和Firefox、Netscape相同。不過,IE的“文字大小”功能只針對相對字號的文字。相對字號在“文字大小”不同的設(shè)置中顯示出的字號,如下表所示:
如果頁面使用的是絕對字號,那么IE6則完全不能縮放文字。這在《用外國人的手寫中國字》中已經(jīng)討分析過了。下面來看IE7 beta。
在IE7 beta版中,保留了“文字大。═ext Size)”功能不變,另外提供了頁面縮放功能。在頁面的右下角用一個百分比的下拉菜單顯示。
這個功能是將整個頁面放大、縮小,頁面上的其它元素也隨之變化。不管是固定字號還是相對字號都可以縮放,與Opera的功能一樣。只是在顯示為140%的時候,12px的文字顯示為17px,而Opera是16px。下表中可以看到,宋體12px的文字在不同縮放比例中的字號大。
再重復(fù)一遍,這里說的是“頁面縮放”功能,而不是“文字大小”功能。IE7 beta中“文字大小”功能與IE6相同,仍舊是針對相對字號的功能。對于使用相對字號的網(wǎng)頁,在IE7 beta中可以將“頁面縮放”功能與“文字大小”功能配合起來使用。
在12px-18px的區(qū)間里出現(xiàn)了17px,遺憾!不過,還好,IE7 beta對文字顯示進行了優(yōu)化,這些原本顯示得很難看的字號變得漂亮了不少。
IE7 beta對文字顯示的優(yōu)化:
下圖左側(cè)是12px-26px的宋體文字在IE7 beta中的顯示效果,右側(cè)是文章開始時候看到的那張圖---在除IE7 beta以外的瀏覽器中的顯示效果:
這個對比中我們可以看到,IE7 beta對于原來顯示時有鋸齒、筆畫粗細不均的字號進行了優(yōu)化,比如,17px,19px...文字的邊緣做過平滑處理后,雖然不如14px那么清晰,但是至少比原先有鋸齒且筆畫粗細不均的顯示要好很多了。25px+的字號也略有改善,比原先更“黑”了些,看上去更清楚了點兒。
瀏覽器的升級帶給我們什么?
在IE7 beta推出之前,IE是唯一一個不能調(diào)整絕對字號顯示大小的瀏覽器(但是卻占有絕大部分市場)。如果在IE7的正式版中仍舊保留beta版中的頁面縮放功能的話,那么主流瀏覽器就全部能支持“調(diào)整絕對字號顯示大小”這個功能了。如果是這樣,那么,“是否需要將文字設(shè)置為相對字號?”的問題就解決了。
軟件功能的改善,解決了一個網(wǎng)頁設(shè)計的問題。讓我們?yōu)镮E歡呼吧:“IE,你好偉大。∧憬K于實現(xiàn)了別人早就有的功能了!”
出處:藍色理想
責任編輯:moby
◎進入論壇網(wǎng)站綜合、網(wǎng)頁制作版塊參加討論
|