Font Squirrel’s @Font-Face Generator

@font-face was CSS’s original answer to the web-font question, but due to poor browser support and confusing implementation methods, it hasn’t yet taken off.  Font Squirrel’s generator, on the other hand, combines the @font-face declaration and uses a combination of javascript and CSS hacks to make it work in old, incompatible, and obscure browsers.

http://www.fontsquirrel.com/fontface/generator

Typekit – A commercial approach

Typekit takes a new approach to web-fonts.  One of the forgotten (yet increasingly important) aspects of the web-font issue is the licensing.  With most solutions, designers use fonts online without thinking about licensing.  Typekit does all of that for you – at a cost.

Typekit is the first commercial model which hosts web fonts as a service.  Integration into your pages is supposed to be very easy and seamless.

http://typekit.com/

There are a few easy steps you can take to make sure your photos are appropriate for the web.

Consider where your photos are going

Most photos on the web are places in a gallery of some sort.  Galleries, particularly on the web, tend to be in a “wide” format.  This means that they are designed to hold “landscape” style photographs, rather than tall, “portrait” style photos.  By taking your pictures with this in mind, you can improve the look of the gallery by making your images consistent.

If your photos are for a certain area of your website, keep the shape of that area in mind!

Watch the background!

When taking photos to display publicly on the internet, be sure to remove all unrelated items or clutter from the background of the shot.  This will not only improve your photo aesthetically, but it will appear more professional and more thought out.

Do not scale or edit photos beforehand

Unless you are a professional photographer or have other interests in mind, leave that part to your web company.

Always turn off time stamps!

“Time stamps” are small text overlays on your photo that display the date and time that the photo was taken.  While these can be useful, they can potentially destroy a photo, as it cannot be removed once the photo has been taken!  Be sure to make sure your camera does not have time-stamping enabled.

Check out more tips

We have several more tips on photography that you can use in tandem with the advice in this article.  Check out more photography tips  from Pro Web Marketing!

5.) Avoid Unnecessary Whitespace

Your XHTML should not contain any blank lines.  They increase file size, create more junk  for spiders to sift through, and can cause serious headaches for developers.  Avoid spaces at the end of your lines as well.

4.) Use proper indentation (nesting)

Using proper nesting can make a huge difference in your code’s organization, and can even make the coding process easier.

3.) Comment your code

Commenting your code might seem unnecessary, as to you, it is most likely self-explanatory.  The aim of code readability, however, is for your code to be easy to navigate for other people.  Be sure to create short comments in your code that indicate function.  You may wish to leave these out in the production version of your code, as they do increase file size.

2.) Always use proper casing

In XHTML, all tags should be lowercase.  In CSS, there is no declared casing syntax, but a naming convention should be followed consistently.  I prefer to use camel case.  A class name, for example, might be .sampleClass.

1.) Separate presentation from content

Your XHTML documents should be very small!  If you can avoid using an extra tag in your XHTML document, please do.  Use CSS and Javascript to their full potentials, and always use external scripting and styles.  This is extremely important for search engine optimization.