This action might not be possible to undo. Are you sure you want to continue?
Chp. -1 INTRODUCTION TO WEB TECHNOLOGY
1) HISTORY AND EVOLUTION WHAT IS COMPUTER PROGRAM?
Computer programs (also software programs, or just programs) are instructions for a computer. A computer requires programs to function, typically executing the program's instructions in a central processor. The program has an executable form that the computer can use directly to execute the instructions. The same program in its human-readable source code form, from which executable programs are derived (e.g., compiled), enables a programmer to study and develop the algorithm. Computer source code is often written by professional computer programmers. Source code is written in a programming language that usually follows one of two main paradigms: imperative or declarative programming. Source code may be converted into an executable file (sometimes called an executable program or a binary) by a compiler. Alternatively, computer programs may be executed by a central processing unit with the aid of an interpreter, or may be embedded directly into hardware.
Types of Programming Languages Three general types of programming languages – Machine languages – Assembly languages – High-level languages Machine languages – ―Natural language‖ of a particular computer – Defined by hardware design of computer – Generally consists of strings of numbers – Are machine dependent – Cumbersome for humans – Slow and tedious for most programmers Assembly languages – Programmers began using English-like abbreviations to substitute for machine languages – Represents elementary operations of computer – Translator programs called assemblers convert assembly-language to machinelanguage – Example: LOAD BASEPAY ADD OVERPAY STORE GROSSPAY High-level languages – Developed as computer usage increased, assembly language proved inadequate and time-consuming 1
Notes by Prof. Waman, Dept. of MCA, FAMT
remaining portions still able to route packets • Transmission Control Protocol (TCP) – Name of protocols for communicating over ARPA net. Dept. of MCA. although the hyperlinks between them control how the reader perceives the overall structure and how the traffic flows between the different parts of the sites. The URLs of the pages organize them into a hierarchy. FAMT 3 . error-control info and sequencing info • Greatly reduced transmission costs of dedicated communications lines – Network designed to be operated without centralized control • If portion of network fails. and usually reside on the same physical server. address info.Introduction to Web Technology Sem-I The pages of websites can usually be accessed from a common root URL called the homepage. – Ensured that messages were properly routed and that they arrived intact • Organizations implemented own networks – Used both for intra-organization and communication • Huge variety of networking hardware and software appeared – ARPA achieved inter-communication between all platforms with development of the IP • Internetworking Protocol • Current architecture of Internet – Combined set of protocols called TCP/IP • The Internet – Limited to universities and research institutions – Military became big user – Next. government decided to access Internet for commercial purposes • Internet traffic grew – Businesses spent heavily to improve Internet • Better service their clients – Fierce competition among communications carriers and hardware and software suppliers – Result • Bandwidth (info carrying capacity) of Internet increased tremendously • Costs plummeted History of the World Wide Web • WWW – Allows computer users to locate and view multimedia-based documents – Introduced in 1990 by Tim Berners-Lee • Internet today Notes by Prof. History of the Internet • ARPANET – Implemented in late 1960’s by ARPA (Advanced Research Projects Agency of DOD) – Networked computer systems of a dozen universities and institutions with 56KB communications lines – Grandparent of today’s Internet – Intended to allow computers to be shared – Became clear that key benefit was allowing fast communication between researchers – electronic-mail (email) • ARPA’s goals – Allow multiple users to send and receive info at same time – Network operated packet switching technique • Digital data sent in small packages called packets • Packets contained data. Waman.
Specification Building: Notes by Prof.Introduction to Web Technology Sem-I – – W3C – Mixes computing and communications technologies Makes information constantly and instantly available to anyone with a connection Founded in 1994 by Tim Berners-Lee • Devoted to developing non-proprietary and interoperable technologies for the World Wide Web and making the Web universally accessible Standardization • W3C Recommendations: technologies standardized by W3C • include Extensible HyperText Markup Language (XHTML). all the present hardware.. Let us see the steps involve in any web site development. The first important thing is finding the targeted audience. web sites can also be developed with certain methods with some changes and additions with the existing software development process. 5. it should be realistic. Moreover the analysis should cover all the aspects especially on how the web site is going to join the existing system. Model sites/applications etc. the team gets into it.Supporting documents and 6. Analysis: Once a customer is started discussing his requirements. Cascading Style Sheets (CSS) and the Extensible Markup Language (XML) • Document must pass through Working Draft. The team should be able to come up with the complete cost-benefit analysis and as the plan for the project will be an output of analysis. Discussions Notes. recorded telephone conversations. Candidate Recommendation and Proposed Recommendation phases before considered for W3C Recommendation Structure 3 Hosts • Massachusetts Institute of Technology (MIT) • European Research Consortium for Informatics and Mathematics (ERCIM) • Keio University of Japan 400 Members homepage at www. Online chat. if a company XYZ corp is in need of a web site to have its human resource details online. software. developers and testers to come up with a realistic plan. that it may not be too time consuming or with very less informative. Then. Waman. 1. of MCA. 4. towards the preliminary requirement analysis. The analysis should be done in the way.Hardware-software requirements. FAMT 4 .Cost involved 3. 2. people and data should be considered during the time of analysis. Dept. Input: Interviews with the clients. the analysis team may try to utilize the existing data about the employees from the present database. To achieve this analyst should consult the designers.Work plan.the approval 2. As the web site is going to be a part of a system.Team requirements. For example. how the web site or the web based application is going to help the present system and how the site is going to help the business. it needs a complete analysis as.org Goals User Interface Domain Technology and Society Domain Architecture Domain and Web Accessibility Initiatives • – • W3C – • • – W3C W3C – – – Web Development Cycle Like software. Output: 1. Mails and supporting docs by the client.w3.
In this case we may need to show them the interactivity of the application or site. FAMT 5 . Larger projects will require further levels of consultation to assess additional business and technical requirements. In parallel the Database team will sit and understand the requirements and develop the database with all the data structures and sample data will also be prepared. After reviewing and approving the preliminary document. fax and telephone Throughout the design phase the team should develop test plans and procedures for quality assurance. But in most of the cases customer may be interested in viewing two or three design with all images and navigation. site navigation and dynamic parts of the site should be included in the spec. Here normally the layouts and navigation will be designed as a prototype. Images and prototype 4. outlining the scope of the project including responsibilities. Some customers may be interested only in a full functional prototype. Design and development: After building the specification. timelines and costs. It is necessary to obtain client approval on design and project plans. and all the changes should be freezed before moving into the next phase. Waman. Content writing: Notes by Prof. There can be a lot of suggestions and changes from the customer side. Input: Reports from the analysis team Output: Complete requirement specifications representative to the individuals and the customer/customer's 3. a deposit. work on the web site is scheduled upon receipt of the signed proposal. The revisions could be redisplayed via the web for the customer to view. customer comments. of MCA.Introduction to Web Technology Sem-I Preliminary specifications are drawn up by covering up each and every element of the requirement. Input: Requirement specification Output: Site design with templates. For example if the product is a web site then the modules of the site including general layout. a written proposal is prepared. feedback and approvals can be communicated by e-mail. As needed. and any written content materials and graphics you wish to include. Dept.
Promotion: This phase is applicable only for web sites.Introduction to Web Technology Sem-I This phase is necessary mainly for the web sites. There are certain testing tools as well as some online testing tools which can help the testers to test their applications. supporting documents. The grammatical and spelling check should be over in this phase. frequent interaction with the developers and designers 7. of MCA. as they are very important for any web site. So the developer should understand the design and navigation. The end-user documentation can also be prepared by the coding team. Waman. Stress testing. then paid click and paid submissions can also be done with additional cost. Coding documents 6.g. Client mails mentioning the competitors Output: Site submission with necessary meta tag preparation Notes by Prof. Coding: Now its programmers turn to add his code without disturbing the design. in order to understand the design. For example its needed to test fast loading graphics and to calculate their loading time. Promotion needs preparation of meta tags. writes helps and manuals later. constant analysis and submitting the URL to the search engines and directories. as the applications will always function as a multi-user system with bandwidth limitations. If a team of developers is working they should use a CVS to control their sources. especially while using some form buttons. Input: Designed template Output: Site with formatted content 5. Integration testing. testing reports. If the site is dynamic then the code should utilize the template. For example ASP developers can use Microsoft's Web Application Test Tool to test the ASP applications. Content writers to add their text can utilize the design templates. Input: The site with forms and the requirement specification Output: Database driven functions with the site. Dept. which can be used by a technical writer who can understand them. The site promotion is normally an ongoing process as the strategies of search engine may change quite often. Input: Site with content. Some of the testing which should be done are. Both automated testing and manual testing should be done without fail. There are professional content developers who can write industry specific and relevant content for the site. Coding team should generate necessary testing plans as well as technical documentation. Submitting a site URLs once in 2 months can be an ideal submission policy. web based applications need intensive testing. If the customer is willing. The designer may need to develop some graphic buttons when ever the developer is in need. technical specifications and technical documents Output: Completed application/site. which is a free tool available from the Microsoft site to download. After doing all the testing a live testing is necessary for web sites and web based applications. resolution testing and crossbrowser compatibility testing. For example Java users can use JavaDoc to develop their documents to understand their code flow. error logs. Unlike traditional design the developer must know the interface and the code should not disturb the look and feel of the site or application. FAMT 6 . Requirement specifications. Testing: Unlike software. Links test) Input: The site. The developer may need to interact with the designer. Scalablity testing. After uploading the site there should be a complete testing (E. load testing.
images. the site can be navigated with ease. technical maintenance. using standardized technologies and formats/protocols that simplify the exchange and integration of large amounts of data over the Internet. In other words. Once your web site is operational. and the website can fulfill the role assigned to it by the business. The above-mentioned steps alone are not strict to web application or web site development. to sell to customers. In that case we need to do analysis again. They make it easier to conduct work across organizations regardless of the types of operating systems. Web Services Web services are automated information services that are conducted over the Internet. But even if you are a small development firm. viewing data in a Web service client. archived e-mail messages. visual or aural content that is encountered as part of the user experience on websites. and databases that are being used. re-Analysis reports Output: Updated application. And we include future stuff as well as present stuff. Bug fixes can be done during the time of maintenance. Web contents are therefore "king" for searching proper web site. It depends on the cost and time involved and the necessity. quality assurance. Input: Site/Application. that is.' This may include documents. ongoing promotion. Web Contents Web content is the textual. or to inform customers. Search engines can index text easily and if the information is close to what a searcher is seeking can be delivered as a site for the seeker of information.Introduction to Web Technology Sem-I 8. It may include. if you adopt certain planning along with this web engineering steps in mind. such as content author. Content management often means that within a business there is a range of people who have distinct roles to do with content management. Web contents can be 'the stuff in your Web site. they can be used in a number of ways such as populating Web sites. Some steps may not applicable for certain tasks. content/functions to be updated. notification and status. security. Web Publishing Web Publishing is a term that refers to using Web services as a query mechanism against local databases. applications. Other Web service types include data submission. Once these data services are deployed. Because websites are often complex. content management & updating. then there will be no site promotion. personal Web pages. staff training and mentoring is needed on a regular basis depend on the complexity of your web site and the needs within your organization. Maintenance and Updating: Web sites will need quite frequent updations to keep them very fresh. These data services publish databases as Web services in an XML format. audio and video files. supporting documents to other life cycle steps and teams. and Notes by Prof. a term "content management" appeared in the late 1990s identifying a method or in some cases a tool to organize all the diverse elements to be contained on a website. and more. and all the other life cycle steps will repeat. hardware/software. e-services. of MCA. Web content needs to be organized in such a manner to provide the reader (browser) with an overall "customer experience" that is easy to use. Dept. or building new sources of data into an integrated application. sounds. editor. videos and animations. Waman. Web publishing is a specific subset of the many possible types of Web services. data. or to market products and services. Currently search engines are text based and are one of the common way by which people locate sites of interest. publisher. among other things: text. Sometimes if it is a intranet site. images. it will definitely reflects in the Quality of the outcome. synchronizing data between sites. FAMT 7 . site visit activity reports. programming languages.
we see similar themes come up over and over again. While there is no simple answer to some of these issues. These kinds of pages can also use. Dynamic Website Types: Database driven Website e-Commerce Website e-Business Website Knowledge Base Website Jobs Database Resume Database Member-only sites Intranet Extranet Ajax is a newer web development technique for dynamically interchanging content with the server-side. Lastly.Introduction to Web Technology Sem-I Web pages that adhere to the second definition are often created with the help of server-side languages such as PHP. Whether it's the political struggle between a corporation's marketing department and information technology group over site ownership. Web Design Themes When discussing Web design.NET. Artists like Leonardo DaVinci certainly struggled at times to balance the desires of patrons and even his viewing public with his own needs. and the old designer trying to rediscover his or her innovative youth. without reloading the webpage.). These issues often result in rather heated discussions among designers. information structure. It will be valuable to introduce each here before we Notes by Prof. they are relatively easy to describe. the rules of convention and the desires of innovation are as common as the struggle of a young person rebelling against convention. Commercial artists producing something like a magazine advertisement or billboard have to balance the demands of visual look with successful and clear communication. and other languages. Execution varies in any discipline. these themes are at the heart of the matter. as well as between designers and their clients both inside and outside corporate Web teams. of MCA. but not limited to. Despite the general nature of these themes. these themes are not at all unique to the Web medium. but in one as young as Web design. These server-side languages typically use the Common Gateway Interface (CGI) to produce dynamic web pages. visual design. the first kind (DHTML. including. etc. on client-side. JSP. Generally the major themes behind modern Web design include: Designer needs versus user needs The balance of form and function The quality of execution The interplay between convention and innovation In the abstract sense. the effects are more evident. Perl. or a graphic designer trying to convince a client of the appropriateness of a particular look or multimedia technology. FAMT 9 . Dept. Web Design A multidisciplinary pursuit pertaining to the planning and production of Web sites. the middle age designer discovering the wisdom of the masters. their specific details vary with each medium. ASP or ASP. Google Maps is an example of a web application that uses Ajax techniques. and networked delivery. Waman. technical development.
Control over a visit to a site is an unwritten contract between the designer and the visitor to how the experience will unfold. They may not even have the same interests as you. You must accept the fact that many users will not necessarily have intimate knowledge of the site you have so carefully crafted. You have the optimal screen resolution. We start with the most important issue first: user-centered versus designercentered site design. Lastly. Remember. of MCA. usable Web site design is always trying to think from the point of view of the user. sites provide little user control. the key to successful. sites are built more for designers and their needs than for the site's actual users. forcing the user to view content in a predetermined order with little control over presentation or technology. it might seem appropriate to simply ask the users to design the site the way they want. Users are individuals with certain shared capacities and characteristics. memory. But what can we say about users? Is there a typical user? Does a "Joe Average Internet" exist that we should design our sites for? Probably not. where the site gives users ultimate control over visitation. a common mistake made in Web development is that. As a designer. browser setup. Rule: USERS are NOT DESIGNERS. but always under the influence of the designer's requirements. That said. such as reaction times. we will discuss this topic further in the next chapter. Dept. Unfortunately. you often will confuse the actual users of the site. What may seem easy to one user will be hard for another. but we certainly should consider certain traits. that while users may have similar basic characteristics. Basic Rules of web page design and layout Your web site should be easy to read Your web site should be easy to navigate Your web site should be easy to find Notes by Prof. Power users may find a site restrictive. allowing them to choose what to see and how to see it and even allowing them to add to or modify the site's contents. and so on. User-Focused Design A common theme of Web design is the focus on users. Users will not think carefully about the individual components of a Web site. Given the importance of the users' interests and desires. Users often have unrealistic requirements and expectations for sites. but account for differences. while novice users find it too difficult. most sites do allow the user some choices and the ability to control experience. When you build your site around your own visual characteristics and skill levels. they are also individuals. Rarely do we find the exact opposite occurs. You understand where information is.Introduction to Web Technology Sem-I encounter them later on. however. Always remember this important tenet of Web design: Rule: YOU are NOT the USER. FAMT 10 . Sites that are built for a "common" user may not meet the needs of all users. we can see that the differing needs of the user and the designer raise an issue of control. Waman. we should not expect users to be able to design Web sites just because they have browsed a multitude of sites. User-centered design is the term given to design that always puts the user first. Often. Rule: Design for the common user. What you understand is not what a user will understand. Just as it would seem foolish to let moviegoers attempt to direct a major motion picture on the basis of their having viewed numerous movies. as we design sites. users are not going to have the sophisticated understanding of the Web that a designer will have. Not everyone is or should be a Web designer. However. In summary. far too often. An overview of cognitive science helps us understand basic user capabilities. You understand how to install plug-ins. and other cognitive or physical abilities. you have intimate knowledge of a Web site.
Notes by Prof. People like to know that there is a person at the other end of a web site who can help them in the event that: 1. and email address). of MCA. fax numbers. letterhead. electronic magazines (e-zines) and links from other web sites. for some general guidelines. and most text (in the West) is left aligned. 2. set between small vertical lines. Your web site should be easy to navigate All of your hyperlinks should be clear to your visitors. Link colors in your text should be familiar to your visitor (blue text usually indicates an unvisited link and purple or maroon text usually indicates a visited link). a larger font size. banner advertising. and special effects on your web graphics very carefully. they will come. some element on your site is not working and end users need to be able to tell you about it. By giving all relevant contact information (physical address. award sites. If you are not familiar with any of these online terms." is still a commonly held belief among companies and organizations new to the Internet. radio. then it is best that you have your site promoted by an online marketing professional. Once you have created a web site. If you elect not to use the default colors. your text links should be emphasized in some other way (boldfaced. You want your visitors to be comfortable with what they are reading. Text links should be unique -. FAMT 11 . What to Look for in an Online Marketing Company. It is more important that your navigational buttons and tabs be easy to read and understand than to have "flashy" effects.) Web sites are promoted offline via the conventional advertising methods: print ads. textures. invoices. backgrounds. Your visitors should be able to find what they are looking for in your site within three clicks. Dark-colored text on a lightcolored background is easier to read than light-colored text on a dark-colored background. should have your URL printed on them. (See our section. Not only should your web site be easy to find. etc. envelopes. You don't want to use backgrounds that obscure your text or use colors that are hard to read. Center-aligned text is best used in headlines. Your web graphic designer should select the colors.they should not look the same as any other text in your web pages. they need answers to questions which are not readily available on your web site. they are very likely to click off your site as quickly as they clicked on. and 3. etc. All capitalized letters give the appearance of shouting at your visitors. such as buttons or tabs. if possible. Web sites are promoted online via search engines. Keep the alignment of your main text to the left. or a combination of these). directory editors need you to modify parts of your site to be sure that your site is placed in the most relevant category. They can contact you in the way that makes them feel the most comfortable. word-of-mouth. You also don't want to set your text size too small (hard to read) or too large (it will appear to shout at your visitors). should be clearly labeled and easy to read. "If I build a web site. television. telephone numbers. People will not come to your web site unless you promote your site both online and offline. Graphic images. all of your company's printed materials including business cards. Waman. not centered. Your web site should be easy to find How are your visitors finding you online? The myth. but your contact information should be easy to find. You do not want people clicking on your headings because they think the headings are links. you are also creating a sense of security for your end users. If not. directories. brochures. What does this mean? You should choose your text and background colors very carefully. Dept.Introduction to Web Technology Sem-I Your web page layout and design should be consistent throughout the site Your web site should be quick to download Your web site should be easy to read The most important rule in web design is that your web site should be easy to read.
Community sites These provide information or transaction-related facilities. need this consistency. or in some sense paying for. Sure. Dept. headings. which may include transactional. community. and sites that may not follow common Web conventions or have a welldefined economic purpose. it is best to keep your download time as short as possible. Notes by Prof. Color-coded web pages. and footers should remain consistent throughout your web site. then and ONLY then should animation be a consideration. For example. The attitude "I don't like how it looks" should always be secondary to your web site's function. Waman. personal Web spaces such as Web logs (also called blogs). FAMT 12 . and informational elements. Which is more important: creative expression/corporate image or running a successful business? Types of WebSites Informational sites These sites provide information about a particular subject or organization (the "brochureware" sites). should remain the same throughout your site. If your business does not have good brand name recognition. Community-based sites tend to focus on a particular topic or type of person and encourage interaction between likeminded individuals. We might also group sites based upon the organization that is running. Ecommerce sites fall into this category. Only the colors should change. of MCA. These are the most common Web sites on the Internet and often take on aspects of the other site categories over time. (Artists' pages should have a warning at the top of their pages. the site. whether it be a report or a set of web pages. Entertainment sites These sites are for game playing or some form of amusing interaction. but animation graphics tend to be large files. If the download time of your page is relatively short and the addition of animation does not unreasonably increase the download time of your page. Other sites Included here are artistic or experimental sites. A good application of this rule is adding animation to your site. you should consider all of the above rules FIRST and adapt your personal preferences accordingly. getting to web site such as Microsoft or Sun Microsystems is so difficult and time consuming that visitors will often try to access the sites during non-working hours from their homes. Link-colors should be consistent throughout your web pages. and the special effects on graphics should remain the same.) Even web sites that are marketed to high-end users need to consider download times. but focus on the interaction between the visitors of the site. project a professional image. all graphic images and elements. Finally. Within this type of categorization we see five major groupings: Commercial These sites provide information about a particular subject or organization (the "brochureware" sites). Test the download time of your pages first. Your web site should be quick to download Studies have indicated that visitors will quickly lose interest in your web site if the majority of a page does not download within 15 seconds. These are the most common Web sites on the Internet and often take on aspects of the other site categories over time. newsletter.Introduction to Web Technology Sem-I Your web page layout and design should be consistent throughout the site Just as in any document formatted on a word processor or as in any brochure. Sometimes. background effects. Typefaces and background colors. if you use a drop shadow as a special effect in your bullet points. Consistency and coherence in any document. in particular. you should use drop shadows in all of your bullets. animation looks "cool" and does initially catch your eye. too. alignment in the main text and the headings. Typefaces. Transactional sites This type of site can be used to conduct some transaction or task. before you consider the personal preferences of your web page design. typefaces. or newspaper formatted in a desktop publishing program.
Disadvantages: Download time is a big consideration in determining whether or not you should use navigation buttons. Most web sites we see use web graphics (buttons) as a navigation scheme. Graphic images . Waman. color. and you don't want people clicking off of your site waiting for all of your navigation buttons to download. Another advantage of using graphic images/navigation buttons is that as long as the navigation buttons have alternative text in the HTML code. FAMT 14 . If navigation buttons are used in conjunction with text links. your web site can still be navigated even if your visitors turn off the graphic images. The biggest advantage to using navigation buttons is that they give your visitors a visual representation of how to navigate your site right away. Advantages: Graphic images have visual appeal. Notes by Prof. Dept. then we recommend you do this. Many search engine optimization specialists recommend this combination for good search engine indexing. In general.navigation buttons Graphic images add uniqueness. of MCA. You don't want the main message of your site to be the navigation buttons. such as placing them in a colored table cell or a colored sidebar. you have multiple places to put keywords: both within the text link and the alternative text of the navigation buttons. you should keep the navigation buttons' file size to between 1K-5K in file size and dimensions between 60-165 pixels in width and 25-60 pixels in height.Introduction to Web Technology Sem-I from other sections of content. and personality to a web site. especially if the navigation buttons are visible on the top part of a computer screen. Peoples' eyes are naturally drawn to a splash of color and a change in dimension.
This action might not be possible to undo. Are you sure you want to continue?