Scripting and Advanced Web Authoring

Lawrence Hall

CSS Resources |
Inspiration

Overview

This page is a set of tools that can be used to help both intermediate and beginning web designers speed up some of the leg work involved in building web pages. The tools listed are mostly code generators, but some of the sites they originate from contain a wealth of other information, including color theory, code validation, and dynamic scripting tools. This page also contains links to sources of inspiration for designs, as well as some glimpses of what can truly be accomplished in web design.

CSS Resources

CSS Creator

The CSS Creator contains an active set of forums frequented by web developers discussing current issues in coding for the Internet. The main reason I have included it here is that it contains a CSS generator. The generator does not provide any in depth CSS functions, but it can provide a quick jump-start to building a basic web page.

Webmaster Toolkit

Webmaster Tool-Kit includes many tools that webmasters can use to speed up daily tasks. For the professional writing major there are two useful tools: the Dreamweaver Code Cleaner, which will remove unneeded code from a Dreamweaver designed page, and the CSS Menu Generator, which creates navigation for web pages quickly. The Generator will allow you to name the navigation links and URL’s, then it will generate the necessary CSS for you to cut and paste.

Format CSS

The format CSS tool is handy for going back through CSS to make sure it is structured in an easy-to-use way. This can be used if someone’s CSS is done differently from what you are used to, or if you may run into a case where the CSS was formatted poorly. This tool will allow you to paste the CSS into the page and get a clean formatted sheet to work from.

Accessify

The tools and wizards section of Accessify.com contains several tools to help develop common web elements such as pop up forms, tables, and lists. The site will generate the code for you so that it is compliant with 508 accessibility issues. The List-O-Matic is the biggest time saver within the tools section of this page.

Layout - O - Matic

The Layout - O - Matic is a convenient tool that can help you get started on a web page. Instead of using someone's open source design and reworking it from the ground up to suit your needs, this will give you a very basic page. You can select the number of columns, page width and padding. The CSS for this basic design is then generated for you to download and use for your own purposes.

Max Design

The Max Design site contains a large body of tutorials for beginners and experts in CSS. Within the site are a few different scripts to develop two different types of lists: simple and nested. Additionally, there are tutorials dealing with how to make your own list while working with the float command, as well as a tutorial about using selectors. There are also design submissions from web authors, and the option to submit work of your own.

Dynamic Drive

The Dynamic Drive is a site that contains a large amount of user submitted scripts. The main portion of the site has scripts for working mostly in java and dhtml to create dynamic content, such as calendars, animation, and dynamic frame content. It also has a large library full of free CSS code to work with.

Inspiration

StyleBoost

Styleboost is an inspirational site dressed as a blog. The content is updated nearly everyday with highly stylish sites. It is navigated by using tags that are labeled for each posting.

Piepmatzel

Piepmatzel.de is simply a collection of web designs that follow the best-accepted practices. It is most useful for getting some general ideas on layouts.

CSS Edge

The CSS edge is a nice collection of experiments by Eric Meyer to show how far CSS can really be taken.

Top