1. Apr 20

    Designing with Typography

    I am currently working on a project which for political reasons will not be using a lot of illustrations. The reason is that illustrations tend to communicate particular norms and values, as well as being open for ambigous interpretations. For a website on a complex and politically sensitive topic, which does not want to be perceived to express any partisan views, it may be smart to stay away from non-abstract graphics which can be interpreded to carry meaning that was not intended.

    So, based on these restrictions I am looking at using typography to make the website interesting and pleasing to the eye.

    Finding the right Font

    There are several nice tools online that helps you find and compare font types. Here are some of the ones I like.

    flippingtypical lets you easily view and brows through the fonts you already have installed on your computer.

    fontbrowser lets you brows through and preview a long list of font types

    fontsquirrel and dafont are great places to download free fonts

    Manipulating Typography with CSS

    When you think of it there are surprisingly many aspects to typography that can be manipulated with CSS. Speckyboy.com has more information regarding CSS web safe fonts and font sizes in different measurement units. There are several tools available online for you to play around with these CSS settings. Below are some nice ones:

    typechart provides charts and downloadable CSS for web safe fonts combined with various CSS font settings

    fonttester lets you define several typographies, view them, and compare them side by side, and download the CSS

    Manipulating Typography by Dynamic Image Replacement

    If the CSS options for manipulating typography are too restrictive for your project there are several ways of using Javascript, Flash, or PHP to dynamically replace text in headers etc. with images depicting fancier fonts.

    I will get back to this more in detail in a later article. Now I have to work on my typography website design :)

    Expanding Font Options by Including Fonts on the Server Side

    Instead of using techniques generating images to replace fonts, as mentioned above,  you can use typeface.js and write in plain HTML and CSS, just as if your visitors had the font installed locally.

    Share/Save


  2. Nov 01

    JavaScript Frameworks and Ajax Libraries

    Ajax (Asynchronous JavaScript and XML) has given us increased user interface responsiveness and rich interaction used in faster and more user friendly web applications.

    There are an increasing number of JavaScript Frameworks to choose between. Prototype, jQuery, MooTools, Dojo, YUI, and Script.aculo.us are some of the more popular ones.

    Below is a comparison of some the features offered by some of these frameworks, courtesy of Danny Douglas

    There is a more detailed comparison of more frameworks in Wikipedia.

    Click to continue reading “JavaScript Frameworks and Ajax Libraries”

    Share/Save


  3. Oct 25

    Stylesheet Management

    Organization and separation of distinctly different aspects of a web application or website is good code manners and dramatically eases maintenance and adding changes. In application development MVC frameworks separates models, views and controllers. And in web development you separate functionality from visuals by using Cascading Style Sheets.

    In an article on Progressive Enhancement with CSS Aaron Gustafson at A List Apart discusses the separation and organization of stylesheets. Below is his suggested basic model which separates type, color, and layout from each other, and deals with the various types of media type layouts a website may be viewed in.

    The article also discusses how to deal with oddball browsers like N4, IE6, and IE7.

    Share/Save