Have you ever been stuck for where to begin with a new website? I don't know about you but there have been times where I just didn't quite know where to start whether on a site for myself, something to use in a tutorial or yes, even for a client.

So what do you do to get past that empty blank first web page?

First, I look at what the subject matter is for the site. If it is for a business I'll look to their logo assuming they have one for colors.

Then I'll look at any images the client provides or if there aren't any I'll think about the subject and go browse images at http://istockphotos.com and see if there are any images that relate to the site topic and build my design from there.

If I am still stuck I may go over to CSS Zen Garden and browse there for inspiration. I may also use Google to bring up sites from companies that are competitors to see what they have done. (Sometimes this is very instructive on what not to do ) Remember that what you see as you browse the garden or competitor's sites that the purpose is not to copy any particular site but to get ideas on what you like or don't like for the website subject matter.

Once you have an idea about how the site should look you can start from scratch OR you can start with a high quality template and modify it to suit your needs. That is one reason we offer both site templates and single page basic layouts that you can use free of charge as a jumping off point.  However, we only offer a very limited number of templates and layouts that may not suit the design you have in mind.

Pat Geary, one of the moderators here on by-expression and a current FrontPage MVP has a website with Expression Web templates as well at http://expression-web-tutorials.com/ew-templates.html Each of these Expression Web templates is css based using no tables for layout. These EW templates are written with an XHTML transitional doctype and have an external stylesheet. They are all F REE and while some are genealogy based, they are easily adapted for nay site. More genecology subject templates are available at http://www.genealogy-web-creations.com/css-layouts/index.htm

Where else can you find good free templates?

Note that these templates will not be Expression Web or Dreamweaver templates but page designs with graphics. You will have to convert the designs to a template for your editor of choice after you make whatever modifications to images, links and other bits you desire.

Make sure that you read the terms of use on for each template you may download. Some are free for non-commercial use while others may be free for use on both commercial and non-commercial sites. Others may require credit and link to the design author.

• This month (December 2008) Smashing Magazine is offering 100 free xhtml/css templates you can download directly or others simply by registering.  Some of the ones requiring registration are offered as free downloads from Template Kingdom.
• andreasviklunk.com is a site from a single person Andreas Viklunk who offers templates and WordPress themes that can be used and customize but check his copyright and terms of use notice. He provides links to sites that have used and/or modified his templates as well.
• oswd.org short for Open Source Web Design is just what it says - an open source resource of web designs. Note that the quality of each template can vary since this is an open source project.
• openwebdesign.org is another open source design site, one that hosts contests so again you get some variety in template quality.

If you know of any other template sites we should be listing let me know.

A question that comes up frequently on many of the web design groups I belong to is "What is the best font for the web?" Frequently followed by "Is it Verdana?"

My answer is NO!

I guess that makes it clear what my opinion is, doesn't it. This is why.

In my opinion it is not Verdana because while Verdana is easy to read (developed for use on the web) it is a proprietary font that is only available on Windows or Mac computers that have Microsoft Office (or other MS Mac program) installed. Years ago it was available on all Macs but then IE used to be the default browser on the Mac. The issue with using Verdana is that it has a larger x/y ratio than any of the other fonts commonly used in a font family group. So if you size your font display based on Verdana and the visitor does not have Verdana the font may well be too small. Try typing a sentence using Verdana, do a <br /> and type the same sentence in Arial directly underneath the sentence so you can compare the two fonts in length and size. You should see a noticeable difference. Here is mine, the top sentence is in Vedana while the bottom one is in Arial. I'll throw in a third in Tahoma since that is the font I typically use in a sans-serif font group, as well:

This is my Verdana and Arial comparison.
This is my Verdana and Arial comparision.
This is my Verdana and Arial comparision.

Think about how that will work for visitors who don't have Verdana available.

There really is no "one" best font for the web because it depends on the site, the size of the font, even whether or not you are using the font for heading or body text. What you should be doing is using a font family group with your preferred font first then a series of fonts that are in the same font family ending in the generic font family name. Commonly used ones are:

Tahoma, Helvetica, Arial, sans-serif
Georgia, Times, "Times New Roman", serif

