A nice way of spending GEZ money, these subway ads were funny :)
2010-11-17
2010-10-30
(ro) Diacriticele și internetul
În articolul „Browsere Moderne” am testat comportamentul browserelor (Internet Explorer, Mozilla Firefox, Google Chrome, Opera, Apple Safari) la afișarea paginilor web care conțin caractere (ș și ț cu virgulă) neexistente în fonturile din sistemul de operare Windows XP.
Internet Explorer 6 a afișat pătrățele. Celelalte browsere au substituit fontul care nu conținea caracterele dorite cu alt font care conținea caracterele, dar această substituție se observă ușor și nu arată foarte bine.
În articolul „Browsere Moderne II” am folosit o altă abordare, am încercat să afișez pagina cu alte fonturi decât cele existente în sistemul de operare Windows XP.
Toate browserele (inclusiv Internet Explorer 6) au afișat corect paginile web. Dezavantajul la această abordare este gama foarte restrânsă de fonturi ce pot fi utilizate în acest fel și care să conțină diacriticele românești, la care se adaugă și timpul de descărcat fonturile de pe internet.
Se spune că a treia încercare este cu noroc, în acest articol voi prezenta o modalitate de afișare a paginilor web cu diacriticele corecte, având posibilitatea de a afișa diacriticele cu sedilă pe sistemele de operare fără fonturi actualizate.
Soluția este simplă, la încărcarea paginii se detectează dacă șirul "șȘțȚ" are aceeași lățime cu șirul "sStT", dacă au aceeași lățime nu se face nicio modificare a paginii, dacă nu atunci se înlocuiesc toate diacriticele cu virgulă cu diacriticele cu sedilă. Diferența de lățime vine de la faptul că șirul cu diacritice este înlocuit fie cu pătrățele (Internet Explorer 6), fie este substituit cu alt font (restul browserelor).
Această soluție funcționează pentru fonturile cu lățime variabilă, fonturile cu lățime fixă (ex. Courier New) nu pot fi folosite deoarece fiecare caracter are aceeași lățime.
Pentru ca o pagină web să poată folosi acest sistem de siguranță sunt necesari următorii pași:
Exemplu (aici diacriticele au fost trecute sub formă de cod hexazecimal):
Pagină de test: http://goo.gl/AwMKY, codul sursă al paginii web, și al scriptului Javascript. Mai jos am pus capturi de ecran ale unui sistem Windows XP: fără script, cu script dar fără fonturi actualizate și cu script și cu fonturi actualizate:
Un alt exemplu ar fi chiar acest blog. Configurarea am făcut-o astfel: în interfața Blogger am mers la "Design", apoi la "Edit HTML", unde conținutul scriptului diacritice.js (în locul celor trei puncte) l-am pus deasupra lui </head> sub forma:
Am testat cu sucess soluția pe următoarele browsere:
P.S.
Am făcut o serie de teste și pe Ubuntu 10.10 Maverick Meerkat pe următoarele browsere:
Aceasta se datorează faptului că Google Chrome folosește fontul „Times New Roman” ca font implicit pe Linux, font care nu face parte dintr-o distribuție de Linux. Am raportat problema la Google aici - Issue 61366.
În atenția utilizatorilor care instalează pe Linux pachetul de fonturi corefonts pentru a avea o experiență asemănătoare cu cea oferită de sistemul de operare Windows.
Toate fonturile din pachetul corefonts nu conțin diacriticele corecte, fapt care va face din sistemul Linux (Ubuntu 10.10 este nou nouț la data scrierii acestui articol) un Windows 98 și soluția din acest articol va converti toate diacriticele cu virgulă în diacritice cu sedilă!
P.P.S.
Am actualizat scriptul pentru cazul în care avem de-a face cu fonturi care au parțial diacriticele corecte: ș cu virgulă, dar fără ț cu virgulă, dar ț-ul cu sedilă fiind implementat ca ț cu virgulă. În acest caz numai ț este schimbat în varianta cu sedilă.
Android folosește familia de fonturi Droid care intră în categoria de fonturi descrisă mai sus.
Droid nu este singura familie de fonturi care suferă de această „anomalie”, la Google Font Directory am mai întâlnit familiile de fonturi: GFS Didot, GFS Neohellenic, Josefin Sans Std Light și Reenie Beanie.
Internet Explorer 6 a afișat pătrățele. Celelalte browsere au substituit fontul care nu conținea caracterele dorite cu alt font care conținea caracterele, dar această substituție se observă ușor și nu arată foarte bine.
În articolul „Browsere Moderne II” am folosit o altă abordare, am încercat să afișez pagina cu alte fonturi decât cele existente în sistemul de operare Windows XP.
Toate browserele (inclusiv Internet Explorer 6) au afișat corect paginile web. Dezavantajul la această abordare este gama foarte restrânsă de fonturi ce pot fi utilizate în acest fel și care să conțină diacriticele românești, la care se adaugă și timpul de descărcat fonturile de pe internet.
Se spune că a treia încercare este cu noroc, în acest articol voi prezenta o modalitate de afișare a paginilor web cu diacriticele corecte, având posibilitatea de a afișa diacriticele cu sedilă pe sistemele de operare fără fonturi actualizate.
Soluția este simplă, la încărcarea paginii se detectează dacă șirul "șȘțȚ" are aceeași lățime cu șirul "sStT", dacă au aceeași lățime nu se face nicio modificare a paginii, dacă nu atunci se înlocuiesc toate diacriticele cu virgulă cu diacriticele cu sedilă. Diferența de lățime vine de la faptul că șirul cu diacritice este înlocuit fie cu pătrățele (Internet Explorer 6), fie este substituit cu alt font (restul browserelor).
Această soluție funcționează pentru fonturile cu lățime variabilă, fonturile cu lățime fixă (ex. Courier New) nu pot fi folosite deoarece fiecare caracter are aceeași lățime.
Pentru ca o pagină web să poată folosi acest sistem de siguranță sunt necesari următorii pași:
- pagina web trebuie să fie codificată unicode utf-8
- diacriticele folosite trebuie să fie cu virgulă
- adăugarea unei singure linii de cod în secțiunea <head>, linia de cod indică calea la scriptul Javascript care face toată magia
Exemplu (aici diacriticele au fost trecute sub formă de cod hexazecimal):
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <script type="text/javascript" src="diacritice.js"></script> </head> <body> <p>Muzicologă în bej, vând whisky și tequila, preț fix</p> </body> </html>
Pagină de test: http://goo.gl/AwMKY, codul sursă al paginii web, și al scriptului Javascript. Mai jos am pus capturi de ecran ale unui sistem Windows XP: fără script, cu script dar fără fonturi actualizate și cu script și cu fonturi actualizate:
Fără scriptul diacritice.js
|
 |
