Skip to content

Home > Articles > Web Design

Content starts

Webdesign

Web design, the art of developing for the web is something that goes beyond visual design. It is a mix of proper writing, designing and developing. The following articles feature some tips and tricks and talk about problems to avoid.

Flexible CSS Tab Navigation - 15th Januar 2006

Learn how to create a flexible tab navigation with CSS and one rounded corner background image (published at locally)

Navigation - our visitor's travel guide - 22nd September 2005

This article compares real life navigation aids to those we use on the web and invites the reader to keep web navigation as simple and helpful. (published at evolt.org)

Ten reasons why our clients don't care about accessibility - 13th September 2005

Written almost half a year ago, this article summarises the experiences I had with clients when it comes to trying to get them to make their products accessible. A debunking of overly enthusiastic Web Accessibility sales rap, so to say. (published at Digital Web)

Talking business: How I Learned to Love CSV - 25th July 2005

One of the biggest issues Web developers have to tackle is receiving content in a proper format and ensuring that the maintainers of our products will not mess around with our code too much. One way to do this is by giving those who maintain our products a file format they can handle. Here I discuss the advantages of CSV, an Excel file format. (published at devarticles.com)

Preview images with DOM, CSS and PHP - 19th July 2005

Sometimes we want to offer the visitors a preview of the image a link points to. Depending on PHP and GD availability, this script will offer a preview link showing or creating a thumbnail of the linked image. The visitors can see if the link is worth opening without leaving the current page. (published at local)

DOMSlides - yet another DOM/CSS based presentation slides system - 18th July 2005

DOMSlides turns an HTML document into presentation slides via Unobtrusive JavaScript. Readers without JavaScript will see one HTML page with content split up into headings and content. Readers with JavaScript can navigate the slides either via previous and next, the cursor up and cursor down keys ora table of contents. (published at domscripting.webstandards.org)

Complex Dynamic Lists: Your Order Please - 24th May 2005

This article describes how you can turn a nested list into a OSX styled finder navigation to help the visitor choose one item out of a complex hierarchy of items. (published at alistapart.com)

How to simulate CSS constants - 12th May 2005

One feature designers often wished they had with style sheets are constants –- the chance to define something once and reuse it over and over in the style sheet document. This article shows some techniques for how to achieve that and discusses their pros and cons. (published at devarticles.com)

Easy as A,B,C - dynamic A to Z indexes - 30th March 2005

A welcome shortcut for visitors on text-heavy websites is an A to Z index of the services offered. Much like the sitemap, it offers a fast way to find what you need on the site. An index is even more user-focused. The sitemap reflects the structure of the site – something that is only relevant to visitors when it is badly implemented in the navigation. This article describes how you can make A to Z indexes more interesting and easier to use. (published at devarticles.com)

Double Vision - giving browsers CSS they can digest - February 2005

Some but not all browsers support CSS2. You can deliberately code your website so that users of either kind of browser will see pages that are appropriate for what their browser can handle. Older browsers won't gag, but you will still be able to take advantage of what you can do with CSS2 in the newer browsers. (published at devarticles.com)

More Website Knick-Knack - October 2004

This article lists even more web site enhancements and discusses their usefulness. It ends with a list of danger signs to look out for to spot useless knick knack.Local copy of "More Web site Knick Knack" with less page clutter. (published at Devarticles.com)

Website Knick-Knack - September 2004

This article lists a lot of enhancements, that people use on web sites and discusses their usefulness. If you think your site is the cat's pyjamas, check it and you may think different. Local copy of "Web site Knick Knack" with less page clutter. (published at Devarticles.com)

Dynamic Galleries with DOM and CSS - January 2005

This article shows how to use DOM and CSS to create a fully accessible dynamic gallery that shows images without page reloads for those who can and falls back to a linked thumbnail list for all others. Local copy without ads. (published at Devarticles.com)

Standards, baby, yeah! - July 2004

Illogically called "Standards Vs. Sensible Design", this article tries to explain why following and advocating standards is great, but not enough. It needs a shift in technical use and in design to make web development a more secure and respected job. If you want to, you can also read the original "director's cut" version with all special effects. (published at Sitepoint.com)

Javascript Image Replacement - November 2003

A JavaScript-based alternative to the Fahrner Image Replacement technique using plain vanilla XHTML, with no special IDs or CSS tricks. Published on alistapart, this one caused a rather long and ugly discussion on the forum, mainly due to a misunderstanding that later on got sorted out. (published at Alistapart)

