Windows Blog'as

Tie, kam teko koduoti (karpyti/programuoti) dizainus internetiniams puslapiams puslapiams, neabejoju, kad pritars man, jog kartais tai tikrai sukelia didžiulį galvos skausmą. Problema – neidentiškas sukoduoto dizaino atvaizdavimas keliose skirtingose naršyklėse. Čia į pagalbą ateina ne per seniausiai pasirodžiusi Microsoft Expression WEB trečioji versija su SuperPreview. Šiaip šio įrankio kaina 150$, tačiau studentai, užsiregistravę, gali parsisiųsti šią (o taip pat ir daugelį kitos programinės įrangos) nemokamai iš DreamSpark tinklalapio. Asmeniškai, pats Expression WEB manęs nesužavėjo, tačiau būtent atskira jo dalis – SuperPreview, apie kurią ir ketinu papasakoti, tikrai patiko.

Kairėje pusėje matote (spauskite ant paveiksliuko, norėdami jį padidint) pagrindinį (ir vienintelį) SuperPreview programos langą. Programos naudojimas paprastas: pasirenkamos norimos naršyklės ir įvedamas adresas. Nemažas minusas yra tai, kad kol kas palaikų naršyklių sąrašas apsiriboja tik Firefox 3.5 ir Internet Explorer 6-8 versijomis. Norisi tikėtis, kad ateityje šiame sąraše bus galima išvysti bent jau Chrome ir Operą. Naudinga funkcija yra tai, kad, užuot pasirinkus naršyklę, galim pasirinkti konkretų paveiksliuką. Ši funkcija labai patogi karpant dizainą, kai norima jį gauti būtent tokį, kokį nupaišė dizaineris, be jokių iškraipymų.
Taigi, pasirinkus norimas naršykles (jas galima pakeisti ir vėliau) bei įvedus norimo puslapio adresą, jis užkraunamas ir atvaizduojamas visose naršyklėse (t.y naudojant jų varikliukus). Puslapių atvaizdavimo išdėstymą galima keisti iš pradžioje, pagal nutylėjimą esančio vertikalaus į horizontalų, tik vieną arba persidengiantį. Pastarasis peržiūros būdas atrodo tikrai įdomiai: dalinai permatomas vaizdas iš abiejų naršyklių yra atvaizduojamas vienas ant kito. Tokiu būdu galima greitai pastebėti neatitikimus.

Grįžtame prie standartinio (vertikalaus vaizdo). Bet kurios naršyklės vaizde galime paspausti ant norimos vietos. Elementas, kurį spustelėjome yra pažymimas abiejose naršyklėse ir kampe parodomi jo atributai (matoma aukščiau įkeltoje nuotraukoje). Tokiu būdu tiksliai galime matyti kaip konkreti naršyklė interpretuoja elementą ir kokie yra jo atributai. Atributai, kurie nesutampa skirtingose naršyklėse, automatiškai pažymimi raudonai. Apačioje yra DOM mygtukas. Jeigu jį paspausime po to, kai pasirinksime elementą, galėsime peržiūrėti mūsų (X)HTML kodą, atsakingą už šį elementą.

Paskutinė funkcija, kurią norėčiau paminėti, tai galimybė pasirinkti rezoliuciją, kurioje atvaizduojamas puslapis. Tokiu būdu galima patikrinti, ar mūsų puslapis vienodai atrodo ne tik skirtingose naršyklėse, bet ir skirtingomis rezoliucijomis dirbančiuose monitoriuose.