Scribd
Upload
165 views

HTML CodingStd

The document provides guidelines for coding HTML documents for a website hosted on xyz.com. It recommends using HTML 4.01 Transitional and outlines best practices for code readability, hyperlinks, images, frames, special characters and more. HTML files should have consistent formatting and tagging standards to work across browsers and be easily maintained.

Uploaded by

nel12
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
165 views

HTML CodingStd

The document provides guidelines for coding HTML documents for a website hosted on xyz.com. It recommends using HTML 4.01 Transitional and outlines best practices for code readability, hyperlinks, images, frames, special characters and more. HTML files should have consistent formatting and tagging standards to work across browsers and be easily maintained.

Uploaded by

nel12
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
You are on page 1/ 8

1.

HTML Coding Standard


Though generally invisible to the site visitor, HTML coding is very important to the success of a site. Depending on how a site is coded, certain browsers may be unable to display content. HTML also provides methods of streamlining the visitor's experience on the site.

1.1. HTML Standards


The recommended coding standard for Web pages hosted on Att.com is HTML 4.01 Transitional. HTML files should be preceded by the appropriate SGML prologue as outlined in the standard. The file must be declared as *.html, other file format for html is not allowed. Like index.html is correct But index.htm, index.shtml are illegal file type declaration. All TAG must be in upper case only, with proper closing TAG, like <BODY></BODY>

1.2. Code Readability


Extraneous tags are sometimes created by various HTML editing tools (empty and <div> tags, etc). These should be removed before staging a site. All HTML files should be saved out using UNIX line feed format. Saving files in Windows or Macintosh line feed format results in illegible code when placed on a UNIX Web server. Most good HTML editors allow you to set this option in the preferences. HTML files should be saved out with a maximum line length of 72 characters. Longer line lengths make files difficult to edit while on the server. Wherever helpful, comment tags should be included in the HTML. This is especially important for sections of code, which are delicately structured. The name of the coder should be included in a comment tag in the head of each HTML file. This ensures you can be found in case any questions arise. Indenting items such as nested lists and tables can be helpful to others trying to read your code. Be aware, however, that excessive indenting can often render code illegible, especially in UNIX editors.

1.3. Coding Hyperlinks


When referencing other Web pages within your own Web site, hyperlinks should be coded relative to one another. For example, a reference from one page to a feedback form located in the same directory would be coded as: <A HREF="feedback.html">Feedback</A>. When referencing other Web pages outside of your Web site but on xyz.com, hyperlinks should be coded absolutely (beginning at the root directory of xyz.com with a / and working down). For example, a reference from a page in one directory that links to a page in another directory on xyz.com would be coded as: <A HREF="/ir/events.html">IR </A>. (Here proper web root mapping must be done in the web server to avoid any conflict in accessing different directory level files)

References made to any Web page located outside xyz.com should be made using fully qualified (using the full URL) hyperlinks. For example: <A HREF="http://www.w3c.org">W3C</A>. When coding for the directory level (index.html) file of your own directory, links should be coded as: <A HREF="/">Index></A>. When coding for the directory level (index.html) file of another directory, links should be coded using the trailing slash: <A HREF="/ir/"></A>. A Web page should never have a hyperlink, which references itself. If a self-referencing link appears on a site's navigation, the anchor tag should be commented out. This applies to both text links and images, which act as links (including area coordinates on an image map).

1.4. Linking URLs


Since xyz.com has a mirrored environment inside and outside the firewall, it is imperative that you construct relative URLs to objects within your site. In other words, do not specify the protocol, hostname, or full path to any of your media. For example, if your web was rooted at foo, to reference bar.html from index.html the right way would be: <A HREF="bar.html">MOVE it, TEST it, USE it</A> The wrong ways are: <A HREF="http://www.xyz.com/foo/bar.html">no way to test your web</A> <A HREF="/foo/bar.html">this will work until we move your web! </A> <A HREF="/bar.html">this points to bar.html in the server's document root not your foo directory</A>

1.5. Cascading Style Sheets


There are no restrictions on the use of Cascading Style Sheets (CSS). Note that not all browsers support the full range of features that CSS affords. As browser support expands over time, expect to see standard style sheets for use on www.xyz.com. Refer CSS class name in your Tags, like <TD CLASS=tabledata></TD <FONT CLASS=fontclass></FONT> Each class in CSS must have font style, font size, and color.

