Tag: Design

Web Fonts

For the most part, font selection for the Web is limited. There are only a select few fonts that are available on all platforms, and even when we say cross-platform fonts, we really mean just Macintosh and Windows. We forget all about Linux, other desktop operating systems, and portable systems as well. Personally I tend to reach for Verdana, Georgia, Trebuchet MS, and Lucida Sans. Verdana is probably the best choice for web fonts and more preferred than Arial. I like to replace Times with Georgia as well, as Georgia looks cleaner and more distinct to me than any of the Times fonts. For medium to large headings Trebuchet MS and Lucida Sans are more appealing, than Verdana.

To learn more about type for the web, read Joe Gillespie’s All You Wanted To Know About Web Type. This article from Web Page Design For Designers is still a must read for web page design.

Once you know which fonts to use, you need to know what CSS can do for you. Garrett Dimon’s CSS Typography mentions some concepts to keep in mind when styling fonts. The most important idea to grasp being that white space and headings make web pages easier to read.

Filed under: CSSTagged with: , , , ,

Web Design Computers

This week I had to sit down and take care of my tax filing for the year and one of the things that I put down is my computer. I sit in front of computers all day long, that at this point, they are like my car. I hardly can see myself living without one. But what I really started thinking about was what would be the best computer for web design, since WebKeyDesign is now a huge part of my life.

MacOS Versus Windows

Without a doubt I am a huge Macintosh proponent. I absolutely love my 15 inch Powerbook and think it is the best computer I have ever used. However not everyone is the same and not everyone wants to make such a big investment. If you are really serious about web design, I am going to recommend that you have both a Macintosh and a Windows PC. If you can swing it, you might also consider a home test server with Linux + Apache + MySQL + PHP setup. The linux server will be great to test out new projects before you actually implement them on your hosting server.

For most web design, if you absolutely are going to have one computer, I would recommend a Macintosh. The Powerbook or iBook will give you portability and the ability to do graphics work as well. If most of your web design is code based though, like PHP, Perl, or any other scripting language, I would probably choose a standard PC laptop like a Leveno Thinkpad. Although there are great text editors on the OS X platform, your options on Windows are more and more varied. Portability aside, you could probably do well with a nice desktop. Whatever you decide, make sure your main computer has a large monitor size. Something higher than 1024 is a must for today’s web work.

A Windows PC is what I use to check sites once they are up and running. Even though by now IE 6 is the most hated browser, you still need to check your site on it. There are tons of small utilities that are available on Windows that you can use for web design and maintenance. Yes, I know many of these apps really are bad, but sometimes you find a few that are worth using Windows for.

The Portable Web Server

MacOS X has Apache server already included, but you may find that messing up your main computer is not worth the trouble. If you already have the Windows computer, then you can also use that to run a test setup of Apache. My personal favorite is EasyPHP, which runs as a private server on Windows, only accessible to the local machine user. This is a great way of testing your site’s files before uploading them to your hosting account. If you have a third machine, you could probably run full blown Linux with Apache and have your own web server for testing.

Filed under: WebKeyDesignTagged with: , , , , , , , , ,

Inline Quotations

Short inline quotations can actually be incorporated into your html via the q tag. This allows you to skip the actual quotations marks.

Steve Jobs told us, 
<q> lang="en-us">design is not just what it looks like and feels like, design is how it works.</q>

Note that it is also a good idea to add the lang attribute when using q elements.

You can use the lang attribute other tags such as the paragraph tag, if for example you had one paragraph in a different language than your document.

Filed under: XHTMLTagged with: , , , , , , ,