Creating web pages is a lot of fun. You have come to the right place to find excellent tutorials, resources and tools to help you get started or to learn more about a specific task or area of web design. I enjoy sharing this collection of resources to design, create and maintain web pages as there is always something new to learn. Find basic tips and reminders in the Friends & stuff section. Master the basics of HTML 3.2 and find additional HTML 4 and Cascading Style Sheet references in the "MORE" Resources section. Type annesworld.info to come back. The original mirror site at http://www.wwnet.net/~ahartman is no longer available as of February 2006.
Browser Grid from WPDFD, important to know when designing pages for different monitor resolutions! (L-5)
Browser Incompatibilities Web Page Design for Designers - Editorial September 1998 discusses importance of testing your pages on other computers and browsers. (L-5)
Browser History timeline Releases important to HTML and CSS development; now through IE 5 and Netscape 7 for CSS1 and CSS2 (L-6) (H3)
Changes between HTML 3.2 and HTML 4.0 W3C. Older browsers do not support 4.0 and the newer ones interpret it with varying results so it may be safer to stick with 3.2 while gaining knowledge of 4.0 (L-6)
HTML 4 for the World Wide Web: Visual QuickStart Guide by Elizabeth Castro 4th edition, includes HTML 3.2. All example files from the book, class recommended reading reference. (L-1)
HTML 4.01 Reference Nice free basic and advanced web building tutorials here with Try-It-Yourself On-Line Examples (H2 )
DevGuru XHTML Coding Rules and Syntax for this latest version all attributes, events, and tags must be written in lower case; all elements must be closed; the value assigned to an attribute must be enclosed in quotes.
HTML XHTML CSS Book Examples from HTML for the World Wide Web: Visual QuickStart Guide, Fifth Edition with XHTML and CSS by Elizabeth Castro. (L-1)
HTML Clinic Nice step-by-step tutorials with examples. (L-1)
HTML Help by the Web Design Group BBS to answer questions and a lot of information to create accessible sites regardless of browser, platform, or settings. (L-1)
HTML Home Page at W3C explains different versions and latest changes. (L-6)
HTML PitStop pageresource.com great tutorial to get started and put your page on the web. Includes advanced too. (L-1)
Otter's Place For FAQs Easy to follow tutorials for HTML, Web Design and Graphics written by VU Instructors and students. (L-1)
Screen Ruler wonderful JR free tool to measure graphics, web page browser sizes or design elements in pixels, inches or centimeters as you work. Launch from Windows shortcut on desktop. (L-3)
Table Tutor my favorite, easy to follow by Barta. Must join to get complete tutorials - well worth the price, even better with discount and special offer available right now. (L-4)
Tablemaker! Fill in the blanks & make a table here. (L-4)
Tables: Design assistance for organizing data and highlighting information. (L-4) 4/2006 not display
Color Theory Overview at worqx.com Wow, thanks KOT for telling me about this wonderful tutorial!
About Color/Calla's Spot is no longer online. Computer primary colors are red. blue and green rather than the traditional red, blue and yellow artist's color. Secondary or complimentary colors are cyan, magenta and yellow instead of purple, orange and green. 7/04 not found Rick Sterling's explanation of artist pigment and scientific light frequencies and color wheels. 7/04 not found
BrowserSafeColors table by dotParagon to more accurately judge the color. My choice as one of the first to try for choosing as it is easy to see all of them. (L-2)
Monitor Gamma Robert Berger explains why images appear darker on some displays.
Netscape's 216 colors from Barta's web page tutorial describes computer displays and why you might not get color you want.
Non-Dithering Colors in Browsers Browser safe color palette with swatches and codes by Lynda Weinman. Save both and open them in your graphics program. (L-2)
Websafe Colorizer
Click a web-safe background and see how it looks with all the web-safe colors as foregrounds with text
Website Tips for Designers - Color color charts, articles, tutorials, resources about color and color blindness. Color Psychology, Meanings, Color and Design. (L-6)
World of Color Dmitry's Design Lab April 1997 starting with color wheel
Cheryl's Image Gallery artbycheryl.com Wonderful hand drawn original artwork. Her cast of characters is unique. "Largest single artist clipart library on the web today" (L-3)
Clip Art Connection Search the site by categories as well as find links to libraries. Clip-Art.com Links to free clipart, fonts, photos and web graphics sites ranked by popularity. (L-3)
GIFS and JPEGS description of the two Web graphics formats. (L-3)
GIFSplit split a gif into pieces online for image maps. 1/03 7/03 7/04 server pages temporarily down. (L-3) take out as too long, check back again
GIFBot NetMechanic Image Size Reduction and Optimization free gif (includes animated) and jpeg shrinking online. (L-3)
GIFWorks! Free Online GIF eTools create many special effects with any GIF including resize, crop, colorize, optimize and buttonize. Add/remove transparency. Free. Functions from the former MediaBuilder GifOptimizer are incorporated. (L-3)
Gif Transparency Creating in Paint Shop Pro from Laurie McCanna's Tips and Tutorials
WDVL: HTML for Web Graphics examples for attributes allowed and tip to prevent that little "tic" mark (extra underscore) when using linked images (L-3)
HTML Image Tips techniques to minimize image transfer time. (L-3)
IconBazaar images displayed by categories. Subscription to access.
Icon Browser Lots are there with a search engine to find them.
Image Crunchers scroll down to try GIFCruncher (reduce file size including animated gifs) and JPEGCruncher online free at spinwave.com (L-6)
Image O Rama Collection of icons nicely organized alphabetically. (L-3)
Internet - Graphics Comprehensive list Chris found in Virtual Quincy's Graphic Notebook.
JPEG Wizard free by Pegasus for reducing the size online. Can also specifify dimensions for the optional output thumbnail image. (L-6)
MediaBuilder Free Image Library can choose a graphic and make a beveled button online or create animated text. Fonts and animated Gifs with online tools. (Animation Factory network)
Pixelsight Interactive site for customizing graphical text and images. I created the titles for this page there. With the changes made when it became a subscription service, I have been unable to duplicate the settings to make new ones that match. Closed for remodeling 2/2006 (L-3)
A Short Course in Pixels, Displaying, Printing, and Scanning "Everything you wanted to know about how PIXELS relate to image sizes when displaying, printing, and scanning digital images." A must use Image Sizing Calculator and Scanning Calculator to download in excel spreadsheet format, rescalc.xls scancalc.xls
Thumbnail Images As Hyperlinks Otter gives information and examples for resizing, reducing and reformatting graphics, including animated gifs. (L-3)
Paint Shop Pro at JASC Great program for editing and creating graphics. PSP also comes with a gif animation program. (L-3)
IrfanView Free image viewer and converter for Windows. Can convert to .ico (L-3)
ShoeString's PictureDicer Windows freeware tool chops image into smaller images and generates code to display so they appear as uncut original, nice for "fake" imagemaps. (H2 1)
The Plugin Site - Free Graphic Tools Adobe Photoshop plugins and plug-ins, filters and effects for Paint Shop Pro, Corel Photo-Paint, Adobe Premiere for MAC and PC (L-3)
Ulead Downloads Free trial versions Photo Explorer and Gif Animator, check freeware.
Tutorials for Paint Shop Pro and Photoshop and resources and tips for choosing the best format, jpeg or gif, preparing graphics for the web and fonts. Information about animated gifs (the tutorials tell how to make them transparent also), image maps and scanning
For learning HTML, use a basic text editor like Notepad (Windows) or SimpleText (MAC) to actually type in the HTML tags and contents for your HTML document. Save your file as text only with the name followed by .html or .htm extension instead of .txt and open the file in your browser to view it. To upload the page to your ISP, use the name like index.html or .htm required by your ISP for your first page or front door. BigNoseBird.Com's First Impressions Page: Why your main page matters most. This process of obtaining a working knowledge of HTML should make it easier to choose and use an editor in the future. WYSIWYG vs. Hand Coding, the Great Debate presents reasons for using both. NoteTab Light v 4.95 free Text and HTML Editor that allows you to control the output. Top ratings are given by those who use Dreamweaver, CoffeeCup HTML Editor, HomeSite and Arachnophilia (careware). Others suggest to look at DiDa. I use CuteHTML like a text editor with the advantage of color-coded tags and line numbers to make it easier to test along with CuteFTP.
HTML Basics: Style and Structure File Directory Guidelines has tips to organize your files using subdirectories. Create an index.html for each one. (L-2)
Newbie Corner Zonie created this for VU students taking online classes but great for others too: creating new folders, starting html files, irc, ftp and other topics. (L-1)
NONAGS Lots of editors and other free or shareware to download too.
timeanddate.com excellent online World Clock - Time Zones to get current local times around the world, customize for your needs, search for time by city or region. Fixed times calculator and meeting planner. Calendars. (L-1)
Tucows shareware site. HTML accessories, graphics programs, etc. for pc and mac. (L-3)
Doctor HTML A must use! My favorite quick check to catch little errors like extra or missing opening or closing tags, verify code, links, and spelling. Latest version checks which browsers support your tags. (L-6)
WebSter's Dictionary 2.0 appears to really be gone. I had written several times when it disappeared before and Goldendome graciously put it back up even though the author was no longer there. I am sorry because you could spell check your web pages online, ignoring your html tags.
NetMechanic HTML code help - check tags and links. Be sure to recheck any links not found as sometimes they are not available because of server problems or the author is changing things. Even a week or more later they might reappear or do a search to find a new location. You will still want to periodically check links by hand. (L-6)
Web Page Monitor Tester see your page at different screen resolutions for MAC and PC, Steve Younis. (L-6)
Web Page Purifier shows what your site looks like using various standards of HTML and also in webtv. (L-6)
Google Thanks to Susanna for the tip to use it when searching for sites that are down. The latest cached version might contain information that will help you track down what has happened to a link.
Yahoo! GeoCities Hosts free Home Pages with lots of utilities. 15 MB. EZ uploading from the online File Manager, FTP access only available with pay packages (L-1)
NameSecure: domain name registrar .com. net .org .biz .info. Register/renew domain names, manage account information online. Can also transfer and manage domain
GoDaddy.com another place to register/transfer existing domains and manage your domains, inexpensive and rated as reliable
A-Prompt (Accessibility Prompt) Web Accessibility Verifier - software tool designed to help Web authors improve the usability of Web pages created in HTML format. Windows 98/98SE/2000/Me/XP (L-6)
Find more resources for mailing lists, magazines, newsgroups, web page design and style, DHTML, Style Sheets, CGI, Forms, free counters, forms and guestbooks without CGI access, promoting your page, metatags, more accessibility links, advanced topics and more tips.