1.6. Cookies
Use of cookies is allowed within reason. Cookies are usually implemented via JavaScript, Java, CGI or any variety of methods.

Note that not all browsers support cookies. On top of that, cookies are often viewed as an invasion of privacy, and some users will be turned off by your using them. Be judicious and limit cookie usage or otherwise ensure that cookies are not mandatory for users to use your site. Please make sure that any cookie usage is compatible with privacy policy.

1.7. Proprietary Tags


The use of proprietary tags should be avoided whenever possible. To ensure that Web sites work in the widest range of browsers possible, it is recommended that you code pages for a specific HTML version, not a specific Web browser. Examples of proprietary tags include, but are not limited to: NOBAR MARQUEE LAYER The use of the font face tag is discouraged because of a lack of standard fonts across platforms. Should you find it necessary to specify a font face, you should specify multiple fonts (at least one standard Windows and one standard Macintosh font) and always choose fonts that will degrade gracefully across browsers and platforms. Style Sheets are much better for indicating font face, style and size changes than font tags.

1.8. Image Tags


All images which appear inline in an HTML document should be referenced relatively. The only exception to this rule is common xyz.com images, such as logos and footers, which reside in webroot/images and should be referenced absolutely. Common images should not be kept in an individual Web site's images directory. Instead, they should be called from webroot/images. This helps limit the number of files on the server and allows the common images to be easily updated across all web sites on xyz.com. All images should have contained a descriptive ALT attribute. This allows greater accessibility for users who browse with images turned. Also HEIGHT and WIDTH should de declared in the <IMG> tag, to enabling fast downloading of the web page.

1.9. Image Maps


xyz.com supports the inclusion of client side image maps; server side image maps are no longer supported because of the unnecessary load they place upon the server and the widespread use of client side image maps. For accessibility reasons, all links which appear within an image map should also be duplicated in the form of text links. All area coordinates for image maps, as well as the image tags themselves, should have contained a descriptive ALT attribute. This allows greater accessibility for users who browse with images turned off.

1.10. Frames

The use of frames is discouraged because they can often lead to confused users and maintenance nightmares if improperly done. For this reason, frames should only be used in a logical manner when they will provide a clear benefit that is unattainable without the use of frames. If you chose to use frames, it is recommended that you also implement a non-frames version.

1.11. Special Characters


The numerical entity should be used for all special characters, with the exception of ", <, >, and & which may use named entities. For example, a trademark should be coded as &#153; and a quotation mark could be coded as &quote; or &#034; Because there is no numerical or character entity for a service mark, service marks should be coded as: <FONT SIZE="1"><SUP>SM</SUP></FONT> Trademarks, registered trademarks, and service marks should be used only at the first instance they occur in an HTML document. Subsequent references in the same HTML document would be coded without the mark.

1.1. HTML Editors


While it may be tempting to use a WYSIWYG HTML editor to create your pages, such tools can be a bigger problem later in a site's lifecycle. Tools like Microsoft FrontPage, Adobe GoLive and Netobjects Fusion can mangle good HTML, adding extraneous tags and malformed HTML constructions, which can bloat the file size of your HTML pages. With major cleanup, you can create pages with these tools that are acceptable. You should also avoid the "Save as HTML" functions in the various Microsoft Office products: such features either create bad HTML or HTML that is only viewable on certain browsers and platforms.

1.2. Quick Guide Lines For HTML


Make sure of browser compatibility, and it is found that the propriety TAGS will not work in all browser. Sl. No. 1 2 3 Guidelines The names of HTML files should always end with the ".html" extension. All command tags should be completely capitalized, in order for the tags to stand out better from the surrounding text. Like <BODY></BODY> Mention all attributes needed for TAG, <BODY BORDER="0" LEFTMARGIN="0" TOPMARGIN="0" MARGINHEIGHT="0" MARGINWIDTH="0" TOPMARGINWIDTH="0" LEFTMARGINWIDTH="0> <TABLE BORDER=0 WIDTH=100% CELLSPACING=0 CELLPADDING=0> <TD WIDTH=10% CLASS=classname> All the TAG attribute values must be enclosed in double quote. TAG indent is need while writing nested TAGs like nesting <TABLE> within a <TABLE> tag. All <A>/anchor TAG should always be enclosed in quotes. Like <A HREF=myfile.cfm?var1=value1&var2=value2>XXX</A> In Query string, avoid space character. It is better to convert all passing argument values in hexadecimal. Else place space character into +. Always include a <HTML> tag at the very beginning and a </HTML> tag at the very end of your HTML documents, also <BODY>. <HEAD> & <TITLE> must be included in each CFM/HTML files.

