Q: What do I get for the Web designer who has everything?

The short answer is real estate.

The slightly longer answer is, anything that helps spark their creativity.

The long answer is that, whether it’s Christmas, Hanukkah, Kwanzaa or another December holiday (I prefer Saturnalia myself) the Winter Solstice is traditionally a time of gift giving. So, what to give to that Web designer you know who has everything they need to actually make Web sites?

Here are 10 ideas for gifts they will love but not expect.

NOTE: All prices are in US Dollars and rounded to the nearest dollar.

1. Icons Web Design Books by Taschen

Taschen Web Design book from their Icons series.

$10/each

Taschen makes beautiful books. They make especially beautiful books about visual design, and the books in their Web Design series are chock full of cool Web sites with brief, to the point descriptions. I like to pick these up while I’m brainstorming to get ideas and inspirations.

At 10 bucks a copy, they also make an inexpensive gift or great stocking stuffer. Get these online from Taschen, Amazon, or Powels or find them in a local book shop.

More Gifts »

Tags: Web Design by jason
No Comments »

Q: Should I use Hex or RGB values to define colors in CSS?

Adobe's Kuler Web application lets you choose a color palette and see each colors value in multiple formats, including HEX and RGB.

The short answer is RGB.

The slightly longer answer is that Hex values have become the de facto standard for use in CSS code and both developers and designers are used to them.

The long answer is that, in the final design on the screen, there is no difference between using Hex or RGB values in your code. Which system you use is really a matter of you own personal preference (and those of the team you are working with) as to whether or not you use Hex or RGB values to define colors.

Tags: Web Design by jason
No Comments »

NOTE: This article was originally intended to be included in Fluid Web Typography, but was cut at the last minute due to new technologies that rendered the technique being described all but irrelevant. It is presented here for anyone who needs to do things the hard way.

Internet Explorer has had the ability to download font files since version 4. The only catch is that, rather than allowing the download of standard font file types (OpenType and TrueType), Internet Explorer only allows the use of the little known and—until a few years ago—proprietary Embedded Open Type (EOT) format. The EOT format adds certain protections to the font file, in theory preventing it from being stolen by the end user or by being used across different domains.

WEFT

Until recently, the only method for creating the EOT was to convert TrueType fonts (not OpenType) files was using The WEFT application, created by Microsoft in the late 1990’s and not updated in almost 10 years. Recently, FontSquirrel began providing a service allowing you to convert both OpenType and TrueType font files to EOT font files—as well as SVG and WOFF font files—rendering WEFT conversion obsolete. However, if you need to do things the hard way, here are instructions for using Microsoft WEFT.

1. Get WEFT
   You can download it from microsoft.com/typography/WEFT.mspx, then install it in a Windows environment.
2. Create an EOT font file with the WEFT wizard
   After starting WEFT, Click the “Wizard” button and then click “Next”, carefully ignoring the instructions provided on this screen.
   • Enter your name and E-mail and click “Next.”
   • Enter your root web address (e.g. www.brighteyemedia.com), making sure that http:// is selected, and click “add”.
   • After WEFT checks for the domain, click “Next.”
   • Choose “Skip analysis” then click “Next”. This is important as analysis will cause WEFT to hang.
   • Under Subsetting choose “No subsetting” and click “Add…” Although in theory, subsetting would be nice, choosing any option other than no subsetting causes WEFT to hang. A green circle with a check next to the font indicates that it is ok to go. A red circle with and x indicates that the font is unsuitable.
   • Select the font to be created and click “OK.”
   • For location change http:// to file://, click “…”, and select the location where you want to save the .eot font file.
   • Add all of the roots you need to the List. Choose “Create font declarations with relative URLs” and “Show CSS.” Leave “Skip web font creation” unchecked. Click “Next.”
   • WEFT will process the font, saving the .eot file on your computer where specified. When this process is finished, check “Do not upload modified pages to my server.” and click “Finish.”
3. Upload the EOT file to your server
   Upload the .eot file to your server where you can reference it in your CSS. I recommend putting it in a folder called “font”.
4. Tweak your @font-face code to accommodate the EOT source
   In order to have the OET and OTF or TTF files play nicely together and load for the correct browser, you will need to slightly modify your @font-face declaration, setting the source of the EOT file for Internet Explorer (ignored by other browsers) and then hiding the other font file behind local font file declarations, which causes Internet Explorer to ignore that entire line of code:

@font-face {
font-family: display;
src: url('fonts/Fontin_Sans_B_45b. eot');
local('Fontin Sans Bold'), local('FontinSans-Bold'),
url('fonts/Fontin_Sans_B_45b. otf') format('opentype');
}

Tags: CSS, Typography by jason
No Comments »