Design
Anyone can slap up a web page, but the best sites, the "killer" sites require a lot of thought, planning, and up-front design.
|
- Web Wonk
- Dave Siegel's tips for writers and designers
http://www.dsiegel.com/tips/
- Sevloid Guide to Web Design
- an outstanding guide for any web developer
http://www.sev.com.au/webzone/design.asp
- Yale C/AIM WWW Style Manual
- one of the absolute best design resources
http://info.med.yale.edu/caim/manual/
- Guide to Web Style
- from Sun Microsystems
http://www.sun.com/styleguide/
- Process + Practices
- Vivid Studios designs web sites for major business/entertainment enterprises, and here they share their design process and philosophy.
http://www.vivid.com/practices/
- glassdog Web Design
- This high end designed site (many features of generation 4.0 browsers) features a wealth of valuable tips on web design.
http://glassdog.com/design-o-rama/
- Neon Design Tips
- a collection of tips written by Dave Kristula
http://www.neonlollipops.com/design/
- The Seven C's of WebService Design
- The University of Georiga provides a concise set of guidelines (with linked examples) that can be used for any orgranization's web site. The Seven C's include Comprehensiveness, Currentness, Client-Orientation, Clarity over Coolness, Courtesy over Coolness, Compatibility without Compromise, and Cross-Linking and Validation.
http://www.uga.edu/design/
- Information Design Tutorial
- "is an introduction to the basics of page layout and site design. It assumes that you already have a basic knowledge of HTML... The aim is to look at various ways to transform raw text material into an attractive presentation that uses some of the real potential of the Web as a medium."
http://www.accessone.com/~jdwest/infodesign/index.html
- Web Page Design for Designers
- "is aimed at people who are already involved with design and typography for conventional print and want to explore the possibilities of this new electronic medium."
http://www.wpdfd.com/
- Elements of Web Design
- The folks from c|net guide you through the process of designing a Web site.
http://builder.cnet.com/Graphics/Design/
- Valerie Casey's Web Design Tutorial
- Instructor and professional developer Valerie Casey writes this in depth guide to web and information design
http://www.valcasey.com/webdesign/
|
HTML
Here are some of our favorite indispensible guides that are either high quality references or greate tutorials (other than our own!
|
- HTML Goodies
- a giant collection of tutorials, resources, and even graphics for web developers
http://www.htmlgoodies.com/
- Bare Bones Guide to HTML
- Kevin Werbach's extremely useful "cheat sheet"
http://werbach.com/barebones/
- Browser Campatability Chart
- from WebReview, shows you what tags are supported on different web browsers/versions
http://webreview.com/pub/1999/10/29/feature/index3b.html
- Compendium of HTML Elements
- is a reference manual of all HTML tags in general use.
http://www.htmlcompendium.org/
- HTML An Interactive Tutorial for Beginners
- Teenager Dave Kristula wrote this hands-on tutorial that allows you to learn and experiment with HTML all inside the comfort of your web browser
http://www.davesite.com/webstation/html/
- Sizzling HTML Jalfrezi
- gives examples for every HTML element and attribute including new Netscape and Microsoft extensions
http://vzone.virgin.net/sizzling.jalfrezi/
- Dr. HTML
- is a tool that can diagnose problems on any web page
http://www2.imagiware.com/RxHTML/
- webmonkey
- a tutorial using the "Monkey See, Monkey Do" approach
http://www.hotwired.com/webmonkey/teachingtool/
- ZDNet's Tag Library
- features a summary of HTML history and a tag by tag description
http://www.zdnet.com/devhead/resources/tag_library/
|
Tables
The unseen layout for many web sites, but perhaps soon to be displaced by Style Sheets. |
- HTML Tables
- from the Web Developers Virtual Library
http://wdvl.com/Authoring/HTML/Tables/
- Killer Tables
- This is part of the fantastic book Creating Killer Web Sites" and web site by Dave Siegel, in which he illustrates the use of tables to layout your web pages. We were heavily influenced by this work!
http://www.killersites.com/tutorial/
- Table Tutor
- a step-by-step guide from Joe Barta
http://junior.apk.net/~jbarta/tutor/tables/index.html
|
Forms & CGI
Web pages can be beautiful, but what people really like are interactive sites. CGI requires access to and knowledge of programming languages that run from a web server, and are a level or two above page formatting.
|
- CGI101
- offers a free online class in CGI programming written by Jacqueline Hamilton. "This class is intended for anyone who knows HTML, but doesn't know Perl or CGI programming (and maybe doesn't know any programming at all). The goal here is to introduce you to writing Perl CGI scripts, teach you the basics of writing CGI's, and walk you through several examples of common CGI programming applications for the Web." The site also features a library of free scripts and links to other related sites.
http://www.cgi101.com/
- CGI Programming with Perl
- Through a series of articles in WebReview, Brent Michalski takes you from the very basics to more advanced concepts of writing Perl scripts to run CGI programs
http://webreview.com/wr/pub/98/06/12/perl/index.html
- CGI for the Total Non-Programmer
- walks you through the basics of creating CGIs with Perl on a Unix platform and does not assume you know anything about CGIs, Perl, or Unix.
http://www.webteacher.com/perltour/index.htm
- Form Tutor
- a step-by-step guide from Joe Barta
http://junior.apk.net/~jbarta/tutor/forms/index.html
- Web Diner Forms Tutorial
- covers the basics of formatting and using forms that email the form data rather than running through a CGI server (useful for web hosting sites like AOL that do not allow CGIs)
http://www.webdiner.com/annexe/forms/wdform1.htm
- Programming with HTML Forms
- WebReference provides this tutorial with examples, written by Andrew Davison.
http://www.webreference.com/htmlform/
- The Perl Language Home Page
- One of the most widely used server programming langauges
http://www.perl.com/perl/
- The Common Gateway Interface (CGI)
- a technical explanation from NCSA (you know, the folks that gave birth to Mosaic)
http://hoohoo.ncsa.uiuc.edu/cgi/
- Speakeasy CGI Resources
- Sanford Morton's tutorials, discussions and working CGI scripts. The emphasis here is on explanation, so most of the scripts are discussed in some detail. Most are usable in production.
http://www.speakeasy.org/~cgires/
|
Frames
Controversial and often un-necessarily used, frames can provide a better navigational structure to your site.
|
- Sharkey's Netscape Frames Tutorial
- by Charlton Douglas Rose
http://www.newbie.net/sharky/frames/
- Framing the Web
- by Dab Brown
http://webreference.com/dev/frames/
- Net Assist for Frames
- from Netscape's site
http://home.netscape.com/assist/net_sites/frames.html
- Frames Tutor
- a step-by-step guide from Joe Barta
http://junior.apk.net/~jbarta/tutor/frames/index.html
|
Graphics
We like the web because it is more than text. Duh. But using graphics wisely and at a low cost to the viewer is a high form of magic and art.
|
- GIF Animation on the WWW
- by Royal E. Frazier
http://member.aol.com/royalef/gifabout.htm
- get animated!
- Cecilia Farell wrote this c}net guide for how to create GIF animations.
http://cnet.com/Content/Features/Howto/Webanim/index.html
- Animated GIF Recipe
- a WebReview article by Richard Koman
http://webreview.com/96/03/29/tag/index.html
- CoolText Online Graphics Generator
- "is a totally free online service which provides real-time generation of graphics customized
exactly the way you want them."
http://www.cooltext.com/
- "In Design School They Promised No Math"
- a Web Review article by Bob Schmitt
http://webreview.com/96/03/15/tag/index.html
- The Browser Safe Color Palette
- by Lynda Weinman, author of Designing Web Graphics without a doubt the best book on the subject.
http://www.lynda.com/hex.html
- Optimizing Web Graphics
- WebReference.com provides a comprehensive overview to help you shrink the file size of images
http://webreference.com/dev/graphics/
- Consistent Color on ALL browsers -- 10 easy steps
- a Netscape World article by Geoff Baysinger
http://www.netscapeworld.com/common/nw.color.html
- Bandwidth Conservation Society
- "a resource for web developers with an interest in optimizing performance, but still maintaining an appropriate graphic standard."
http://www.infohiway.com/faster/
|
JavaScript
Although above we suggested the limitations of CGI for interactivity, JavaScript is text you can insert into your HTML that provides interactivity without requiring access to a server. It still looks like ugly computer code!
|
- Website Abstraction's Ultimate JavaScript Tutorial
- an extremely comprehensive tutorial and collection of resources
http://www.wsabstract.com/
- JavaScript Cut n' Paste
- free collection of ready-to-go scripts
http://www.infohiway.com/javascript/
- Beginning JavaScript Tutorials
- a set of brief examples from The Web Design Resource
http://www.pageresource.com/jscript/
- Introduction to JavaScript
- by Stefan Koch
http://rummelplatz.uni-mannheim.de/~skoch/js/script.htm
- JavaScript for Beginners
- a well-written guide from the folks at c|net
http://builder.cnet.com/Programming/Javascript/
- JavaScript for the Total Non-Programmer
- the title says it all
http://www.webteacher.com/javatour/
- Doc JavaScript
- a bi-weekly column with helpful examples, from webreference.com
http://www.webreference.com/js/
- Sharky's JavaScript Answers
- is a collection of tutorials covering common JavaScript programming challenges, ranging
from image rollovers and scrolling text to access control and cookies.
http://sharkysoft.com/tutorials/jsa/
- Thau's JavaScript Tutorial
- is neatly organized guide from webmonkey
http://www.hotwired.com/webmonkey/98/03/index0a.html
- WebMonkey Guide to Javascript
- gets you started with basic JavaScript creation
http://www.hotwired.com/webmonkey/guides/web/javascript.html
|
Java
All the hype and promise? Java is a programming language that allows you to include plug-in free interactive "applets" as part of your web pages.
|
- CNET JavaCenter
- features several guides and tutorials for learning Java
http://www.builder.com/Programming/JavaCenter/
- KneeDeep in Java
- by Stefan Koch
http://rummelplatz.uni-mannheim.de/~skoch/javatut/kneedeep.htm
- HTMLGoodies Java Applet Tutorial
- a friendly way to dip your fingers into the cup of Java
http://www.htmlgoodies.com/beyond/ja.html
- IBM Java Education
- Big Blue offers free online courses, including "Introduction to Java" and
"Building a Java Applet"
http://www.ibm.com/java/education/intro/courseoptions.htm
- JunkMachine
- a free service that allows you to easily create your own
Java applets, and no knowledge of Java programming is required.
The JunkMachine will generate HTML code that you can simply cut and
paste onto your site.
http://www.robtex.com/jm/jm.htm
- Gamelan
- is one of the best known repository of Java applets and information
http://www.gamelan.com/
- The Java Tutorial
- from Sun, the folks that started the craze
http://java.sun.com/docs/books/tutorial/index.html
- Shlurrrpp......Java
- "The first user-friendly tutorial on Java" by Vijay Mukhi
http://www.neca.com/~vmis/java.html
|
Dynamic HTML
What can you do by combining JavaScript and a 4.0 version browser? Animated and interactive web pages.
|
- Beginner's Guide to DHTML
- David Gardner makes it understandable
http://www.geocities.com/ResearchTriangle/Facility/4490/
- Taylor's Dynamic HTML Tutorial
- another well-done guide from webmonkey
http://www.hotwired.com/webmonkey/98/10/index0a.html
- Dynamic HTML Lab
- sample and inspiring demos from webreference.com
http://www.webreference.com/dhtml/
- Jeff Rule's Dynamic HTML and SMIL Site
- author of the book Dynamic HTML: The HTML Developer's Guide shares resources and demos to learn more about DHTML
http://www.ruleweb.com/dhtml/
- ProjectCool Developer's Zone
- presents an indepth tutorial of DHTML
http://www.projectcool.com/developer/dynamic/
- Dynamic HTML Zone
- from Macromedia, creators of Dreamweaver software for creating DHTML sites.
http://www.dhtmlzone.com/
- WebCoder.com
- a mega resource for both JavaScript and DHTML
http://www.webcoder.com/
|
CSS
Cascading Style Sheets (CSS) is the likely future trend for creating web pages; supported presently by version 4.0 and later web browsers, it makes it easier to re-format content by separating content from formatting. However, it changes the way we have been using HTML up to now and, CSS is not exactly supported equally across the different browsers.
|
- CNET Builder.com
- has a guide for getting Started with Cascading Style Sheets
http://builder.cnet.com/Authoring/CSS/
- D.J. Quad;s Ultimate HTML Site
- features among many other resources, a CSS tutorial.
http://www.quadzilla.com/
- House of Style
- a well-designed overview of CSS featuring an easy to understand tutorial and a guide to browser support
http://www.westciv.com/style_master/house/
- The Human Factor
- WebReference.com provides this overview of the power of CSS to separate form from content.
http://www.webreference.com/html/tutorial5/
- Index dot CSS
- Brian Wilson's comprehensive reference guide to CSS
http://www.blooberry.com/indexdot/css/
- Guide to Cascading Style Sheets
- from the Web Design Group, features references and a quick tutorial
http://www.htmlhelp.com/reference/css/
- Web Developers Virtual Library
- includes useful information and tutorials
http://wdvl.com/Authoring/Style/Sheets/
|