Like Verdana both Tahoma and Georgia were created for use on the web. While both were also commissioned by Microsoft their x/y ratios are very close to Helvetica and Arial so there won't a significant sizing difference for visitors.

You may also have noticed that after Tahoma and Georgia I listed Helvetica and Times instead of Arial and Times New Roman. That is because those are the fonts most commonly found on the Mac and considered by many Mac users to be more readable/attractive than the generic Arial or Times New Roman. So why give them the more generic version of a font that is Mac native when you are giving those with Microsoft programs installed their native versions?

Okay, I know there aren't that many people using a Mac in the MS Expression Web forum but there are a few who are using Expression Web using Parallels, VMware Fusion or Bootcamp, and there certainly must be a fair number of Mac users in the Expression Media section since it is the only program in the suite that comes in a Mac native version but there really is no excuse for tread previewing not to work in Safari.

Like most good front-end web developers and designer I test my sites on the major browsers on both a Mac and  a PC. I'm sitting here typing on my MacBook and went to check this forum only to discover that the thread preview arrow doesn't work in Safari.

Come on Microsoft, as the company that sells one of the most popular applications for the Mac (Office for Mac) doesn't make their forum software fully Mac compatible, especially when one of the programs the forum supports is a Mac native program? Especially, when the primary selling point of Expression Web and Silverlight is that they are cross platform web standard.

While you are at it how about:

Improving the speed of the forum?

Fixing login issues, where you type a reply hit submit and get logged out (okay it is only occasionally but it should never happen.)

Add the ability to do everything in the Ajax preview/reply that you can do if you open separate threads to reply.

Fix the "notify" option so it actually notifies you to changes to the thread selected AND doesn't cause the submit button to fail 50% of the time.

Speaking of submit button failures when notify of changes is selected, why does that cause the post to appear not to post or even throw an error that says it was not submitted yet result in multiple posts of the same response?

I could go on about the problems with the Expression Web forums but I think I'll stop now beyond asking why in the world Microsoft changed the url so that it now starts with "social" http://social.expression.microsoft.com:80/Forums/en-US/web/threads/ 

When I want to be social I call friends, go out to dance, to a pub, to dinner, out for a spin on my Vespa or if I want to be social on the web I'll go over to Twitter [http://twitter.com/cdwise] or Facebook or one of the other social networks and check in with friends across the net. I won't go to a technical forum, sigh. 

 Update: after running software update on my MacBook the dropdowns are now working. I also cleared my browser cache. Worder if this is another Forum-javascript-cacke issue or if the probelm will depend on which version of Safari you are running on your Mac?

Molly tweeted about how well she did on the HTML quiz missing only two HTML4 elements. So I decided to try it the other day and ended up with 20 elements I couldn't name.

I waited a couple of days and tried it again to get:

81

So I remembered 10 more two days after looking at the list of my "missed" items. In case you are curious the ones I missed today were:

DFN, FORM, INS, ISINDEX, KBD, OPTION, SAMP, SELECT, TT, VAR

Yeah, I know I should hang my head in shame at missing <form> but I got it right along with option and select the first time. Too busy trying to remember the stuff that I never really used. Missed the first time were:

AREA, BASEFONT, BDO, BIG, DEL, DIF, DIR, INS, ISINDEX, KBD, MAP, MENU, PARAM, SAMP, SMALL, STRIKE, SUB, SUP, TT,  VAR

I will admit that there were a few I got more or less because I was typing another element such as: B, I, S and U.

Yesterday on the Microsoft Expression Web Team Blog something that reads closer to  what I consider article or possibly a tutorial on migrating from legacy code to web standards.

I am going to start by saying I do not like blogs as a publishing media for articles and tutorials from software vendors. One reason I prefer tutorials to be in articles on a section of a site is that blog entries wd off andcan be more difficult * discover. Another reason is that typically articles include more screenshots and detailed instructions.To my mind this article starts off fairly well in explaining what a doctype in and why your should use one.

From there I find the rest of the explanations to be on the sparse almost shorthand which is would be difficult to follow for someone who is truly new to web standards, secmantic monk-up and css.

Take a look and let we know if you agree with me or not.