Sunday, July 25, 2010

Open-source/Free icons

Question:
Want to put icons on your website without having to violate some copyright with other websites or people?

Tuesday, July 20, 2010

Custom Fonts for your website

Do you want to add custom fonts on your website?
You can declare @font-face inside your CSS.

@font-face {
    font-family: custom_font;
    src: url('/fonts/custom_font.ttf');
}

h1 {
    font-family: custom_font;
}



This works for all browsers except for Internet Explorer, because it does not support TrueType Fonts (TTF)[wiki] it uses Embedded OpenType (EOT)[wiki] fonts. To do that, you must first convert you TTF fonts into EOT.

Applications:
Free online converters:
Next you need to include both EOT and TTF fonts.

@font-face {
    font-family: custom_font;
    src: url('/fonts/custom_font.eot'); /* IE reads only this line */
    src: local(custom_font), url('/fonts/custom_font.ttf') format('opentype');
    /* since IE does not know the "local" keyword it will skip this line */
}
h1 {
    font-family: custom_font;
}



Browsers supported:


Sources: