Home | Audio | DIY | Guitar | iPods | Music | Brain/Problem Solving | Links| Site Map

This work is licensed under a Creative Commons License.

Web Design: Rules to Code By

Adapted from: Web Design: The Complete Reference

Thomas A. Powell
Osborne McGraw Hill Books
http://books.mcgraw-hill.com/landingpage.php?template=osborne
Manual of Style: http://en.wikipedia.org/wiki/Wikipedia_talk:Manual_of_Style

Introduction to Web Design

• What Is Web Design?
• http://www.wdvl.com/Authoring/HTML/Tutorial/
• http://www.mediacollege.com/internet/design/webdesign01.htm
• YOU are NOT the USER.
• Web Content Accessibility Guidelines 1.0
• USERS are NOT DESIGNERS.
•  http://www.webstandards.org/about/mission/
• Design for the common user, but account for differences.
• http://en.wikipedia.org/wiki/Common_User_Access
• A site A site'
• Web Design - The Complete Reference: Chapter 1: What Is Web Design ...
• Know and respect the Web and Internet medium constraints.
• http://larry.masinter.net/www7std-notes.pdf
• Navigation is only a means to an end result.
• http://www.sics.se/humle/projects/persona/web/littsurvey/ch13.pdf
• Visual will heavily influence the user Visual will heavily influence the user's initial perception of a site'

The Web Design Process

• http://www.sics.se/humle/projects/persona/web/littsurvey/abstracts.html
• Always collect content before design when possible.
• http://www-128.ibm.com/developerworks/ibm/library/i-osource2/
• Visual Design should proceed in a top-down fashion from home page to sub section pages, and, finally, to content pages.
• http://64.233.167.104/search?q=cache:ol0wPJuRbhYJ:www.public.iastate.edu/~lewhill2/class/Arch590FinalReport.doc+%E2%80%A2+Visual+Design+should+proceed+in+a+top-down+fashion+from+home+page+to+sub+section+pages,+and,+finally,+to+content+pages.&hl=en&gl=us&ct=clnk&cd=3
• Always consider the bordering effect of the browser window when developing visual composites.
• http://www.builderau.com.au/program/css/soa/Create_flexible_CSS2_border_effects/0,339028392,320273718,00.htm
• http://alistapart.com/articles/practicalcss
• Don Don't "marry"
• http://www.newfangled.com/invention/grayscreen.php
• http://www.usabilityfirst.com/websites/index.txl
• Sites always have bugs, so test your site well.
• http://www.oreillynet.com/xml/blog/2006/08/why_we_will_always_have_proble.html
• Testing should address all aspects of a site, including content, visuals, function, and purpose.
• http://www10.org/cdrom/papers/296/
• User test is the most important form of testing and should be performed last.
• http://www.digital-web.com/articles/practical_usability_testing/
• Site development is an ongoing process Site development is an ongoing process-
• http://evolt.org/node/16220

 

Designing for Users

•  http://www.digital-web.com/articles/user_interface_design_for_web_applications/

• Definition: Usability is the extent to which a site can be used by a specified group of users to achieve specified gals with effectiveness, efficiency, and satisfaction in a specified context of use.
• There is no absolute idea of what constitutes a usable site. Usability will vary as much as the users accessing the site.
• WebReference.com - New Riders Interview with Jakob Nielsen and ...
• Flash: 99% Bad (Alertbox)
• WiserWays LLC
• Is your site a usable tool?
• Usability and the Web: An Overview
• CSSCreator An urban legend bites the dust--divs do not replace tables
• Usability depends on the medium of consumption.
• Writing for the Web: it's a usability issue - Builder UK
• Culture and Internet Consumption: Contributions from Cross ...
• 5TH ANNUAL CONFERENCE ON
• Usability and user satisfaction are directly related.
• Usability Testing of World Wide Web Sites
• http://www.firstgov.gov/webcontent/improving/evaluating.shtml 
• Browser do not use sites, people do.
• There are no generic people. Always try to envision a real person visiting your site.
• http://trace.wisc.edu/docs/consumer_product_guidelines/consumer.pcs/output.htm
• Avoid using text, graphics, and backgrounds of similar hue.
• http://www.uwec.edu/help/webpub/clr-vision.htm
• Avoid combining text, graphics, and background of similar saturation.
• Keep contrast high. Avoid combining text, graphics, and background of similar lightness.
• Avoid using busy background tiles.
• Make sure colors that are meant to distinguish items like links are significantly different in two way, such as hue and lightness.
• Users try to maximize gain and minimize work.
• Recognition is easier than recall, so don Recognition is easier than recall, so don'
• Do not make visited links the same style or color as unvisited ones, as it force the user to memorize where they have been.
• Since it is easier to remember visuals, make page that will be remembered as visually different from the rest.
• Limit groups of similar choices such as links to 5-9 items.
• Aim for memorization of only three items or pages sequentially.
• When response times such as page loads take more than 30 seconds, try to provide your own feedback to the user as a load-time progress bar.
• Time matters more to a user than bytes delivered.
• Improve Web page response time by taking advantage of user Improve Web page response time by taking advantage of user "think time"
• Use preloading on a liner progression of pages.
• Make page elements obviously different if they are different.
• Limit page noise and segment page objects sot that they don Limit page noise and segment page objects sot that they don'
• Sensory adaptation does occur on the Web. If you want a user Sensory adaptation does occur on the Web. If you want a user's full attention, you'
• Try to optimize keyboard access for all pages in a site, not just form pages.
• Minimize mouse travel distance between successive choices.
• Minimize mouse travel between primary page hover locations and the browser Minimize mouse travel between primary page hover locations and the browser'
• Make clickable regions large enough for users to move to them quickly and press them accurately.
• Always remember that you need to bring a site into the user Always remember that you need to bring a site into the user'
• Account for characteristics of the probable environment in which the user will access a site.
• Aim to create an adaptive Web site that meets the requirements of novices, intermediates, and advanced users.
• Design for the intermediate user if an adaptive Web interface is not possible.
•  http://www.edtech.vt.edu/edtech/id/interface/
• Users bring past experiences with the world, software, and the Web to your site. Make sure your site meets their expectations.
• Do not stray from the common interface conventions established by heavily used sites. http://www.webstyleguide.com/interface/user-centered.html
• Perform user testing early and often.
• When performing even an informal usability test, avoid talking too much or guiding the user.
• Do not use usability concerns as a way to avoid or eliminate visual, technological, or economic aspects of a site.
• Practice Practice "Las Vegas"

 

Site Types and Architectures

• http://www.grokdotcom.com/index1-01-2002.htm

• A Web site A Web site'
• Do not expose physical site file structure, when possible.
• A site A site'
• Aim for a site click depth of three.
• Aim for positive feedback indicating progress towards a destination every click, with a maximum of three clicks without feedback.
• Even for wide site structure, consider a range of 25-81 links per page when page links are ideally clustered.
• The more important the page, the more redundant links should be provided to it.
• Redundant links in a site should be no more than 10-20 percent of a page Redundant links in a site should be no more than 10-20 percent of a page'
• The overriding purpose of any commercial site is to serve the user in a way that hopefully benefits the company either directly or indirectly.
• Entertainment sites may find novelty or surprise more useful than structure or consistency.
• Novice users prefer sites with predictable structure and may put up with extra clicks or a lack of control to achieve a comfortable balance.
• Power users or frequent site user want control and will favor structures that provide more navigation choices.

 

Navigation Theory and Practice

• http://evolt.org/node/60270

• Use simple and memorable URLs to improve navigation.
• http://clickz.com/showPage.html?page=3346531 
• Do not hide URLs Do not hide URLs-complex or simple-
• Use consistent and explicit page labels for all pages in a site.
• Site wide labeling icons or words such as the organization name or logo should always return a user to the home page of the site when clicked.
• Button states should be considered a secondary form of page label and the selected state should always be subdued, not prominent.
• When using color-coding to imply section location, make sure the colors used are significantly different from each other.
• Do not go so overboard with theme-based location hints that you fall into a designer-defined metaphor.
• Do not attempt to mimic the browser history mechanisms with links.
• Avoid links named simple Avoid links named simple "Back."
• Avoid creating pages that cannot be backed out easily using the browser Back button.
• Users remember their start page as a permanent landmark and the home page of a visited Users remember their start page as a permanent landmark and the home page of a visited 
• Don Don'
• Avoid placing primary navigation on the far right of the screen.
• Home pages or other landmark pages should consider using center Home pages or other landmark pages should consider using center-
• Placement of navigation should be consistent within a page layout.
• Navigation should be consistent and elements should exhibit stability in position, order, and contents.
• When separating navigation choices by position onscreen, understand that four locations is a hard barrier.
• Navigation-oriented pages should fit vertically within the screen whenever possible, as should primary navigation in all other types of pages.
• Minimize the distance between primary site navigation buttons and the Back button.
• Always attempt to limit mouse movement between subsequent navigation items.
• Avoid using frames for layout. Use them for navigation.
• When using frames, make smaller frames control larger adjacent frames.
• Do not turn off frame resizing and scrolling unless resolution is very well accounted for.
• Do not make a remote the mandatory form of navigation.
• Limit scrolling and mouse travel in navigation as much as possible.
• Consider a maximum of three page loads before a result.
  • Linking: Text, Button, Icons, and Graphics
  • http://www.rustybrick.com/seo_articles_3.php
  • http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnacc/html/ATG_TextEquivalentsforImages.asp
• Occasionally provide some unstructured links within document text to promote exploration and thought.
• Always provide textual links at the bottom of pages when using long pages or pages with graphical buttons.
• When using image maps, always provide a secondary navigation from such as text links.
• Never completely remove visited link indication.
• Avoid changing link colors.
• Avoid underlining non-linked text in Web documents Avoid underlining non-linked text in Web documents-
• Avoid automatically turning off link underlining. If you do, add another link indicator form such as Avoid automatically turning off link underlining. If you do, add another link indicator form such as "underline on rollover.
• Avoid using ellipses in links, as they are generally redundant.
• Graphical buttons should have at a minimum an unselected and selected state. Over states and press states should be considered optional.
• Provide good labels indicating the form of the content. Consider using icons to show content types.
• Make sure to indicate if the link will jump them within a page, within a site, or to an external site. Don Make sure to indicate if the link will jump them within a page, within a site, or to an external site. Don'
• Indicate an external link by exposing the URL or using an icon. Indicate file size if triggering a download.
• Use an icon or symbols, or issue an alert dialog before the link.
• Avoid changing visited link colors.
• Add the last modification date to show update times and, where necessary, use a New icon.
• Use an alert, or warn with an obvious label.
• When using status bar messages, consider providing URL information with the text when linking externally.
• Broken links should be considered catastrophic failures.
• Avoid automatic redirects for 404 errors.

 

Search and Design

• http://searchenginewatch.com/showPage.html?page=webmasters

• Utilize past user experience with search engine by using similar layout and labeling in local search facility design, but avoid imitating aspects of public search engines that deal with the uncontrollable nature of public Web sites.
• Do not design pages solely to attract search engines as, ultimately, pages are for people.
• If a site is filled with regular formatted data, very complex to digest data, or contains more than 100 pages, include a local search engine.
• If a site caters to power users or frequent return visitors, provide a search facility.
• When search is available in a site, include a search button or field on all pages.
• A search form as well as the result pages must match the look and feel of a site.
• A search from should match the content being searched.
• Primary search text boxes should be about twice as big as secondary search text boxes.
• It is better to limit search to a topic, category, or idea rather than a section of a site.
• Advanced search facilities must provide instructions and examples.
• Result pages should provide as much information as possible so users can decide what items to peruse further.
• The format of the search results should fit the data that is being returned.

 

Page Types and Layouts

• http://drupal.org/node/46006
• Set the size of the page to fit the purpose and the content at hand.
• http://www.anybrowser.org/campaign/abdesign2.html
• Avoid wide pages, particularly those that cause rightward scrolling.
• Try to keep important items such as primary navigation in the first screen.
• Be aware of the screen Be aware of the screen "fold,"
• Avoid resolution entry restrictions fro sites if at all possible.
• When designing for WebtV, consider a hard and fast page width of 544 pixels.
• If designing with assumed screen sizes, be conservative and give yourself a slop factor of as much as 10 percent of the available region.
• Allow the user to stretch or shrink screen sizes, be conservative and give yourself a slop factor of as much as 10 percent of the available region.
• When using fixed page sizes, make sure to center your page to reduce the perception of empty space on larger displays.
• Avoid using stretchable designs on pages with little content.
• Try to fit content vertically within 3-5 screens, if possible.
• Either control page margins or account for their variation with some layout slop factor.
• Provide an obvious link to quickly skip a splash page.
• A home page should set the visual and navigational tone of a site.
• A home page should load fast, but be dramatic enough to encourage interest.
• A home page should clearly indicate what A home page should clearly indicate what'
• A home page should provide information value and an obvious indication of site change if change is occurring.
• If a particular subpage is a landmark or common entry page such as a If a particular subpage is a landmark or common entry page such as a "section home page"
• Subpages should follow the style and navigation of the home page, at least in spirit.
• Make FAQ pages a single document so they are easily printable, if they are of a reasonable length.
• Provide a link back to the top of the document or to the list of the questions at the end of every answer.
• Consult a legal professional for drafting or inspection of any legal terms used.
• Add a last modification indication to pages.
• If sensitive or personal information is collected, provide an easily accessible and understandable privacy statement.
• Full contact information should be available within one click of any page on a site; minimal contact information such as an email address should be included on every page.
• Inform users that printed pages will be different that what is seen onscreen or show the print version directly.
• Use Acrobat PDF files for highly complex information that needs to print perfectly such as data sheets, technical drawings, and complex financial or mathematical information.
• Clearly indicate Acrobat files with text and an icon, and provide information on using these files.
• Provide an obvious conclusion page for a task.
• Provide a way back to the site from an exit page.
• Let users leave in peace. Avoid Let users leave in peace. Avoid "please don't go" or "last chance"
• When using text When using text -
• Consider using a text design philosophy on sites where download speed or display flexibility Is paramount.
• Avoid using metaphor design on sites geared toward expert users or heavy repeat use.
• Avoid unconventional or very artistically oriented interfaces designs on task-driven or frequent-use sites.
• Use header-footer design for content-focused sites, particularly when wide content is common.
• Strive always in Web design to be the same, but different. Strive always in Web design to be the same, but different. 

Text

• Reading on the Web
• Eye Tracking Studies 
• Eye Tracking Research
• F-Shaped Pattern For Reading Web Content
•  F-Shaped Pattern For Reading Web Content 
• Stanford-Poynter Project
• Online News All About Text

• Increase line height to improve online text readability.
• Create a type hierarchy by varying text color, size, style, and position to improve page usability.
• The details of a site may heavily influence the take-away value.
• Avoid anti-aliasing small text.
• Consider three fonts per page: one for page labels and headlines, one for body text, and one for navigation.
• http://www.microsoft.com/typography/web/fonts/comicsns/default.htm
• http://www.microsoft.com/typography/web/fonts/default.htm
• http://www.efuse.com/Design/web_fonts_basics.html
• Columns of text in Web pages should never wrap up and down.
• Navigation-focused pages generally require less text white space than consumption pages.
• Always use white space to complement the use of information.
• Be careful of using words that have alternate Web meanings.
• Colors, Images, and Backgrounds
• http://www.w3.org/TR/REC-CSS2/colors.html
• http://www.w3schools.com/html/html_backgrounds.asp
• http://www.htmlhelp.com/reference/css/color-background/
• To ensure the appropriate color is produced, always use a hexadecimal value over a named color except in the case of basic colors like white, black, red, and so on.
• http://www.w3.org/MarkUp/Guide/Style
• http://www.jqjacobs.net/web/color_graphics.html
• http://en.wikipedia.org/wiki/RGB_color_model
• http://www.debbietdesigns.com/learn/35/color-design-on-the-web/
• To safely break the 216-color barrier, use pre-dithered patterns or so-called hybrid colors.
• http://style.cleverchimp.com/dithering/
• http://www.webdesignref.com/pdf/ch13.pdf
• http://gutenprint.sourceforge.net/developer-html/c1968.html
• http://www.opensource.apple.com/darwinsource/Current/gimp_print-11/gimp-print/doc/manual-html/gimpprint_25.html
• http://docs.biostat.wustl.edu/cgi-bin/info2html?(gimpprint.info.gz)Dithering
• Due to poor cross-browser support, avoid using Due to poor cross-browser support, avoid using <BASEFONT> element to set font values in a document-
• Always store your image in a separate directory.
• Name your images in a logical fashion that groups them by purpose or usage.
• http://codex.gallery2.org/index.php/Codex:Guidelines
• http://architecture.mit.edu/news/portfolio2004.pdf
• You can You can't use the <IMG>
• http://www.w3schools.com/tags/tag_img.asp
• http://www.htmlhelp.com/reference/html40/special/img.html
• http://wdvl.internet.com/Authoring/HTML/Objects/Images.html
• ALT text should reinforce the meaning of significant images; if an image does not convey essential meaning, leaving the ALT value blank is better than cluttering the page with unnecessary ToolTips.
• Always use the HEIGHT and WIDTH attribute with the Always use the HEIGHT and WIDTH attribute with the <IMG>
• Never use the HEIGHT and WIDTH attributes to resize images with HTML. If a smaller version of an imae is needed, create a smaller version of the image and use HEIGHT and WIDTH correctly.
• Always set an image Always set an image's BORDER attribute to zero unless you have a specific design reason to do otherwise-
• Limit graphics formats in Web pages to JPEG and GIF until other formats become generally supported.
• Don Don'
• When creating layouts with cut-up images and tables, make sure that WIDTH and Height values for images and table cells always add up appropriately.
• For cut-up images and table to work together properly as layouts, always set the table For cut-up images and table to work together properly as layouts, always set the table'
• Do not make a background tile a very small height or width (e.g. 1-2 pixels) as an annoying monitor flashing effect may result.

 