Cu scriptul diacritice.js dar fără fonturile actualizate
|
 |
Cu scriptul diacritice.js și fonturile actualizate
|
 |
<script type="text/javascript"> //<![CDATA[ ... //]]> </script>
Am testat cu sucess soluția pe următoarele browsere:
- Internet Explorer 6.0, 7.0, 8.0
- Mozilla Firefox 3.6.12
- Opera 10.53
- Apple Safari 5.02
- Google Chrome 7.0
P.S.
Am făcut o serie de teste și pe Ubuntu 10.10 Maverick Meerkat pe următoarele browsere:
- Mozilla Firefox 3.6.12
- Opera 10.53
- Google Chrome 7.0
Aceasta se datorează faptului că Google Chrome folosește fontul „Times New Roman” ca font implicit pe Linux, font care nu face parte dintr-o distribuție de Linux. Am raportat problema la Google aici - Issue 61366.
În atenția utilizatorilor care instalează pe Linux pachetul de fonturi corefonts pentru a avea o experiență asemănătoare cu cea oferită de sistemul de operare Windows.
Toate fonturile din pachetul corefonts nu conțin diacriticele corecte, fapt care va face din sistemul Linux (Ubuntu 10.10 este nou nouț la data scrierii acestui articol) un Windows 98 și soluția din acest articol va converti toate diacriticele cu virgulă în diacritice cu sedilă!
P.P.S.
Am actualizat scriptul pentru cazul în care avem de-a face cu fonturi care au parțial diacriticele corecte: ș cu virgulă, dar fără ț cu virgulă, dar ț-ul cu sedilă fiind implementat ca ț cu virgulă. În acest caz numai ț este schimbat în varianta cu sedilă.
Android folosește familia de fonturi Droid care intră în categoria de fonturi descrisă mai sus.
Droid nu este singura familie de fonturi care suferă de această „anomalie”, la Google Font Directory am mai întâlnit familiile de fonturi: GFS Didot, GFS Neohellenic, Josefin Sans Std Light și Reenie Beanie.
2010-10-27
MSDN Subscription Donation
I would like to thank Mozilla for buying me a MSDN Subscription license, with this license I will have access to a lot of Microsoft software.
Activating a MSDN subscription is harder than one might think especially when you try to activate it on a different continent than the one where the subscription was bought.
Thank you Mozilla!
Activating a MSDN subscription is harder than one might think especially when you try to activate it on a different continent than the one where the subscription was bought.
Thank you Mozilla!
2010-10-22
Menus
After playing a bit with Firefox 4.0b6 I have noticed that something was different in the new Firefox, and that was caused by the font rendering used in the UI.
I know that Firefox is using Direct2D to render the UI on Windows 7, but in this area is not necessarily a step forward, and I hope that there is something to be done in this aspect (I have already given feedback using the build in feedback system)
I have made screen shots of Firefox 3.6 vs Firefox 4.0b6:
I have also done screen shots of Internet Explorer 8 vs Internet Explorer 9beta:
Notice that Internet Explorer 9 doesn't seem very different than Internet Explorer 8. I'm not sure that they did a better job at using Direct 2D than Firefox because they might not use Direct2D for menus all together.
This reminds me how broken was text rendering in WPF applications, but Microsoft seems to have fixed that in WPF4, see this blog entry about Visual Studio 2010
Also worth mentioning is that I have used the latest NVidia drivers for my graphics card:
Edit: This behavior was reported as bug #594325
I know that Firefox is using Direct2D to render the UI on Windows 7, but in this area is not necessarily a step forward, and I hope that there is something to be done in this aspect (I have already given feedback using the build in feedback system)
I have made screen shots of Firefox 3.6 vs Firefox 4.0b6:
I have also done screen shots of Internet Explorer 8 vs Internet Explorer 9beta:
Notice that Internet Explorer 9 doesn't seem very different than Internet Explorer 8. I'm not sure that they did a better job at using Direct 2D than Firefox because they might not use Direct2D for menus all together.
This reminds me how broken was text rendering in WPF applications, but Microsoft seems to have fixed that in WPF4, see this blog entry about Visual Studio 2010
Also worth mentioning is that I have used the latest NVidia drivers for my graphics card:
Edit: This behavior was reported as bug #594325
2010-10-17
SSL, Certum SSL
For the past year we at Xiph have been using a SSL certificate for the following subdomains: svn, git, and trac.
The SSL certificate was kindly given to us by Certum at no cost.
Usually users do not notice that the SSL certificate is in place, unless the SSL certificate is not recognized by the web browser, which will complain that the web site is not safe to browse.
I would like to thank Certum for allowing us to have non scary user experience while browsing our web servers.
Edit 25.10.2010 The offer was valid for one year, this year we did not get the
renewal.
The SSL certificate was kindly given to us by Certum at no cost.
Usually users do not notice that the SSL certificate is in place, unless the SSL certificate is not recognized by the web browser, which will complain that the web site is not safe to browse.
I would like to thank Certum for allowing us to have non scary user experience while browsing our web servers.
Edit 25.10.2010 The offer was valid for one year, this year we did not get the
renewal.
2010-09-21
(ro) Diacritice pe HTC Leo
De curând am intrat în posesia unui telefon HTC Leo (zis și HTC HD2), telefon care are ca sistem de operare Windows Mobile 6.5.
Windows Mobile 6.5 nu poate afișa corect diacriticele românești, în special ș și ț cu virgulă. La introdus diacritice de la tastatură HTC HD2/Leo permite introducerea lui â, î, ş și ţ (varianta cu sedilă), dar lipsește ă.
Diacriticele se introduc după ce se ține apăsată tasta a, i, s, respectiv t, după care se aleg din meniul prezentat. În practică mie mi s-a părut destul de greoi să țin apăsată tasta și apoi să aleg din meniu.
Pentru a repara problema afișării diacriticelor am făcut un cab cu fontul Droid, font care este oferit de Google sub o licență care permite redistribuirea liberă. Fontul original Droid duce lipsa lui ț, am folosit o variantă modificată.
Pentru problema introducerii diacriticelor am făcut un cab cu modificări aduse aranjamentului de taste implicit (două fișiere xml, unul pentru modul portret și unul pentru modul peisaj). Diacriticele se introduc direct ținând apăsat tastele a, q, i, s, t.
Numerele și restul de simboluri care se introduceau în mod direct ținând apăsat tastele sunt accesibile din meniu. Am adăugat în mod implicit simbolul € pe tasta f, simbolul $ este accesibil din meniu.
Rezultatul se află în captura de mai jos:
Caburile se află aici: DroidFonts.cab, respectiv htc_leo_keyboard.cab. Ar mai fi de menționat faptul că este necesar un restart al telefonului, că s-ar putea să meargă doar pe HTC Leo și că nu funcționează cu T9.
Edit Am făcut o nouă versiune de htc_leo_keyboard.cab, versiune care nu mai are caracterul "â" și pe tasta "a" (în modul portret nu mai încăpea meniul pe ecran). De asemenea am inversat $ cu € pe tastatura numerică.
Spor la tastat.
Windows Mobile 6.5 nu poate afișa corect diacriticele românești, în special ș și ț cu virgulă. La introdus diacritice de la tastatură HTC HD2/Leo permite introducerea lui â, î, ş și ţ (varianta cu sedilă), dar lipsește ă.
Diacriticele se introduc după ce se ține apăsată tasta a, i, s, respectiv t, după care se aleg din meniul prezentat. În practică mie mi s-a părut destul de greoi să țin apăsată tasta și apoi să aleg din meniu.
Pentru a repara problema afișării diacriticelor am făcut un cab cu fontul Droid, font care este oferit de Google sub o licență care permite redistribuirea liberă. Fontul original Droid duce lipsa lui ț, am folosit o variantă modificată.
Pentru problema introducerii diacriticelor am făcut un cab cu modificări aduse aranjamentului de taste implicit (două fișiere xml, unul pentru modul portret și unul pentru modul peisaj). Diacriticele se introduc direct ținând apăsat tastele a, q, i, s, t.
Numerele și restul de simboluri care se introduceau în mod direct ținând apăsat tastele sunt accesibile din meniu. Am adăugat în mod implicit simbolul € pe tasta f, simbolul $ este accesibil din meniu.
Rezultatul se află în captura de mai jos:
Caburile se află aici: DroidFonts.cab, respectiv htc_leo_keyboard.cab. Ar mai fi de menționat faptul că este necesar un restart al telefonului, că s-ar putea să meargă doar pe HTC Leo și că nu funcționează cu T9.
Edit Am făcut o nouă versiune de htc_leo_keyboard.cab, versiune care nu mai are caracterul "â" și pe tasta "a" (în modul portret nu mai încăpea meniul pe ecran). De asemenea am inversat $ cu € pe tastatura numerică.
Spor la tastat.
2010-09-02
DirectX Error Lookup
DirectShow is a COM based technology. COM uses for error reporting the (in)famous HRESULTs.
These HRESULTs are numbers like 0x80040227, but what do they mean? Visual Studio has a nifty MFC utility called "Error Lookup". But what happens if you lookup 0x80040227? "Message not found" pops up.
It seems that the DirectShow HRESULTs are out of reach for "Error Lookup". "Error Lookup" has a button named "Modules", maybe we can add the DirectShow HRESULTs there.
After adding "QUARTZ.DLL" in "Error Lookup" module list, 0x80040227 becomes "The operation could not be performed because the filter is in the wrong state." Sometimes the trick of adding quartz.dll doesn't work, then what?
DirectX has some nice error lookup functions named DXGetErrorString and DXGetErrorDescription, which give information about DirectX components and Win32 functions.
I have made a small tool called dxerr (source code here) which makes use of the two functions.
You might be tempted to use these two functions in your programs, but note that these functions might increase your binary with a couple of hundred kilobytes, and you need to have the DirectX SDK installed.
With the use of dxerr 0x80040227 has also a name: VFW_E_WRONG_STATE, which you might have found out by doing a Google search.
Here is a screenshot displaying "Error Lookup" and "dxerr".
After creating the "dxerr" tool I've found out that there is a tool named "DXErr.exe" in the DirectX SDK under "Utilities\bin\x86". I had no idea about that, but now that I know about it, it doesn't make a big difference :)
dxerr can be of use to those who do not have the DirectX SDK installed, to those who program with other programming languages than C++, or to those who program using C++ but with a compiler from a different vendor.
These HRESULTs are numbers like 0x80040227, but what do they mean? Visual Studio has a nifty MFC utility called "Error Lookup". But what happens if you lookup 0x80040227? "Message not found" pops up.
It seems that the DirectShow HRESULTs are out of reach for "Error Lookup". "Error Lookup" has a button named "Modules", maybe we can add the DirectShow HRESULTs there.
After adding "QUARTZ.DLL" in "Error Lookup" module list, 0x80040227 becomes "The operation could not be performed because the filter is in the wrong state." Sometimes the trick of adding quartz.dll doesn't work, then what?
DirectX has some nice error lookup functions named DXGetErrorString and DXGetErrorDescription, which give information about DirectX components and Win32 functions.
I have made a small tool called dxerr (source code here) which makes use of the two functions.
You might be tempted to use these two functions in your programs, but note that these functions might increase your binary with a couple of hundred kilobytes, and you need to have the DirectX SDK installed.
With the use of dxerr 0x80040227 has also a name: VFW_E_WRONG_STATE, which you might have found out by doing a Google search.
Here is a screenshot displaying "Error Lookup" and "dxerr".
After creating the "dxerr" tool I've found out that there is a tool named "DXErr.exe" in the DirectX SDK under "Utilities\bin\x86". I had no idea about that, but now that I know about it, it doesn't make a big difference :)
dxerr can be of use to those who do not have the DirectX SDK installed, to those who program with other programming languages than C++, or to those who program using C++ but with a compiler from a different vendor.
2010-08-04
OpenCodecs, WebM, and Windows Mobile
Over a month ago I have released the first version of OpenCodecs. OpenCodecs is the new name of the OggCodecs DirectShow package after the addition of WebM codecs.
OpenCodecs was the first release to have an unified 32/64 bit installer package, the 64 bit components are installed only if the operating system is 64 bit.
Today I have released a new OpenCodecs version, one for Windows Mobile 5.0 - 6.5. This is only a decoder package and WebM/VP8 decoders are not present.
Seeking is also disabled for Ogg Vorbis, Theora and Speex, due to the way the seeking table is build (at beginning, reading the whole media file), which turns to be very slow on Windows Mobile.
On my Palm Treo Pro (which is actually a rebranded HTC) the default video renderer "HTC DX Renderer" does not work with Theora, I had to change it with the Microsoft "Video Renderer" to have Theora working.
This was done by changing the filter merit in Registry. I have used Total Commander for this task (it has a Registry editor) and View Graph to test which filters actually work (this is the Windows Mobile version of GraphEdit)
I have made a recording showing "Big Buck Bunny" running on my Palm Treo Pro:
This version doesn't have any arm assembly optimizations for Vorbis, Theora, and for yuv2rgb conversion. My test video had a resolution of 320x180 (Palm Treo Pro has a 320x320 display) and I do not know how well it works with higher resolution video files.
Edit: In case you were thinking at changing the video renderer's filter merit, here is what you need to look after (beware that you might experience sudden system reboots):
Palm Teo Pro:
[HKEY_CLASSES_ROOT\CLSID\{70e102b0-5556-11ce-97c0-00aa0055595a}]
@="Video Renderer"
"Merit"=dword:00800000
[HKEY_CLASSES_ROOT\CLSID\{016229F3-158F-4a0a-8656-85F894F1405D}]
@="HTC DX Renderer"
"Merit"=dword:00800100
HTC Touch Pro 2:
[HKEY_CLASSES_ROOT\CLSID\{70e102b0-5556-11ce-97c0-00aa0055595a}]
@="Video Renderer"
"Merit"=dword:00800000
[HKEY_CLASSES_ROOT\CLSID\{1ADAFBDB-2E09-447f-94C4-39B195860BC6}]
@="HTC DDR(VO)"
"Merit"=dword:00800005
You will have to swap the merits for those two filters. Normally Theora should also work with HTC Video Rendrers, but at the moment I do not know how to make them work.
I'm planning (if I get my US visitor visa) to go to Open Video Alliance, and FOMS in October.
I have put a Donate button (orange button on the right side) in the hope of financing the trip to New York for my wife.
Thank you for your support and enjoy this OpenCodecs release.
OpenCodecs was the first release to have an unified 32/64 bit installer package, the 64 bit components are installed only if the operating system is 64 bit.
Today I have released a new OpenCodecs version, one for Windows Mobile 5.0 - 6.5. This is only a decoder package and WebM/VP8 decoders are not present.
Seeking is also disabled for Ogg Vorbis, Theora and Speex, due to the way the seeking table is build (at beginning, reading the whole media file), which turns to be very slow on Windows Mobile.
On my Palm Treo Pro (which is actually a rebranded HTC) the default video renderer "HTC DX Renderer" does not work with Theora, I had to change it with the Microsoft "Video Renderer" to have Theora working.
This was done by changing the filter merit in Registry. I have used Total Commander for this task (it has a Registry editor) and View Graph to test which filters actually work (this is the Windows Mobile version of GraphEdit)
I have made a recording showing "Big Buck Bunny" running on my Palm Treo Pro:
This version doesn't have any arm assembly optimizations for Vorbis, Theora, and for yuv2rgb conversion. My test video had a resolution of 320x180 (Palm Treo Pro has a 320x320 display) and I do not know how well it works with higher resolution video files.
Edit: In case you were thinking at changing the video renderer's filter merit, here is what you need to look after (beware that you might experience sudden system reboots):
Palm Teo Pro:
[HKEY_CLASSES_ROOT\CLSID\{70e102b0-5556-11ce-97c0-00aa0055595a}]
@="Video Renderer"
"Merit"=dword:00800000
[HKEY_CLASSES_ROOT\CLSID\{016229F3-158F-4a0a-8656-85F894F1405D}]
@="HTC DX Renderer"
"Merit"=dword:00800100
HTC Touch Pro 2:
[HKEY_CLASSES_ROOT\CLSID\{70e102b0-5556-11ce-97c0-00aa0055595a}]
@="Video Renderer"
"Merit"=dword:00800000
[HKEY_CLASSES_ROOT\CLSID\{1ADAFBDB-2E09-447f-94C4-39B195860BC6}]
@="HTC DDR(VO)"
"Merit"=dword:00800005
You will have to swap the merits for those two filters. Normally Theora should also work with HTC Video Rendrers, but at the moment I do not know how to make them work.
I'm planning (if I get my US visitor visa) to go to Open Video Alliance, and FOMS in October.
I have put a Donate button (orange button on the right side) in the hope of financing the trip to New York for my wife.
Thank you for your support and enjoy this OpenCodecs release.
2010-05-16
rOGG on!
The "rOGG on!" title was borrowed from the FSFE campaign: Radio stations granted awards for using Open Standards. I think FSFE should also "boo" radio stations which drop support for Open Standards (Radio Swiss Jazz used to have a Vorbis stream)
In a previous blog entry I was presenting a technical preview of the HTML5 <video> tag running on Internet Explorer. That version worked only in
a few controlled cases.
I have released a new Xiph.Org Ogg Codecs version (grab it from here) which makes the technical preview of the HTML5 <video> tag a bit more useful.
In this version I have dropped the custom file/network reading code and now I rely on built in DirectShow filters to provide the same (better) functionality. Now one can listen to Absolute Classic Rock behind a network proxy using Windows Media Player.
Here are the improvements to the HTML5 <video> tag:
I have made a screen cast to illustrate the new features (better viewed full screen):
The wallpaper picture was taken in the beautiful island of Burano
I would like to thank Philip Jägenstedt for his contribution, which speedup this release.
In a previous blog entry I was presenting a technical preview of the HTML5 <video> tag running on Internet Explorer. That version worked only in
a few controlled cases.
I have released a new Xiph.Org Ogg Codecs version (grab it from here) which makes the technical preview of the HTML5 <video> tag a bit more useful.
In this version I have dropped the custom file/network reading code and now I rely on built in DirectShow filters to provide the same (better) functionality. Now one can listen to Absolute Classic Rock behind a network proxy using Windows Media Player.
Here are the improvements to the HTML5 <video> tag:
- URI support given by uriparser library
- VMR9 support (instead of VMR7), this requires DirectX9
- Internet Explorer Standards mode support, instead of just Quirks mode
- width and height basic attribute support
I have made a screen cast to illustrate the new features (better viewed full screen):
The wallpaper picture was taken in the beautiful island of Burano
I would like to thank Philip Jägenstedt for his contribution, which speedup this release.
2010-04-29
Browsere Moderne II
În articolul Browsere Moderne am testat comportamentul browserelor Internet Explorer, Firefox, Chrome, Opera, Safari în privința randării textului folosind caractere (ș și ț cu virgulă) care nu se află în fonturile instalate în sistemul de operare (Windows XP).
Rezultatele nu au fost foarte bune, caracterele lipsă arată corespunzător dar nu se integrează cu restul textului.
În acest articol voi testa browserele folosind pagini web conținând fonturi stocate pe server (înglobate), fonturi care conțin caracterele ș și ț cu virgulă. Am ales familia de fonturi "DejaVu Sans" deoarece poate fi distribuită liber (familie de fonturi folosită pe sistemul de operare Linux, distribuită și în suita de software birotic "Open Office")
Un font poate fi înglobat într-o pagină web folosind directiva CSS @font-face. Toate browserele suportă fonturile în format „TrueType (.ttf)”, excepție făcând Internet Explorer care suportă formatul „Embedded OpenType (.eot)”. Am convertit fonturile din formatul „TrueType” la formatul „Embedded OpenType” folosind ttf2eot. Un exemplu de cum se folosește @font-face se găsește aici.
Paginile de web folosite la testarea browserelor sunt: pangrama (codată UTF-8), pangrama-latin10 (codată ISO-8859-16), respectiv versiunile pentru Internet Explorer: pangrama-ie și pangrama-ie-latin10
Rezultatele obținute pe sistemul de operare Windows XP SP2, fără fonturi actualizate, și fără a avea familia de fonturi „DejaVu Sans” instalată local în sistemul de operare sunt:
Toate browserele de mai sus afișează pagina codată UTF-8 perfect, pagina codată ISO-8859-16 este afișată incorect doar de către Internet Explorer.
Internet Explorer începând cu versiunea 7 suportă codarea ISO-8859-16, dar din păcate parțial. Am raportat problema la Microsoft #554861 - ISO-8859-16 codepage support.
Un dezavantaj al fonturilor incluse în pagina web poate fi mărimea lor (aproximativ 3 Mbytes), deoarece trebuie descărcate de pe server la accesare. Acest dezavantaj poate fi redus prin stocarea fonturilor, de către browser, pentru accesări ulterioare.
Am arătat că se pot afișa pagini web, care conțin diacriticele corecte, pe sistemul de operare Windows XP, singura condiție este ca utilizatorul să ruleze un browser care suportă directiva CSS @font-face. Aici găsiți o listă cu aceste browsere.
Actualizare Google a lansat serviciul Google Font Directory, serviciu care oferă fonturi pentru „toată lumea”. Tehnic @font-face este folosit, dar indirect, sub o formă care merge pe toate browserele.
Am făcut pagini de test pentru toate fonturile din Google Font Directory, din păcate foarte multe dintre ele au probleme cu diacriticele. Puteți vota pentru sugestia făcută de mine, poate Google va lua măsuri și va repara problema cu diacriticele.
Rezultatele nu au fost foarte bune, caracterele lipsă arată corespunzător dar nu se integrează cu restul textului.
În acest articol voi testa browserele folosind pagini web conținând fonturi stocate pe server (înglobate), fonturi care conțin caracterele ș și ț cu virgulă. Am ales familia de fonturi "DejaVu Sans" deoarece poate fi distribuită liber (familie de fonturi folosită pe sistemul de operare Linux, distribuită și în suita de software birotic "Open Office")
Un font poate fi înglobat într-o pagină web folosind directiva CSS @font-face. Toate browserele suportă fonturile în format „TrueType (.ttf)”, excepție făcând Internet Explorer care suportă formatul „Embedded OpenType (.eot)”. Am convertit fonturile din formatul „TrueType” la formatul „Embedded OpenType” folosind ttf2eot. Un exemplu de cum se folosește @font-face se găsește aici.
Paginile de web folosite la testarea browserelor sunt: pangrama (codată UTF-8), pangrama-latin10 (codată ISO-8859-16), respectiv versiunile pentru Internet Explorer: pangrama-ie și pangrama-ie-latin10
Rezultatele obținute pe sistemul de operare Windows XP SP2, fără fonturi actualizate, și fără a avea familia de fonturi „DejaVu Sans” instalată local în sistemul de operare sunt:
- Internet Explorer 6: UTF-8, ISO-8859-16
- Internet Explorer 7: UTF-8, ISO-8859-16
- Internet Explorer 8: UTF-8, ISO-8859-16
- Mozilla Firefox 3.6.3: UTF-8, ISO-8859-16
- Chrome 4.1: UTF-8, ISO-8859-16
- Opera 10.52: UTF-8, ISO-8859-16
- Safari 4.1: UTF-8, ISO-8859-16
Toate browserele de mai sus afișează pagina codată UTF-8 perfect, pagina codată ISO-8859-16 este afișată incorect doar de către Internet Explorer.
Internet Explorer începând cu versiunea 7 suportă codarea ISO-8859-16, dar din păcate parțial. Am raportat problema la Microsoft #554861 - ISO-8859-16 codepage support.
Un dezavantaj al fonturilor incluse în pagina web poate fi mărimea lor (aproximativ 3 Mbytes), deoarece trebuie descărcate de pe server la accesare. Acest dezavantaj poate fi redus prin stocarea fonturilor, de către browser, pentru accesări ulterioare.
Am arătat că se pot afișa pagini web, care conțin diacriticele corecte, pe sistemul de operare Windows XP, singura condiție este ca utilizatorul să ruleze un browser care suportă directiva CSS @font-face. Aici găsiți o listă cu aceste browsere.
Actualizare Google a lansat serviciul Google Font Directory, serviciu care oferă fonturi pentru „toată lumea”. Tehnic @font-face este folosit, dar indirect, sub o formă care merge pe toate browserele.
Am făcut pagini de test pentru toate fonturile din Google Font Directory, din păcate foarte multe dintre ele au probleme cu diacriticele. Puteți vota pentru sugestia făcută de mine, poate Google va lua măsuri și va repara problema cu diacriticele.
2010-02-22
IE <video> tag - Take Two
Recently I have released a new version of Xiph.Org Ogg Codecs (grab it from here), this new version includes a few Theora and FLAC bugfixes, better Windows 7 support and a Technical Preview of the <video> tag for Internet Explorer.
By Technical Preview I mean only basic playback, no seeking, no controls, no HTML5 interfaces.
I have made a screen cast showing this feature:
To enable <video> tag for Internet Explorer you need to add xmlns="http://www.w3.org/1999/xhtml/video" attribute.
Edit: It works only when Internet Explorer is in Quirks mode
Mozilla's Bug 435339 - DirectShow backend for HTML5 video element - has helped me a lot, to say the least (thank you Chris Pearce).
The webpage used in screencast is: http://people.xiph.org/~maikmerten/demos/bigbuckbunny-videoonly.html with the xmlns attribute for <video>. Note that I have copied the webpage and the movie on my webserver, that page does not have the xmlns attribute.
Hope it works for you as it did for me in the screen cast above :)
Download the 32bit version installer from here (1,09Mb).
Edit: In order to use the <video> tag on Internet Explorer 6.0 and 7.0 please read my first IE <video> tag blog entry.
I have found out that there is an incompatibility between Windows XP and VMware while using the DirectShow Video Mixing Renderer 7 filter.
By Technical Preview I mean only basic playback, no seeking, no controls, no HTML5 interfaces.
I have made a screen cast showing this feature:
To enable <video> tag for Internet Explorer you need to add xmlns="http://www.w3.org/1999/xhtml/video" attribute.
Edit: It works only when Internet Explorer is in Quirks mode
Mozilla's Bug 435339 - DirectShow backend for HTML5 video element - has helped me a lot, to say the least (thank you Chris Pearce).
The webpage used in screencast is: http://people.xiph.org/~maikmerten/demos/bigbuckbunny-videoonly.html with the xmlns attribute for <video>. Note that I have copied the webpage and the movie on my webserver, that page does not have the xmlns attribute.
Hope it works for you as it did for me in the screen cast above :)
Download the 32bit version installer from here (1,09Mb).
Edit: In order to use the <video> tag on Internet Explorer 6.0 and 7.0 please read my first IE <video> tag blog entry.
I have found out that there is an incompatibility between Windows XP and VMware while using the DirectShow Video Mixing Renderer 7 filter.
2010-02-11
IECanvas build
In my previous blog entry I've mentioned Vladimir Vukićević's IECanvas experiment, but at that time my IECanvas build was not working.
In the meantime I've made it work, added support for the new IE8 xml namespace, removed some of the ActiveX usage popups (there is only one infobar popup at first run), packaged it in a small installer.
Souce code with all dependent libraries (cairo, pixman, libpng, zlib) is located here. Download the 32bit installer from here (329Kb)
I've made a screen cast about how IECanvas experience looks like (nice beta fish background):
The two presented canvases are: squares with alpha blending and clock (which should look a bit different in other browsers than in the video)
One only needs to add the xmlns="http://www.w3.org/1999/xhtml/canvas" attribute to a <canvas> tag to have canvas working on IE, but the <canvas> support in IECanvas is far from complete.
<video> will have the same user experience as the IECanvas ActiveX,
and it theory it should be able to coexist with the <canvas> tag.
In the meantime I've made it work, added support for the new IE8 xml namespace, removed some of the ActiveX usage popups (there is only one infobar popup at first run), packaged it in a small installer.
Souce code with all dependent libraries (cairo, pixman, libpng, zlib) is located here. Download the 32bit installer from here (329Kb)
I've made a screen cast about how IECanvas experience looks like (nice beta fish background):
The two presented canvases are: squares with alpha blending and clock (which should look a bit different in other browsers than in the video)
One only needs to add the xmlns="http://www.w3.org/1999/xhtml/canvas" attribute to a <canvas> tag to have canvas working on IE, but the <canvas> support in IECanvas is far from complete.
<video> will have the same user experience as the IECanvas ActiveX,
and it theory it should be able to coexist with the <canvas> tag.
2010-01-15
IE <video> tag
I have started hacking a <video> tag implementation for Microsoft Internet Explorer, based on the work of Vladimir Vukićević's IECanvas experiment. Source code is located here.
The AxPlayer will use the DirectShow OggCodecs for the actual video playback. At the moment it doesn't do much, it just displays a gray rectangle where the video should be, as seen below:
Internet Explorer versions 6.0 and 7.0 required the following syntax for Binary Element Behaviour components:
Internet Explorer 8 has an improved syntax:
The <object> information has been moved into Windows Registry instead of html code:
The xmlns needs to be there in order to link <video> tag to AxPlayer, but the code looks way better :)
Next steps would be:
The AxPlayer will use the DirectShow OggCodecs for the actual video playback. At the moment it doesn't do much, it just displays a gray rectangle where the video should be, as seen below:
Internet Explorer versions 6.0 and 7.0 required the following syntax for Binary Element Behaviour components:
<html xmlns:html5>
<head>
<object id="videoFactory" classid="clsid:7cc95ae6-c1fa-40cc-ab17-3e91da2f77ca"></object>
<?import namespace="html5" implementation="#videoFactory"?>
</head>
<body>
<p>This is a header </p>
<html5:video src="http://videos.mozilla.org/firefox/3.5/meet/meet.ogv">
<p>your browser cannot handle video tag</p>
</html5:video>
<p>This is a footer </p>
</body>
</html>
Internet Explorer 8 has an improved syntax:
<html>
<body>
<p>This is a header </p>
<video src="http://videos.mozilla.org/firefox/3.5/meet/meet.ogv"
xmlns="http://www.w3.org/1999/xhtml">
<p>your browser cannot handle video tag.</p>
</video>
<p>This is a footer </p>
</body>
</html>
The <object> information has been moved into Windows Registry instead of html code:
The xmlns needs to be there in order to link <video> tag to AxPlayer, but the code looks way better :)
Next steps would be:
- Actually display a video instead of a gray rectangle
- Modify the OggCodecs source filter to proper handle videos from network
- Implement the <video> and <audio> W3C HTML5 tag specifications
- Improve the user experience by implementing all it's needed for Internet Explorer not to display the ActiveX warning popups.
Subscribe to:
Posts (Atom)