Survey
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
Standards and Increasing Maintainability on Web-based Systems James Eaton Department of Software Engineering University of Wisconsin – Platteville Platteville, Wisconsin 53818 [email protected] Abstract This paper will cover Standards and Increasing Maintainability on Web-based Systems and will show how standards can improve Web-based code. When coding, it is always a good practice to follow certain guidelines and standards so that it is easy to go back and see exactly what the code does and how it can be changed. This paper will cover where you can find standards and guidelines and how you can test to see if you are following these standards appropriately. It will go into what standards there are for HTML, XHTML, CSS, and touch on other commonly used Web-based code. This paper will show the reasons why it is important to follow standards and increase maintainability. Introduction The World Wide Web is viewed as a place where people can work together and share information. This includes everything from business, to social, to educational sites. The problem is that originally there were few standards. As more sites were being developed, people wanted to make their sites stand out so that people would want to visit their site. Companies making browsers would come out with new features to try and get as many people using their product as possible. This became a headache for Web developers because they could make a page that would look great if their clients used one browser; but if their clients used a different browser, it would look terrible [2]. To combat this, Web developers would insert little tricks into their pages that would make their pages look acceptable on all the popular browsers. This was a temporary fix and caused many problems down the road. As browsers developed, the little tricks that used to work on old browsers did not work on the newer versions. This caused many pages to look broken again and maintainability costs kept rising with each new browser and version they chose to support [2]. Standards had to be introduced to keep costs down. Originally, some people would argue that standards were limiting and should not have been used. But developers were tired of having to develop pages specifically for certain browsers and having to go back and fix their pages each time a new browser version came out, so standards were developed. Web pages could now be developed for the standard. As browsers developed, they would follow the standard so that previously developed pages would not have to be fixed after each new version. Standards removed the tedious part of Web development allowing more time to develop higher quality pages [1]. Another reason for introducing standards was to increase accessibility. This would allow for people with special needs, like the blind or deaf, to use the Web along with people using hand-held devices to browse the Web. Organizations For standards to take place, organizations had to be formed. The organizations had to come up with very complete and official standards so that venders and developers would follow the specified standards. World Wide Web Consortium (W3C) “The World Wide Web Consortium (W3C) is an international consortium where Member organizations, a full-time staff, and the public work together to develop Web standards. W3C’s Mission is: To lead the World Wide Web to its full potential by developing protocols and guidelines that ensure long-term growth for the Web” [3]. This group is known for it recommendations with HTML, XHTML, CSS, XML, and many other web based projects. International Organization for Standardization (ISO) “ISO is a network of the national standards institutes of 156 countries, on the basis of one member per country, with a Central Secretariat in Geneva, Switzerland, that coordinates the system” [4]. European Association for Standardizing Information and Communications Systems (Ecma) “Ecma International is an industry association founded in 1961 and dedicated to the standardization of Information and Communication Technology (ICT) and Consumer Electronics (CE)” [5]. This group is well known for standardizing JavaScript. HTML HTML stands for Hyper Text Markup Language. An HTML file can be created using a text editor like notepad or a program like front page. An HTML file is a text file with the file extension htm or html that contains markup tags which tell the Web browser how to display the page. HTML was never intended to contain tags for but was intended to define the content of the document. This caused problems for developers when formatting information had to be added all over the place. This became very expensive to maintain [2]. Current HTML Standard The HTML specification is currently at HTML 4.01 which is a sub-version of HTML 4. By following this standard, all formatting information is removed and stored in a separate style sheet. The standard also improves the internationalization of documents. W3C was the organization responsible for putting together this standard. “HTML 4 is an SGML application conforming to International Standard ISO 8879 – Standard Generalized Markup Language” [3]. Validation HTML files are validated against a document type definition (DTD). DTDs define the document structure with a list of legal elements. The DTD must be the first line in the file. There are three document types that are available for HTML which are strict, transitional, and frameset [3]. Strict follows the W3C specification exactly and does not allow deprecated elements or attributes. The DTD to insert is <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> [3]. Transitional allows everything the strict DTD allows and allows deprecated elements and other attributes. The DTD to insert is <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> [3]. Frameset allows everything the traditional allows and also allows framesets. The DTD to insert is <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> [3]. Once you are ready to check to see if your page is valid, go to http://validator.w3.org/ and enter the page you want validated. It will give you the list of warnings or errors in the page. XHTML XHTML stands for Extensible Hyper Text Markup Language. It hopes to replace HTML. XHTML is stricter than HTML 4.01 but is almost identical. XHTML allows you to write well-formed documents that are also backward compatible. The big changes from HTML 4.01 to XHTML is that it ensures that elements are properly nested, XHTML documents must be well-formed, tag names must be in lowercase, and all XHTML elements must be closed [2]. Current XHTML Standard Because XHTML is relatively new, there is only one recommendation out for XHTML making it XHTML 1.0. It is the eventual replacement for HTML so it builds off of HTML 4. Most of this specification is spelling out the differences between XHTML and HTML 4, but it also goes into defining what XHTML is and how it can be used [3]. Validation XHTML files are validated in much the same way that HTML files are validated. These have the same three document types available. Different DTDs have to be specified for each one though to use the XHTML instead of the HTML 4.01 [3]. Strict: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> [3]. Traditional: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> [3]. Frameset: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> [3]. CSS CSS stands for cascading style sheets. This is important because it allows for separating structure and presentation. Styles define how to display HTML elements. HTML 4.01 specifies that CSS should be used to define the style. If multiple conflicting styles are assigned to a particular piece of data, the order it uses to determine the style is the internal style first, then the internal style sheet, then the external style sheet, and finally the browser default [3]. The internal style is the HTML tag that is hard coded into the page. The internal style sheet is an embedded CSS sheet specified in the head of the HTML document. The external style sheet is when the CSS file is in a separate file but included into the HTML document. Current CSS Standard CSS is at version 2.1. Version 1 contained all of the basic properties that almost all profiles of CSS needed. Version 2 added positioning of elements, numbering, page breaks, right to left text, and many other features that help pull as much of the formatting out of the content as possible. Version 3 is currently in the works and will include things like new selectors, fancier borders and backgrounds, vertical text, user interaction, speech and more [3]. Validation To validate a CSS go to http://jigsaw.w3.org/css-validator/ and enter the page you want to have validated. It will give you any warnings or errors in your CSS page [3]. JavaScript HTML is static. This makes it hard to seamlessly add dynamic components to your pages. JavaScript is a scripting language that allows for additional interactivity. Common uses for JavaScript is validating data and dynamically adding text. A common misconception about JavaScript is that people think it is based off of Java. It has nothing to do with Java, they are completely different languages [2]. JavaScript Standard The official name for JavaScript is ECMAScript. It gets its name from the standardizing company Ecma. The latest specification of ECMAScript is ECMA-262. JavaScript is a combination of Netscape’s JavaScript and Microsoft’s JScript. JavaScript allows the developer to manipulate Web page objects which are specified by the W3C Document Object Model [2]. XML XML stands for Extensible Markup Language. XML tags are designed to describe data. Unlike HTML, XML tags are not predefined. XML should be self-descriptive [2]. Standard The current W3C recommendation is XML 1.0 (third edition). This specification conforms to the generalized markup language International Standard ISO-8879 [3]. Validation To validate an XML, go to http://www.w3.org/2001/03/webdata/xsv and load the XML that is to be validated. This will give any warnings or errors received when validating the page [3]. XSLT XSLT stands for Extensible Stylesheet Language Transformations. XSLT can transform XML into different formats like HTML or WML to be displayed on the correct browser. It can be looked at a lot like a stylesheet for XML. All the formatting occurs in the XSLT and all the content is kept in the XML [2]. Standard XSLT Version 2.0 is a candidate recommendation from W3C [3]. This means that it is not yet a standard but they are reviewing it and improving it so that it can become a standard. Client-Side Scripting Client-side scripting is very popular on the internet. It includes languages like JavaScript that allow dynamic actions to occur on the static HTML. Other popular client-side scripts are DHTML which is a combination of JavaScript, HTML, and CSS. VBScript is a scripting language from Microsoft. WMLScript is a scripting language for use in WAP browsers which are used in wireless devices like mobile phones [2]. Server-Side Scripting Server-side scripting is used to dynamically edit, change, or add any content to a Web page before it is sent from the server to the client. This allows responses to queries or data that has been submitted from HTML forms [2]. Some examples of server-side scripting are PHP, Ruby, Perl, JSP, ASP, and SQL. Accessibility One of the main reasons for using standards is to increase accessibility. This is why the Web Accessibility Initiative was created. Increasing accessibility means to help people with disabilities use the internet, to help search engines index information accurately, to help newer Web browsers access old pages, and to help transition new devices like PDAs [2]. There are many reasons why Web developers would want to increase accessibility to their site [2]: It will improve the Web site’s reputation and image. Customers will be more satisfied with the site. More people will visit the site. People will stay longer at the site. The number of returning visitors will be increased. It will make the site more usable overall for everyone. It will help the site reach the fastest growing population: elderly people There are a couple of key things to consider when making a Web page that will greatly increase accessibility to the page. Always use the “alt” attribute; this will allow people with pictures turned off and people with devices that read the page to them to know what is going on. Always use a short but descriptive title. This will allow the user to quickly figure out what the Web site is about and if it might contain the information for which they are looking. Use relative size values; this will allow users to resize any text that they might have a hard time seeing. Avoid stylish fonts because many people have a hard time figuring out what the text is saying and will get frustrated trying to read it. It is also important to define a background color. Different browsers can sometimes come up with a weird background color if it is not otherwise defined. This can make the content hard to impossible for some users to read. It is also important to watch for color contrasts. There are a couple of good color combinations that the site should stick with to avoid hurting the user’s eyes. It is also important not to choose a background image that makes the content hard to read [2]. Web Accessibility Initiative (WAI) The WAI was created by W3C in 1997. It is their job to create a set of guidelines on how to make information accessible to people with disabilities and to more browser applications [2]. Conclusion It is easy to see how having few standards in the beginning created many problems for everyone and how even today it is important to get everyone to follow the standards. By following the standards, Web developers can spend less time fidgeting with their code to get it to work on multiple browsers and more time on making their code more appealing to the general public. This allows them to, overall, save money and accomplish what they originally set out to do [1]. Web pages are also becoming more compatible with new versions of Web browsers which greatly increase maintainability thus reducing costs even more. People are also more satisfied with sites that follow the standards because they are more comfortable with them. The increased accessibility helps more people get to the sites which was the original goal of the site in the first place [1]. It is clear that standards keep costs down while improving the number of visitors to the site. People who have coded with out the standards and with the standards would not argue that standards were limiting; but that the standards helped them do their job more effectively. Web pages should now be developed for the standard which is becoming very popular in industry and in personal use. Venders are also finding that more people use their product if they follow the standards. For instance, many people say they use Firefox over IE because it is closer to following the standard correctly. Standards remove the tedious part of Web development allowing more time to develop higher quality pages [1]. References [1] [2] [3] [4] [5] The Web Standards Project. 1 Apr. 2006. WaSP. 3 Apr. 2006 <http://www.webstandards.org>. W3Schools Online Web Tutorials. W3Schools. 3 Apr. 2006 <http://www.w3schools.com>. World Wide Web Consortium. 31 Mar. 2006. W3C. 3 Apr. 2006 <http://www.w3.org>. ISO - International Organization for Standardization. 20 Mar. 2006. 3 Apr. 2006 <http://www.iso.org>. Welcome to Ecma International. Ecma. 3 Apr. 2006 <http://www.ecma-international.org/>.