Building Interactivity Using GUI Features

• Provide a useful service that is difficult to transfer between sites to improve site Provide a useful service that is difficult to transfer between sites to improve site "stickiness.
• Provide online documentation (or, in some cases, printed documentation), but don Provide online documentation (or, in some cases, printed documentation), but don'
• Avoid modification of the appearance of the user Avoid modification of the appearance of the user'
• When using full-screen window, inform the user how to exit or provide a close button.
• Do not go full screen without asking the user first
• Do not create general modal windows. Reserve modality for alerts, prompts, and confirmation windows.
• Use alerts to inform the user of important issues, not general information.
• Use a confirmation dialog to verify the execution of irreversible or important tasks such as form submission.
• Use prompt dialogs only to ask a user to provide a short word or numeric answer to a simple question. Do not ask questions that would result in a multiple-line answer.
• Set the length of text fields to reasonably fit data being provided.
• Always set you MAXLENGTH for a text form field.
• Only allow a text field to scroll rightwards when there is a premium on screen real estate and the data to be entered is larger that the available screen region.
• Never allow password fields to scroll.
• Do not use default values with password fields.
• Set text wrapping in multiline text regions.
• Consider vertically aligning related check boxes to decrease mouse travel.
• Always check an initial radio button by default.
• Use radio button for yes/no questions rather that pull-down menus or check boxes.
• Avoid more than eight items in a radio group.
• Use pull-downs if more than eight items are in a selection of one-choice-of-many to save screen real estates, as stated by this rule.
• Do not use radio buttons for navigation.
• Avoid changing the display of single-choice pull-down menus with the SIZE attribute.
• Make the result of navigation pull-down clear by context, labels, and possibly a trigger button.
• Make sure pull-down navigation degrades gracefully when JavaScript is off.
• If a go button is shown onscreen with pull-down navigation, make sure the user can actually click it.
• Reset a pull-down when users back out of a page as well as when they select separator items.
• Avoid scrolled lists if you expect alternative browsing environments; use separator items.
• When using scrolled lists, make sure to provide some form of instructions for novices users on how to select multiple items.
• Do not use default form-style push buttons for navigation; instead, reserve them to cause actions.
• Provide a confirmation on a form reset button to avoid accidents.
• Consider moving your reset button away from the submit button.
• Provide a final chance before submitting important information or starting a difficult-to-reverse action.
• Keep the submit button at the bottom of the form, either in the center or on the left side.
• Provide a degradable state for image buttons with scripting or images off.
• Generally, lay out form elements up to down, but consider left to right based on the context of the information being asked for.
• Consider keeping table borders on when formatting table elements as they help associate labels and fields.
• Imitate real- world forms directly if users are very used to filling them out; otherwise, focus on reducing the amount of data entry.
• Make forms keyboard friendly.
• Accessibility Tip: Create Keyboard-friendly Link Effects
• ATIC: Accessibility: MIT Web Accessibility Guidelines
• Keyboard events and key identifiers
• One Minute Designer 1 - 25 steps towards more reader-friendly web ...
• Limit mouse travel between form elements.
• Label all required fields carefully using an asterisk or the word Label all required fields carefully using an asterisk or the word "required.
• Add TABINDEX attributes to improve form navigation.
• Set Focus on the first field of a form page immediately.
• Do not override or mask browser accelerator keys.
• Use accelerator keys for forms that will be used repeatedly.
• Use ToolTips to provide extra information about field use and format.
• Use the status bar to provide messages about field use.
• Provide a help button near complex form fields for context-sensitive help.
• Validate forms from the client side when possible.
• Always provide backup validation o the server side.
• Try to validate as people type, using masking, or as they move from field to field.
• During form validate as people type, using masking, or as they move from field to field.
• Bring immediate focus to fields in error.
• Mask text fields to limit the type of characters entered.
• Disable or hide fields that are not necessary in particular context.
• When setting fields to read only, change appearance or alert the user to the status of the field.
• Provide defaults and always set values to the most likely entry.
• Name your field names with simple common names to take advantage of browser AutoComplete features.
• When using a tree control, make sure that open and close state are distinct.
• Avoid mixing complex GUI interfaces within included binaries such as Java applets with Web page interfaces.

 

