Web Design CSS Bookmarking List Summer 2008

This article will help you convert your website designed in photoshop to a real css layout. For many people like myself who can't draw for their lives, I like to use photoshop and similar programs to plot out how I want things to look first. It is usually hard to translate my ideas onto paper, and even harder to translate the paper to a webpage. For those of you with troubles like these, rest them aside.

I have been looking everywhere for a site that gives a code for pop up menu tabs instead of ones that drop down. I finally found this code, but the only problem is that it itns't cross-browser. Hopefully I will be able to find one that is. But for now, I'm going to use it in my site!

On our CSS Zen Garden Sheet the transparent URL comes up repeatedly . This page gives several descriptions about what it is. Apparently, it controls background color. Which in this case, is transparent.

This is a good code to know for the future. HR means Horizontal Rule. You can use these dividers anywhere on your site to divide content. It is similar in style to the banners I bookmarked previously. However, I don't think they can be used as dividers between content, but if they can I'm sure you need to know what HR means.

So you want rounded instead of sharp corners? This trick should help you with that. I'm looking for ways to make my page look smoother and more polished, so I think this should help. I'm trying to use this trick for my Zen Garden CSS page.

I plan on using a transparent image on my page and this explains how to do it.

I was trying to do this yesterday, filling in a layer section with an already existing background color

Here is a pretty interesting way to set up your menu. It's busy but unique. There is a lot of flexibity to display a variety of fonts and colors.

A simple concept that is easy to include in the CSS. Make your text more easily readable by indenting the the first line of text in subsequent paragraphs.

Scroll down to read CSS codes for different font tricks.

This is an interesting way to add a fun contact sheet to your webpage. I havent tried the code yet to see if it works but the site provides everything to build your own. I would like to add something like this to my site.

All about fonts and CSS. If you have any friends how are graphic artists, then you know that fonts are a big deal to them. They somehow many to become addicted to fonts...

This list-o-matic website, used ironically enough, to create lists on your webpages, is exceptionally useful, if you haven't used it yet. It is found on the accessify.com site, and you can copy/paste the url at the top of this window. I may be using it for my page.

By now, most of us can reasonably use many basic functions of html and css. This function, allowing the designer to adjust the margin size, may be helpful. I will be using it on my site..

Here you can choose any colors you want. Or you can have the website choose random colors for you! You can make a ribbon/band of color (s) for anywhere on your page. Use it as a separator/divider or a band at the top of your page for some extra decoration. Very cool for adding extra UMPH to your site! (involves relative linking).

Tutorial for laying out inline list items

This page is linked from Jakob Nielsen's website. Nielsen is an expert on Web Usability. He has much to say about what works in a website, and what does not. His book, Prioritizing Web Usability, though pricey, is worth it for anyone interested in making their site more usable. I plan on using Neilen's suggestions for my own work.

Designer's blog discussing using type to design, Good examples. Some of the links take reader to other related areas

This article, on the smashing magazine website, shows some cool tricks for working with transparency in CSS. While I am having all sorts of trouble with my CSS page, I am expecting to use these or similar tricks on my page. I recommend checking it out if you need help with transparency