Itt a Safari 3.0

A mai Mac OS X Tiger frissítésben benne van a Safari 3.0 is, a Mac OS X Leopardban pedig alapból szerepel. Ez azt jelenti a webfejlesztők számára, hogy a Safari 2.0 részesedése a mai naptól drasztikusan fog csökkenni. Egy friss Windows verzió is kijött. A következőkben azt próbálom meg összefoglalni, hogy mit kínál a Safari 3.0.

Kezdjük a felhasználókat érintő változásokkal, hogy aztán gyorsan áttérhessünk a webfejlesztőket érintőkre. Egyrészt ugye a 3.0-s verzió immár Windowsra is elérhető. Az első Windows verziók valami iszonyat bénára sikerültek, de ez ne riasszon el senkit, ezeket a bugokat előbb-utóbb kijavítják, talán a legtöbb már ki is lett javítva a legfrissebb 3.0.4-es Windows-os verzióval. A Safari 3.0 újdonsága az átméretezhető szövegdoboz is, mely jól jöhet ha valamelyik webfejlesztő túl kicsire állított be egy hosszabb szöveg fogadását megcélzó textarea-t. Az átrendezhető fül sorrend szintén új – az egyik nekem legjobban tetsző fejlesztés is ezzel kapcsolatos: egy fült ki lehet ragadni a többi közül egy új ablakot létrehozva ezáltal. A Firefoxból jött át a “valós idejű keresés”, mely az oldal tartalmában gépelés közbeni találat megjelenést jelent.

Érdemes lehet megjegyezni, hogy Safari három nem csak MacOSX és Windows alatt érhető el, hanem a mobil MacOSX alatt is, vagyis iPhone-on és iPod Touch-on is. Ezt azért hangsúlyozom ki külön, mert lehet azt mondani, hogy az újdonságokat mivel más böngésző annyira nem támogatja még, ezért minek megismerni, de ezeken a mobil eszközökön ezeket nyugodtan lehet használni és kihasználni – sokan használják is.

CSS: a mai napon a Safari 3.0 a CSS szabvány(oka)t legjobban támogató kiadott böngésző. Egyrészt az aktuális CSS 2.1-t is kiválóan támogatja, másrészt pedig a CSS 3-ból is jópár dolgot megvalósít:

1. Több oszlopos tördelés: Egy adott blokk elemben több oszloposra tördelhetjük a szöveget. Ez a lehetőséget ugyan nem tartom jó ötletnek weben, de ami a nyomtatott oldalakat illeti, ott hasznos lehet. (-webkit-box-shadow)
2. Lekerekített sarkok: A Mozillából már ismert lehetőség a keretek lekerekítésére. (-webkit-border-radius)
3. “Négy dimenziós” színek (vagyis áttetszőség): a színeket ha RGB vagy HSL paramétereikkel adjuk meg, immáron egy negyediket, az áttetszőséget is használhatjuk (HSLA, RGBA). Ez gyakorlatilag annak a lehetősége, hogy az “opacity”-t, melyet a legtöbb böngésző támogat, színként is megadhassuk. Ezt a lehetőséget a FF3 is támogatni fogja. (rgba(255, 0, 0, 0.6))
4. Több háttérkép beállítása ugyanazon elemnek: Több háttérképet, különböző igazítást, ismétlési értéket is definiálhatunk. (a háttér képeket, pozícióikat vesszővel elválasztva kell felsorolni)
5. Képek használata keretként: vagyis immáron nem kell szenvedni grafikus keretek definiálásával – Safari alatt. (-webkit-border-image)
6. Árnyék a block elemeknek: A block megjelenésű elemeknek árnyékot is definiálhatunk. (-webkit-box-shadow)
7. Nyújtható háttérképek: A háttérképeknél immár az arányok is beállíthatóak, azaz lehet nyújtani, összenyomni azokat. Az Opera 9.5 is támogatja. (-webkit-background-size)
8. Szöveg kiemelések: Különböző paramétereken keresztül változatos módon állítható szöveg kiemelések (-webkit-text-stroke és egyebek)
9. Átméretezhető oldalelemek: A “block” megjelenésű elemek átméretezhetőek lesznek JS bűvészkedés nélkül is. (resize)
10. Háttér levágások: a háttérként beállított grafikát levághatjuk, meghatározhatjuk, hogy pontosan milyen eltolása legyen. FF is támogatja. (background-origin és background-clip)
11. Szöveg levágások: a túl hosszú szöveget le lehet vágni három ponttal, szabályozható, hogy szóhatárnál, vagy szó közepén legyen a vágás. Részben IE6 is támogatja, illetve Opera. FF csak vágni tud, pontokat kitenni nem. (text-overflow)

A lista nem teljes, kiválasztók, és egyéb paraméterek is támogatva vannak. A Safari 3.§ lehetővé teszi egyes form elemek átdesignolását is.

JavaScript: Nagyon sokat gyorsítottak a JavaScript értelmezőn is, de megjelent a Mozillából már ismert “getter”/”setter” támogatás, DOM osztályok “prototype” elérése (HTMLElement.prototype), fejlődött a HTML szerkesztés módban használható execCommand támogatás. Részben ide tartozik az XPath és XSLTProcessor támogatás fejlődése, megjelenése is.

A JavaScript gyorsítást a motor általános gyorsításával is, de apró trükkök bevezetésével érték el. Egy érdekes példa: az “onload” esemény már akkor elkezd lefutni, amikor az oldal valójában még nem töltődött be, bár ha olyan oldalelemre hivatkozunk bármilyen módon, ami még nem áll rendelkezésre, akkor a futása addig szünetel. Ezekkel a trükkökkel egy nagyon gyors böngészőt sikerült összehozniuk.

Végül de utolsó sorban bár Safarit én nem használok webfejlesztésre, de mindenképpen ki kell térni a Drosera kiegészítőre, mely egy JavaScript debuggert valósít meg – erről egész jókat hallani.