Web Technologies and Their Effect on Web Design

• Do not use bleeding-edge Web technology without good reason.
• http://webdesign.about.com/library/weekly/aa091498.htm
• http://www.toejumper.net/bleed9/bleed9.htm
• Beware of relying of published browser usage figure; track actual browser usage on YOUR site.
• http://htmlfixit.com/?p=479
• http://www.webanalyticsassociation.org/attachments/committees/5/waa-kpi-definitions-1-0.pdf
• Users often don Users often don't blame browsers for simple errors-
• http://www.libpng.org/pub/png/pngapbr.html
• http://www.456bereastreet.com/archive/200609/css_reboot_validation_errors_dissected/
• To ensure success, use server-side detection for basic browser profiling.
• http://www.mozilla.org/docs/web-developer/sniffer/browser_type.html
• http://www.codeguru.com/csharp/.net/net_asp/miscellaneous/article.php/c9849/
• Profile technical capabilities if possible, or assume the worst if you can Profile technical capabilities if possible, or assume the worst if you can'
• Pick a casing style for HTML and stick with it.
• http://www.mozilla.org/contribute/writing/guidelines
• Be careful with casing of attribute values, particularly with filenames.
• http://www.w3.org/TR/html4/interact/forms.html
• http://service.real.com/help/library/blueprints/stylehtml/htmfiles/syntaxs1.htm
• http://www.xml.com/pub/a/2003/10/08/qanda.html
• Validate all HTML pages.
• http://validator.w3.org/
• http://www.w3schools.com/site/site_validate.asp
• http://www.squarefree.com/bookmarklets/validation.html
• Consider conforming to XHTML today to future-proof Web pages.
• http://www.w3.org/TR/xhtml1/
• http://www.webreference.com/xml/column6/
• http://www.webstandards.org/learn/reference/templates/xhtml10t/
• Separate HTML structure from presentation where possible, using CSS.
• Test CSS rules very carefully.
• http://www.w3.org/TR/2000/WD-css-style-attr-20001025
• http://www.hitmill.com/dhtml/css_intro.html
• http://www.htmldog.com/guides/cssadvanced/atrules/
• Use external style sheets whenever possible.
• http://www.w3.org/TR/html4/present/styles.html
• http://www.pageresource.com/dhtml/csstut5.htm
• http://www.ibdjohn.com/
• Always comment out style blocks to avoid interpretation by older browsers.
• http://java.sun.com/docs/codeconv/html/CodeConventions.doc4.html
• http://www.freenetpages.co.uk/hp/alan.gauld/tutstyle.htm
• http://www.glasshaus.com/samplechapters/1221/default.asp
• Avoid relying solely on style sheets for layout unless non-CSS-compliant browsers can be limited or detected and dealt with.
• http://msdn2.microsoft.com/en-us/library/x3k2ssx2.aspx
• http://lists.evolt.org/archive/Week-of-Mon-20040126/154508.html
• Use CSS to overload HTML presentation elements like Use CSS to overload HTML presentation elements like <FONT>
• http://www8.org/w8-papers/3c-hypermedia-video/anticipating/rutledge.html
• http://www.w3.org/2002/Talks/0807-xm-xag/all
• Create HTML and CSS document in the most suitable manner, rather that relying on only one tool or approach.
• http://www.w3.org/TR/CSS21/tables.html
• http://xml.coverpages.org/css.html
• Use comments in HTML documents.
• http://www.htmlhelp.com/reference/wilbur/misc/comment.html
• http://www.utoronto.ca/webdocs/HTMLdocs/NewHTML/comments.html
• http://webtips.dan.info/comments.html
• Create and use page templates.
• http://www.crossculture.com.hk/e-tmp-create.htm
• http://publib.boulder.ibm.com/infocenter/radhelp/v6r0m1/index.jsp?topic=/com.ibm.etools.pagedesigner.doc/topics/tpagetemplate1.html
• Be consistent in HTML file naming Be consistent in HTML file naming-
• Rely on standard XML languages rather than in-house-developed languages.
• Use XML as a neutral storage format and for exchange.
• Consider using both client- and server-side programming technologies.
• http://www.faultlinemedia.com/services/web_design/programming.html
• Carefully monitor responsiveness of server-side technologies.
• Create a capacity plan when using server-side technologies.
• To improve CGI execution, consider compiling or rewriting heavily used programs in another language.
• http://www.perl.com/pub/a/2002/12/04/mod_perl.html
• Using server-side technologies with complex URLs may confuse users.
• Provide a fallback state for all client-side programming technologies.
• Rely on helper applications when translations to a native Web for are impractical.
• Focus on using only the more popular plug-in technologies unless automatic installation can be performed.
• Use the Use the <NOEMBED>
• Provide installation assistance for plug-in and helpers.
• If ActiveX is used on a public site, make sure to provide alternatives for Netscape and other browsers.
• Be clear and honest with users about security issues related to object.
• Consider end-user system performance carefully when using object technologies like Java.
• Avoid building GUI interfaces within Web site interfaces using a binary technology like Java or ActiveX.
• Make sure to test to see if a script works in all versions of the language.
• Utilize object, method, and version checks in all scripts.
• Comment out scripts and use Comment out scripts and use <NOSCRIPT>
• Always add an error handler for JavaScript Always add an error handler for JavaScript'
• Use linked scripts rather than inline ones with possible.
• Practice good coding standards and consistent style in JavaScripts.
• Inform users what cookies are used for in an easily found privacy policy or usage statement.
• http://www.acm.org/crossroads/xrds7-1/cookies.html
• http://en.wikipedia.org/wiki/HTTP_cookie
• http://www.cookiecentral.com/c_concept.htm
• Avoid issuing multiple cookies.
• Provide an alternative for users unwilling to accept cookies.
• http://www.kdnuggets.com/news/2000/n08/14i.html
• http://www.junkbusters.com/links.html
• When trying to draw attention, avoid competing animations.
• Avoid continuously running animation loops.
• When linking to informational sound such as speeches or audio broadcast excerpts, always indicate the length, format, and size of the sound file.
• For download-and-play delivery, use WAV for low-quality music, sound effects, or speech.
• Use MIDI file with long background music files, particularly when bandwidth is at a premium.
•  Predictable and error-free delivery of real-time data on the Internet cannot be guaranteed with today's protocols and usage.
• Don Don'
• Always allow a user to turn off continuously playing sounds.
• Avoid video us unless the message is improved in this medium.

 

Miscellaneous

• Robots, Spyders, and Crawlers
• http://www.robotstxt.org/wc/faq.html
• http://www.robotstxt.org/wc/norobots.html
• http://support.microsoft.com/kb/q217103/
• http://www.serverautomationtools.com/pubs/sattools/john_on_automation/robots_text_file.html
• http://www.searchtools.com/robots/robot-code.html

• What is a Web Crawler?
• http://en.wikipedia.org/wiki/Web_crawler
• http://en.wikipedia.org/wiki/Data_mining
• http://en.wikipedia.org/wiki/Distributed_web_crawling
• http://www.majestic12.co.uk/

• Page Layout
• http://www.w3.org/2002/03/csslayout-howto Page using CSS
• http://www.w3.org/TR/CSS2/tables.html#q1 Using a Table

Home | Audio | DIY | Guitar | iPods | Music | Links | Brain and Problem Solving | Site Map | Contact

Top