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
The URLs of the pages organize them into a hierarchy. 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. and usually reside on the same physical server. FAMT 3 . address info. 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.Introduction to Web Technology Sem-I The pages of websites can usually be accessed from a common root URL called the homepage. 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. remaining portions still able to route packets • Transmission Control Protocol (TCP) – Name of protocols for communicating over ARPA net. Waman. 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. – 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. of MCA. Dept.
Waman.. Model sites/applications etc.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). Then. Mails and supporting docs by the client.Cost involved 3.w3. Online chat. software.Supporting documents and 6.the approval 2. people and data should be considered during the time of analysis. 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. it should be realistic. towards the preliminary requirement analysis. Dept. 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. 1. Analysis: Once a customer is started discussing his requirements. web sites can also be developed with certain methods with some changes and additions with the existing software development process. developers and testers to come up with a realistic plan.Team requirements.Work plan. Cascading Style Sheets (CSS) and the Extensible Markup Language (XML) • Document must pass through Working Draft.Hardware-software requirements. 2. Output: 1. that it may not be too time consuming or with very less informative. As the web site is going to be a part of a system. 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. Let us see the steps involve in any web site development. Input: Interviews with the clients. The analysis should be done in the way. To achieve this analyst should consult the designers. 4. Specification Building: Notes by Prof. For example. the team gets into it. all the present hardware. recorded telephone conversations. if a company XYZ corp is in need of a web site to have its human resource details online. Discussions Notes. the analysis team may try to utilize the existing data about the employees from the present database. The first important thing is finding the targeted audience. FAMT 4 .org Goals User Interface Domain Technology and Society Domain Architecture Domain and Web Accessibility Initiatives • – • W3C – • • – W3C W3C – – – Web Development Cycle Like software. Moreover the analysis should cover all the aspects especially on how the web site is going to join the existing system. it needs a complete analysis as. 5. of MCA.
As needed. feedback and approvals can be communicated by e-mail. FAMT 5 . Images and prototype 4. The revisions could be redisplayed via the web for the customer to view. Design and development: After building the specification. Larger projects will require further levels of consultation to assess additional business and technical requirements. and any written content materials and graphics you wish to include. 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. site navigation and dynamic parts of the site should be included in the spec. customer comments. There can be a lot of suggestions and changes from the customer side. work on the web site is scheduled upon receipt of the signed proposal. Dept. outlining the scope of the project including responsibilities. Some customers may be interested only in a full functional prototype. Input: Requirement specification Output: Site design with templates. In this case we may need to show them the interactivity of the application or site. a written proposal is prepared. Content writing: Notes by Prof. But in most of the cases customer may be interested in viewing two or three design with all images and navigation. Here normally the layouts and navigation will be designed as a prototype. After reviewing and approving the preliminary document. Input: Reports from the analysis team Output: Complete requirement specifications representative to the individuals and the customer/customer's 3. Waman. timelines and costs. of MCA. fax and telephone Throughout the design phase the team should develop test plans and procedures for quality assurance. a deposit. and all the changes should be freezed before moving into the next phase. It is necessary to obtain client approval on design and project plans.Introduction to Web Technology Sem-I Preliminary specifications are drawn up by covering up each and every element of the requirement. For example if the product is a web site then the modules of the site including general layout.
as the applications will always function as a multi-user system with bandwidth limitations. Both automated testing and manual testing should be done without fail. web based applications need intensive testing. Waman. Input: Designed template Output: Site with formatted content 5. which can be used by a technical writer who can understand them. Input: The site with forms and the requirement specification Output: Database driven functions with the site. frequent interaction with the developers and designers 7. error logs. For example ASP developers can use Microsoft's Web Application Test Tool to test the ASP applications.Introduction to Web Technology Sem-I This phase is necessary mainly for the web sites. Input: Site with content. The developer may need to interact with the designer. Some of the testing which should be done are. For example its needed to test fast loading graphics and to calculate their loading time. If the customer is willing. of MCA. There are certain testing tools as well as some online testing tools which can help the testers to test their applications. So the developer should understand the design and navigation. Scalablity testing. After uploading the site there should be a complete testing (E. Unlike traditional design the developer must know the interface and the code should not disturb the look and feel of the site or application. in order to understand the design. as they are very important for any web site. especially while using some form buttons. Coding team should generate necessary testing plans as well as technical documentation. The end-user documentation can also be prepared by the coding team. FAMT 6 . Stress testing. resolution testing and crossbrowser compatibility testing. The designer may need to develop some graphic buttons when ever the developer is in need. After doing all the testing a live testing is necessary for web sites and web based applications. The site promotion is normally an ongoing process as the strategies of search engine may change quite often. There are professional content developers who can write industry specific and relevant content for the site. If a team of developers is working they should use a CVS to control their sources.g. Submitting a site URLs once in 2 months can be an ideal submission policy. supporting documents. The grammatical and spelling check should be over in this phase. Promotion: This phase is applicable only for web sites. Content writers to add their text can utilize the design templates. then paid click and paid submissions can also be done with additional cost. Requirement specifications. Links test) Input: The site. Dept. Promotion needs preparation of meta tags. technical specifications and technical documents Output: Completed application/site. which is a free tool available from the Microsoft site to download. writes helps and manuals later. constant analysis and submitting the URL to the search engines and directories. If the site is dynamic then the code should utilize the template. 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. For example Java users can use JavaDoc to develop their documents to understand their code flow. testing reports. load testing. Testing: Unlike software. Coding documents 6. Integration testing.
Web Services Web services are automated information services that are conducted over the Internet. e-services. Once these data services are deployed. technical maintenance. such as content author. programming languages. Waman. supporting documents to other life cycle steps and teams. FAMT 7 . videos and animations. security. publisher. Because websites are often complex. synchronizing data between sites. Web Contents Web content is the textual. Once your web site is operational. images. to sell to customers. re-Analysis reports Output: Updated application. archived e-mail messages. or building new sources of data into an integrated application. 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. Web publishing is a specific subset of the many possible types of Web services. they can be used in a number of ways such as populating Web sites. In that case we need to do analysis again. Other Web service types include data submission. sounds. But even if you are a small development firm. Maintenance and Updating: Web sites will need quite frequent updations to keep them very fresh. content management & updating. Web contents are therefore "king" for searching proper web site. editor. images. Sometimes if it is a intranet site. Bug fixes can be done during the time of maintenance. and all the other life cycle steps will repeat. and databases that are being used. Web Publishing Web Publishing is a term that refers to using Web services as a query mechanism against local databases. that is. viewing data in a Web service client. It may include. These data services publish databases as Web services in an XML format. or to inform customers. Dept. using standardized technologies and formats/protocols that simplify the exchange and integration of large amounts of data over the Internet. the site can be navigated with ease. then there will be no site promotion. Web contents can be 'the stuff in your Web site. applications. visual or aural content that is encountered as part of the user experience on websites. Input: Site/Application. Content management often means that within a business there is a range of people who have distinct roles to do with content management. content/functions to be updated. 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. data. ongoing promotion. and the website can fulfill the role assigned to it by the business. staff training and mentoring is needed on a regular basis depend on the complexity of your web site and the needs within your organization.Introduction to Web Technology Sem-I 8. if you adopt certain planning along with this web engineering steps in mind. In other words. audio and video files. It depends on the cost and time involved and the necessity. it will definitely reflects in the Quality of the outcome. The above-mentioned steps alone are not strict to web application or web site development. of MCA. Some steps may not applicable for certain tasks. hardware/software.' This may include documents. quality assurance. And we include future stuff as well as present stuff. personal Web pages. among other things: text. notification and status. They make it easier to conduct work across organizations regardless of the types of operating systems. 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. Currently search engines are text based and are one of the common way by which people locate sites of interest. and more. site visit activity reports. or to market products and services.
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. While there is no simple answer to some of these issues. and the old designer trying to rediscover his or her innovative youth. the middle age designer discovering the wisdom of the masters. ASP or ASP. but not limited to. etc. the effects are more evident. we see similar themes come up over and over again. Waman. Execution varies in any discipline. Web Design A multidisciplinary pursuit pertaining to the planning and production of Web sites. Perl. of MCA. Commercial artists producing something like a magazine advertisement or billboard have to balance the demands of visual look with successful and clear communication. these themes are at the heart of the matter. on client-side.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. the rules of convention and the desires of innovation are as common as the struggle of a young person rebelling against convention. These kinds of pages can also use. including. Google Maps is an example of a web application that uses Ajax techniques. It will be valuable to introduce each here before we Notes by Prof. Whether it's the political struggle between a corporation's marketing department and information technology group over site ownership. information structure. Despite the general nature of these themes. and other languages. Artists like Leonardo DaVinci certainly struggled at times to balance the desires of patrons and even his viewing public with his own needs.). Dept. as well as between designers and their clients both inside and outside corporate Web teams. Lastly. or a graphic designer trying to convince a client of the appropriateness of a particular look or multimedia technology. 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. These server-side languages typically use the Common Gateway Interface (CGI) to produce dynamic web pages. without reloading the webpage. Web Design Themes When discussing Web design. but in one as young as Web design. their specific details vary with each medium. and networked delivery. FAMT 9 .NET. JSP. These issues often result in rather heated discussions among designers. the first kind (DHTML. visual design. these themes are not at all unique to the Web medium. they are relatively easy to describe. technical development.
Power users may find a site restrictive. we can see that the differing needs of the user and the designer raise an issue of control. What you understand is not what a user will understand. However. User-centered design is the term given to design that always puts the user first. however. You understand how to install plug-ins. sites are built more for designers and their needs than for the site's actual users. and other cognitive or physical abilities. the key to successful. browser setup. When you build your site around your own visual characteristics and skill levels. we will discuss this topic further in the next chapter. but we certainly should consider certain traits. memory. you often will confuse the actual users of the site. Users will not think carefully about the individual components of a Web site. You have the optimal screen resolution. Remember. That said. FAMT 10 . Not everyone is or should be a Web designer. Lastly. 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. As a designer.Introduction to Web Technology Sem-I encounter them later on. An overview of cognitive science helps us understand basic user capabilities. sites provide little user control. far too often. of MCA. and so on. Users often have unrealistic requirements and expectations for sites. What may seem easy to one user will be hard for another. forcing the user to view content in a predetermined order with little control over presentation or technology. 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. Users are individuals with certain shared capacities and characteristics. but always under the influence of the designer's requirements. We start with the most important issue first: user-centered versus designercentered site design. You must accept the fact that many users will not necessarily have intimate knowledge of the site you have so carefully crafted. but account for differences. Always remember this important tenet of Web design: Rule: YOU are NOT the USER. 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. Rule: Design for the common user. while novice users find it too difficult. Dept. we should not expect users to be able to design Web sites just because they have browsed a multitude of sites. most sites do allow the user some choices and the ability to control experience. User-Focused Design A common theme of Web design is the focus on users. Given the importance of the users' interests and desires. you have intimate knowledge of a Web site. Sites that are built for a "common" user may not meet the needs of all users. a common mistake made in Web development is that. In summary. as we design sites. Rarely do we find the exact opposite occurs. Control over a visit to a site is an unwritten contract between the designer and the visitor to how the experience will unfold. Rule: USERS are NOT DESIGNERS. where the site gives users ultimate control over visitation. it might seem appropriate to simply ask the users to design the site the way they want. they are also individuals. such as reaction times. Often. that while users may have similar basic characteristics. You understand where information is. usable Web site design is always trying to think from the point of view of the user. Unfortunately. users are not going to have the sophisticated understanding of the Web that a designer will have. 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. Waman. They may not even have the same interests as you.
Keep the alignment of your main text to the left. Web sites are promoted online via search engines. 2. You don't want to use backgrounds that obscure your text or use colors that are hard to read. for some general guidelines. People will not come to your web site unless you promote your site both online and offline. and most text (in the West) is left aligned. They can contact you in the way that makes them feel the most comfortable. 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). Your web site should be easy to navigate All of your hyperlinks should be clear to your visitors. such as buttons or tabs. letterhead. If not. Your web graphic designer should select the colors. FAMT 11 . directory editors need you to modify parts of your site to be sure that your site is placed in the most relevant category. you are also creating a sense of security for your end users. word-of-mouth. all of your company's printed materials including business cards. and special effects on your web graphics very carefully. It is more important that your navigational buttons and tabs be easy to read and understand than to have "flashy" effects. 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." is still a commonly held belief among companies and organizations new to the Internet. What to Look for in an Online Marketing Company. award sites. of MCA. set between small vertical lines. By giving all relevant contact information (physical address. television. envelopes. "If I build a web site.they should not look the same as any other text in your web pages. electronic magazines (e-zines) and links from other web sites. You do not want people clicking on your headings because they think the headings are links. directories. Text links should be unique -. Dark-colored text on a lightcolored background is easier to read than light-colored text on a dark-colored background. banner advertising. Your visitors should be able to find what they are looking for in your site within three clicks. they need answers to questions which are not readily available on your web site. they will come. if possible. some element on your site is not working and end users need to be able to tell you about it. should have your URL printed on them. 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). Graphic images. Your web site should be easy to find How are your visitors finding you online? The myth.) Web sites are promoted offline via the conventional advertising methods: print ads. Not only should your web site be easy to find. telephone numbers. Notes by Prof. What does this mean? You should choose your text and background colors very carefully. or a combination of these). not centered. Waman. backgrounds. etc. Once you have created a web site. Center-aligned text is best used in headlines. If you are not familiar with any of these online terms. your text links should be emphasized in some other way (boldfaced. and 3. and email address). Dept. (See our section. fax numbers.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. If you elect not to use the default colors. invoices. radio. should be clearly labeled and easy to read. but your contact information should be easy to find. textures. brochures. You want your visitors to be comfortable with what they are reading. a larger font size. then it is best that you have your site promoted by an online marketing professional. All capitalized letters give the appearance of shouting at your visitors. etc. they are very likely to click off your site as quickly as they clicked on.
Test the download time of your pages first. (Artists' pages should have a warning at the top of their pages. Other sites Included here are artistic or experimental sites. Only the colors should change. whether it be a report or a set of web pages. Dept.) Even web sites that are marketed to high-end users need to consider download times. project a professional image. Sure. and sites that may not follow common Web conventions or have a welldefined economic purpose. 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. We might also group sites based upon the organization that is running. Entertainment sites These sites are for game playing or some form of amusing interaction. For example. Within this type of categorization we see five major groupings: Commercial These sites provide information about a particular subject or organization (the "brochureware" sites). in particular. 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. you should consider all of the above rules FIRST and adapt your personal preferences accordingly. A good application of this rule is adding animation to your site. Color-coded web pages. and informational elements. These are the most common Web sites on the Internet and often take on aspects of the other site categories over time.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. need this consistency. 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. then and ONLY then should animation be a consideration. personal Web spaces such as Web logs (also called blogs). Ecommerce sites fall into this category. Finally. Typefaces and background colors. newsletter. If your business does not have good brand name recognition. Waman. 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). FAMT 12 . Community sites These provide information or transaction-related facilities. but animation graphics tend to be large files. of MCA. too. all graphic images and elements. Typefaces. background effects. you should use drop shadows in all of your bullets. and the special effects on graphics should remain the same. which may include transactional. before you consider the personal preferences of your web page design. alignment in the main text and the headings. or newspaper formatted in a desktop publishing program. should remain the same throughout your site. the site. Notes by Prof. The attitude "I don't like how it looks" should always be secondary to your web site's function. but focus on the interaction between the visitors of the site. community. if you use a drop shadow as a special effect in your bullet points. Sometimes. Community-based sites tend to focus on a particular topic or type of person and encourage interaction between likeminded individuals. or in some sense paying for. These are the most common Web sites on the Internet and often take on aspects of the other site categories over time. Consistency and coherence in any document. typefaces. Transactional sites This type of site can be used to conduct some transaction or task. headings. it is best to keep your download time as short as possible. animation looks "cool" and does initially catch your eye. Link-colors should be consistent throughout your web pages. and footers should remain consistent throughout your web site.
Most web sites we see use web graphics (buttons) as a navigation scheme. In general. The biggest advantage to using navigation buttons is that they give your visitors a visual representation of how to navigate your site right away. Peoples' eyes are naturally drawn to a splash of color and a change in dimension.Introduction to Web Technology Sem-I from other sections of content. FAMT 14 . Graphic images . Dept. and you don't want people clicking off of your site waiting for all of your navigation buttons to download. color. you have multiple places to put keywords: both within the text link and the alternative text of the navigation buttons. such as placing them in a colored table cell or a colored sidebar. Notes by Prof. If navigation buttons are used in conjunction with text links.navigation buttons Graphic images add uniqueness. 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. Advantages: Graphic images have visual appeal. You don't want the main message of your site to be the navigation buttons. then we recommend you do this. Disadvantages: Download time is a big consideration in determining whether or not you should use navigation buttons. and personality to a web site. Another advantage of using graphic images/navigation buttons is that as long as the navigation buttons have alternative text in the HTML code. especially if the navigation buttons are visible on the top part of a computer screen. Waman. Many search engine optimization specialists recommend this combination for good search engine indexing. your web site can still be navigated even if your visitors turn off the graphic images. of MCA.
This action might not be possible to undo. Are you sure you want to continue?