Dynamic Page Elements - Cloak and Dagger Web design - October 2004

Dynamic elements make web pages more fun, more interactive and allow us to make pages more usable - if we have CSS, Javascript and a mouse at our disposal. This article discusses some uses of dynamic page elements with accessibility and usability in mind and shows where they fail and what to do to make them better. Also make sure to check the local copy of this article for updates and less advertisements. (published at devarticles.com)

Accessible Interdependent Select Boxes - May 2003

This article explains how to mimick the funtionality of an interdependent select box in an accessible way. (published at evolt.org)

Create Pop-ups Without Dead Links - June 2004

A short article explaining how you can create popup windows with enhanced features only for those browsers and settings supporting it. Currently this article is with a wrong photo and was mildly edited, if you want to read the original proposal, you can read it here. (published at Sitepoint.com)

HTML, CSS and Tables - the beauty of Data - November 2004

This article shows you how to style tables with CSS and save a lot of trouble by sticking to the correct markup to create valid, accessible data tables. (published at devarticles.com)

Taming the select - November 2004

Originally meant for alistapart, this article show you how to safely style a select dropdown and how to create accessible selects without a go button. (published at devarticles.com)

Unobtrusive Javascript Self Training Course - October 2004

Brush up on your Javascript skills and join us in 2000 with this self training course. (published at )

Accessibility overview for designers - November 2003

This is the material used for an internal training to raise awareness about accessibility. Good for non-developers to give them an insight how development looks like from the markup point of view. (published at onlinetools.org)

How to improve web site accessibility and capture new business - Jan 2004

A presentation I held at the travel technology show in January 2004. It gives a nice overview why taking accessibility into consideration at the beginning of a development cycle can save money and time in testing later, and increase the popularity of the product. You can also see the Powerpoint slides. (published at onlinetools.org)

Javascript fallback example - February 2004

A quick example how Javascript can work for the user rather than against them. Done to show a .NET team that the inbuilt fallback functionality is not up to the task. (published at onlinetools.org)

Accessible HTML standards - Sep 2003

Markup development standards used internally to ensure accessibility of products. They are mainly a repetition of how to create valid xHTML, with some extra information of how to markup forms and tables in an accessible way. (published at onlinetools.org)

Multi column displays in CSS - April 2004

An overview of the different techniques possible to achieve multi column displays in CSS with pros and cons for each of them. (published at onlinetools.org)

CSS Standards - March 2004

CSS development standards used internally to ensure validity and maintainability of stylesheets. (published at onlinetools.org)

What does a front-end web developer do? - April 2002

An overview of all the things involved in the job of a "Front End Developer" (Interaction Designer). Created for an internal awareness program to explain what each section of the company does. (published at onlinetools.org)

Dynamic Elements - cloak and dagger web design - September 2004

Dynamic elements make web pages more fun, more interactive and allow us to make pages more usable - if we have CSS, Javascript and a mouse at our disposal. This article discusses some uses of dynamic page elements with accessibility and usability in mind and shows where they fail and what to do to make them better. You can view this article in a local version, that gets maintained more frequently. (published at Evolt.org)

Learn to let go - May 2004

Accessibility is only partly a problem of technology. It is also a mindset. This article and tool describes how you can empower your users to change your site for their needs. (published at Evolt.org)

Javascript navigation - cleaner, not meaner - February 2004

Javascript makes HTML more interactive and can increase usability. It can also mess up the markup code with loads of event handlers. Which is not at all necessary, as this example explains. (published at Evolt.org)

Clever forms with PHP - May 2003

A technique to automatically highlight mandatory form fields that were submitted empty for easy and painless form validation. The article lead to the release of the easyform script. (published at Evolt.org)

The table ruler - April 2004

A JavaScript-trick how to make a table row highlight when you hover the mouse over it. Using DOM to avoid the need for inline event calls, the HTML of the table is kept very clean. (published at Alistapart.com)

The ultimate web development tool - April 2004

What is the best tool to develop web products? Is there one that helps us create faster, more efficient and clean without costing a lot of money? Yes, there is, and you have been using it for ages (published at Evolt.org)

I am user, hear me roar - April 2004

You want them, you need them - Users. Hear from one of them what you might do wrong and what you can do to make up for that. (published at Evolt.org)

RSS Feed

Recommended books about Webdesign

Back to beginning of page

Creative Commons License All articles created by Christian Heilmann and included in this web site are licensed under the Creative Commons License unless the third party web site hosting them states otherwise.