Recently in Web Design Category

Oh yeah, by the way, this is a so-called heavy checkmark:

✔

Also known as:

✔

What the heck are microformats?

I never figured that the solution would be so easy. Those bothersome question marks within black diamonds that were appearing occasionally on some of my older blog entries were driving me nuts.

All that I had to do was change the following:

<meta http-equiv="Content-Type" content="text/html;
   charset=utf-8" />

into this:

<meta http-equiv="Content-Type" content="text/html;
   charset=iso-8859-1" />

See the difference? Perhaps this is not the most elegant way to fix this, not internationally compatible with every known character set on the planet, but it works.

The proper use of colors is an important if not vital aspect in bringing your web site to life in just the right way.

Natural Selections: Colors Found in Nature and Interface Design is an interesting article describing this.

Perhaps this could be a challenging area in which to develop my expertise.

Is the ability to use the right combination of colors a scientific activity, something inherent in human being, instinctive behavior, or (hopefully) for me, an art that one can learn through diligent study?

You never would have known it had I not told you, right? Guess what then?

The new-and-improved version of SwishMax is finally out!

I just happened to discover this at random today, and I had to purchase and download it right away. Looks really cool.

I can recommend very highly to anyone who like me gets easily lost into these kind of technical gadget web design thingies.

The use of hand-held devices like the Palm Pilot, screen readers, web-enabled cell phones and other text-mode browsers for the disabled is increasing drastically. Therefore, it is very important that your information remains accessible to this group of potential customers.

How does your web site deal with this? Does it degrade gracefully? Are you inadvertently denying the blind and the disabled?

To find out, just enter a URL in the entry field and click the submit button.

URL:

I added this utility on the GishTeq website the other day and am fairly pleased with how it is working. Check it out for yourself.

If you are really into ASP and want to learn more about Data Grids, Selecting DataRows in Data Grids, DataView Control, Database updates using the DataAdapter and Databinding in Dropdown Lists AND you can understand Dutch (sorry about that), then you will certainly be very in this interesting video training:

Instructie video's over het programmeren van webformulieren in ASP.NET

Reminds me an awful lot about the good old days when I was an expert Visual Basic programmer, alot still looks the same.

Great stuff Sjef!

If you too are into the power of Cascading Style Sheets (CSS) as much as I am, then you will really appreciate this little gem I happened to discover. At least, if you are as much of a die-hard Internet design geek as I am.

Have a good close look at the following so-called images:

So what do you think, I mean are you impressed? If you thought they are really images, then you were wrong. Sorry about that, but the figures above were purely generated not using embedded images but good old plain-vanilla CSS instead. Hard to believe but true.

Impressed? Well you shouldn't be, because they were merely built using slants. Here is how you can also use slants to make your web site even more amazing..

Place the following style declaration somewhere in the header section:

<style type="text/css">
.s1 {
  border-color:yellow green blue red;
  line-height:0px;
  width:0px;
  height:0px;
  border-style:solid;
}
</style>

And then, place the following code where you want the figures to appear:

<div class="s1" style="margin:10px;float:left;border-width:25px;"></div>
<div class="s1" style="margin:10px;float:left;border-width:19px 25px 31px;"></div>
<div class="s1" style="margin:10px;float:left;border-width:12px 25px 38px;"></div>
<div class="s1" style="margin:10px;float:left;border-width:6px 25px 43px;"></div>
<div class="s1" style="margin:10px;float:left;border-width:0px 25px 50px;"></div>

(Find out more about slants.)

It is even possible to create a heart made of CSS by using slant technology.

Here's to the power of CSS and the infinite possibilities.

Yesterday afternoon a box from Amazon arrived, and it was my long awaited for copy of Designing with Web Standards by Jeffrey Zeldman. Right now I am just sawing through the book and absorbing everything I can. Highly recommended for anyone wanting to know more about using web standards in a world lacking structure and common sense.

What he says makes perfect sense. By designing and implementing web sites using a standard and structured way, one can work cost-effectively and more efficiently, and enjoy it all at the same time.

Unfortunately, due to a number of factors (like the mad race a few years back to get as much as possible as much as quickly on the Internet -- thanks to the good old blinded greediness called commercialism), this has not happened.

The ironic thing is that it makes sense in a logical way, but who cares? Try to sell quality and usability to your average manager and he will more than likely scoff and spit in your face.

That is why this book offers a convincing set of arguments to help visionaries like myself get things going like they were always meant to be. And make money at the same time.

Here are a number of other sites you might be interested in:

• A List Apart


• The Web Standards Project


• Zeldman Website


• Web Page Design for Designers

Here's something clever I thought up the other day and decided to use on my new GishTeq website to spruce things up some.

What it does is generate a bulleted list of all the web pages as links in alphabetical order according to the title. Just add the EXEC-include (SSI) statement wherever and load it up for the surprise.

#!/usr/bin/perl -wT # # sitemap.pl #    Print a web site map as a bullet-list. Pages #    are listed alphabetically as links. # #    Copyright (c) GishTeq 2002-2003. #    All rights reserved. # #  URL:    http://www.gishteq.com #  E-mail: info@gishteq.com # use strict; use HTML::TokeParser; my @allfiles; my $ff; # This is the complete CGI-path to the directory. my $pathdir = "/home/users/kiffin-the-gish/public_html"; # This is the HTTP-path to the directory. my $htmlpath = "http://www.gishteq.com"; print "Content-type: text/html\n\n"; opendir(DX, $pathdir) or die "error: $!"; @allfiles = grep { $_ ne '.' and $_ ne '..' and ($_ =~ /\.html$/i) } readdir DX; closedir DX; my %map; foreach $ff (@allfiles) {   my $file = $pathdir . "/" . $ff;   my $p = HTML::TokeParser->new(shift||$file);   my $title = $ff; # Just in case.   # Try and extract the title, if possible.   if ($p->get_tag("title")) { $title = $p->get_trimmed_text; }   # In order for this to work, all titles must be unique!   $map{$title} = $ff; } print "<ul>\n"; for $ff (sort keys %map) # Sort by title. {   my $fname = $map{$ff};   # Alright, let's print 'em out.   print "<li><a href=\"$htmlpath/$fname\" title=\"Go to $fname\">$ff</a></li>\n"; } print "</ul>\n";

An example of it in action can be seen at the GishTeq sitemap page. Hope you like it. Feel free to use it as you see fit.