4 5 6 7 8 9

Sl. No. 10

Guidelines Always use <META> element to refresh a page after a specified time. Example: <META HTTP-EQUIV="Refresh" CONTENT="10"> Use <META> tag to provide keywords for the document to be indexed. Example: <META NAME="author CONTENT="Ian Graham"> <META NAME="keywords" CONTENT="html documentation web url"> <META NAME="editor CONTENT="HTML SuperPro"> If you want browser to know the document is an index document, include the <ISINDEX> tag. This causes the browser to create a user-input field into which the user can type words to be used in an index search. Example: <HEAD> <ISINDEX> ... </HEAD> Style sheet should always be referenced using <STYLE> tag and enclosed within, this must be declared within <HEAD> tag only. Example: <HEAD> <LINK="STYLESHEET" TYPE="TEXT/CSS HREF="filename.css"> </HEAD> Scripting code should always be enclosed with <SCRIPT></SCRIPT> tags. The tags should also contain information such as the Scripting language and specify if the script is running on the server or at the client-end. Example: <SCRIPT LANGUAGE=javascript> var formfield=; </SCRIPT> OR Calling from a Java Script file, <SCRIPT LANGUAGE="javascript" type="text/javascript" SRC="help.js"></SCRIPT> Use entity references instead of character references. Some browsers have characters reserved to display certain attributes, such as HTML elements and graphic characters. Example: Use &lt; to print < Use Headings to highlight topic headings and sub-heading. HTML allows for 6 levels of headings. Example: <H1 align=center>Heading One</H1> Wherever possible, all Tags (except singleton tags like INPUT, IMG etc) should have corresponding closing tags. Example: <FORM ACTION="myfile.cfm" METHOD=POST> .............. </FORM> If the closing tag is missed out, some browsers used to take acre automatically and this does not affect in displaying the content, but this should not be relied upon. All display fields and frames must be included within a table to avoid alignment and resolution

11

14

15 16

17

Sl. No.

Guidelines problems. While declaring the WIDTH in the <TABLE> or <TD> tag, declare as percentage or pixel width as per your requirement (WIDTH=100% or WIDTH=500)

2. Java Script Guidelines


The following table describes few tips in writing Java Script, Sl. No. 1 2 3 4 5 6 Guidelines Try to avoid in writing the Java Script within the same page CFM/HTML. Better write the functionality in JS file and call from the page. Exclusively declare all variables and initiate them. Example: var name=; Control statement must be written in lower case only. Use white Spaces and indents to make the code readable. Use a semicolon at the end of each statement. Call the document, form, and field object with qualified names only.

2.1. Java Script Objects


General Objects Date Math String Window Object Window o o o o Navigator Objects navigator a. navigator.plugin b. navigator.mimetype

Window.frame Window.location Window.history Window.document

Window.document Objects Window.document.layer Window.document.link Window.document.image Window.document.area Window.document.anchor Window.document.applet Window.document.form

Window.document.form Object window.document.form o window.document.form.textarea o window.document.form.text o window.document.form.fileupload o window.document.form.password o window.document.form.hidden o window.document.form.submit o window.document.form.reset o window.document.form.radio o window.document.form.checkbox o window.document.form.button o window.document.form.select o window.document.form.select.option

2.2. Reference Sites For Java Script


http://www.echoecho.com/jsquickref.htm http://www.cs.uidaho.edu/~acm/javascript/jsdoc/methods.html http://www.palfy.mumszki.hu/books/JS/

3. Reference Sites
http:// developer.netscape.com/docs/manuals/communicator/jsref/but1.htm

You might also like