Font Rendering Test<\/title><\/p>\n<style type = \"text\/css\">\n .col1 {\n float:left;\n width:33%;\n margin-left:1px;\n }\n .col2 {\n float:left;\n width:33%;\n margin-left:1px;\n }\n .col3 {\n float:right;\n width:33%;\n margin-right:1px;\n }\n<\/style>\n<\/head><\/p>\n<body> \n<center><\/p>\n<?php\n$s = \"\";\nfor($i=97;$i<123;$i++){\n $s = $s . chr($i);\n}\n\n$font_families = array(\"Serif\", \"Sans-serif\", \"Monospace\");\n$n = 1;\n\nforeach ($font_families as $font){\n echo \"\n\n<div class=\\\"col\" . $n . \"\\\"style=\\\"font-family:\" . $font . \"\\\">\\n”; \n for($i=5;$i<22;$i++){\n echo \"\n\n” . $i . ” px<\/p>\n\\n”; \n echo “<\/p>\n” . $s . “<\/p>\n\\n”; \n } \n echo “<\/p><\/div>\n\\n”; \n $n++; \n} \n?> \n<\/center> \n<\/html> \n<\/body> \n<\/html><\/p>\n[\/cc]<\/p>\nI happened to be using a computer running XP while I wrote this, so I decided to run the test on that computer, too.<\/p>\nXP<\/strong><\/p>\n<a href=\"http:\/\/yuguangzhang.com\/blog\/wp-content\/uploads\/2009\/12\/screenshot.1.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-medium wp-image-139\" title=\"screenshot.1\" src=\"http:\/\/yuguangzhang.com\/blog\/wp-content\/uploads\/2009\/12\/screenshot.1-300x296.png\" alt=\"screenshot.1\" width=\"300\" height=\"296\" srcset=\"http:\/\/yuguangzhang.com\/blog\/wp-content\/uploads\/2009\/12\/screenshot.1-300x296.png 300w, http:\/\/yuguangzhang.com\/blog\/wp-content\/uploads\/2009\/12\/screenshot.1.png 994w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\nXP, like Linux, does have color fringes, but they are less noticeable and appear at all font sizes.<\/p>\nToday, I booted Windows 7 to fill out a PDF form and print it across the network. I also planned to do some PDF editing using PDF X-Change Viewer. One thing that makes Windows different from Linux is that applications don’t have system-wide configuration file. PDF viewers have their own font rendering settings. Anyways, here’s what the fonts look like in Windows 7:<\/p>\n7<\/strong><\/p>\n<a href=\"http:\/\/yuguangzhang.com\/blog\/wp-content\/uploads\/2009\/12\/screenshot.11.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-medium wp-image-142\" title=\"screenshot.1\" src=\"http:\/\/yuguangzhang.com\/blog\/wp-content\/uploads\/2009\/12\/screenshot.11-300x226.png\" alt=\"screenshot.1\" width=\"300\" height=\"226\" srcset=\"http:\/\/yuguangzhang.com\/blog\/wp-content\/uploads\/2009\/12\/screenshot.11-300x226.png 300w, http:\/\/yuguangzhang.com\/blog\/wp-content\/uploads\/2009\/12\/screenshot.11.png 1005w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/strong><\/p>\nFonts in 7 does not have any rendering artifacts. Which is a reason <a href=\"http:\/\/www.howtogeek.com\/howto\/ubuntu\/enable-smooth-fonts-on-ubuntu-linux\/\">people do notice the difference when they switch to another OS<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"After changing some font display settings in Linux, I wanted to test the changes. The specific change I wanted to test was the hinting level adjusted by pixel size. Hinting affects how sharp the edges of displayed fonts are. (Note that this is different from print appearance.) The article that got me started adjusting font […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_import_markdown_pro_load_document_selector":0,"_import_markdown_pro_submit_text_textarea":"","footnotes":""},"categories":[5,7],"tags":[17],"class_list":["post-136","post","type-post","status-publish","format-standard","hentry","category-linux","category-windows","tag-font-smoothing"],"aioseo_notices":[],"_links":{"self":[{"href":"http:\/\/yuguangzhang.com\/blog\/wp-json\/wp\/v2\/posts\/136","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/yuguangzhang.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/yuguangzhang.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/yuguangzhang.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/yuguangzhang.com\/blog\/wp-json\/wp\/v2\/comments?post=136"}],"version-history":[{"count":0,"href":"http:\/\/yuguangzhang.com\/blog\/wp-json\/wp\/v2\/posts\/136\/revisions"}],"wp:attachment":[{"href":"http:\/\/yuguangzhang.com\/blog\/wp-json\/wp\/v2\/media?parent=136"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/yuguangzhang.com\/blog\/wp-json\/wp\/v2\/categories?post=136"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/yuguangzhang.com\/blog\/wp-json\/wp\/v2\/tags?post=136"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":136,"date":"2009-12-31T16:21:01","date_gmt":"2009-12-31T16:21:01","guid":{"rendered":"http:\/\/yuguangzhang.com\/blog\/?p=136"},"modified":"2009-12-31T16:21:01","modified_gmt":"2009-12-31T16:21:01","slug":"font-rendering-comparison","status":"publish","type":"post","link":"http:\/\/yuguangzhang.com\/blog\/font-rendering-comparison\/","title":{"rendered":"Font Rendering Comparison"},"content":{"rendered":"

After changing some font display settings in Linux, I wanted to test the changes. The specific change I wanted to test was the hinting level adjusted by pixel size. Hinting affects how sharp the edges of displayed fonts are. (Note that this is different from print appearance.) The article that got me started adjusting font display is a post on Planet Gentoo<\/a> that I read a while ago. I noticed that there was a suggestion to use medium hinting to reduce fuzziness on small fonts. That was interesting, so I turned on full hinting for small fonts, hint medium for medium fonts, and hint slight for large fonts. You can see the result on the screenshot.<\/p>\n

Linux<\/strong><\/p>\n

$\"snapshot1\"$ <\/a><\/p>\n

Medium hinting is set for pixel sizes between 7 and 11. As the size becomes larger, there are \u00a0noticeable\u00a0color fringes on the edge of the fonts. That’s where hint slight comes in.<\/p>\n

Now, there’s nothing fancy going on in Linux as all the settings can be changed in an XML file. So after adjust font in Linux, I decided to write a webpage to test the different pixel sizes.<\/p>\n