Introduction to Web Technology Sem-I

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

Introduction to Web Technology Sem-I

Single statements can be written to accomplish substantial tasks Translator programs called compilers Allow programmers to write instructions almost like every-day English Example: grossPay = basePay + overTimePay Much more desirable from programmers standpoint Specific languages include C, C++, Visual Basic and Java Scripting languages: JavaScript, VBScript and Perl Among most powerful and widely used languages today Interpreter programs developed to execute high-level programs without compiling Popular in program development environments Once program developed, compiled version made

What is the WWW? Number of computers connected with each other A distributed document delivery system Uses a client-server model Main presentation language is HTML Client-Server Model Two processes (possibly networked): Web Clients Use HTTP protocol to connect to servers Request and display Web pages stored in servers Typical clients: Web browsers Web Servers Listen for incoming connections from clients Use HTTP protocol to converse with clients Store and transmit Web pages to clients

A website (alternatively, web site or Web site) is a collection of Web pages, images, videos or other digital assets that is hosted on one or more web servers, usually accessible via the Internet. A Web page is a document, typically written in HTML, which is almost always accessible via HTTP, protocol that transfers information from the Web server to display in the user's Web browser. All publicly accessible websites are seen collectively as constituting the "World Wide Web".

Notes by Prof. Waman, Dept. of MCA, FAMT

Introduction to Web Technology Sem-I

The pages of websites can usually be accessed from a common root URL called the homepage, and usually reside on the same physical server. The URLs of the pages organize them into a hierarchy, 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. History of the Internet ARPANET Implemented in late 1960s by ARPA (Advanced Research Projects Agency of DOD) Networked computer systems of a dozen universities and institutions with 56KB communications lines Grandparent of todays Internet Intended to allow computers to be shared Became clear that key benefit was allowing fast communication between researchers electronic-mail (email) ARPAs 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, address info, 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, remaining portions still able to route packets Transmission Control Protocol (TCP) Name of protocols for communicating over ARPA net. 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. Waman, Dept. of MCA, FAMT 3

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), Cascading Style Sheets (CSS) and the Extensible Markup Language (XML) Document must pass through Working Draft, 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.w3.org Goals User Interface Domain Technology and Society Domain Architecture Domain and Web Accessibility Initiatives

W3C

W3C W3C

Web Development Cycle Like software, web sites can also be developed with certain methods with some changes and additions with the existing software development process. Let us see the steps involve in any web site development. 1. Analysis: Once a customer is started discussing his requirements, the team gets into it, towards the preliminary requirement analysis. As the web site is going to be a part of a system, it needs a complete analysis as, 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. Moreover the analysis should cover all the aspects especially on how the web site is going to join the existing system. The first important thing is finding the targeted audience. Then, all the present hardware, software, people and data should be considered during the time of analysis. For example, if a company XYZ corp is in need of a web site to have its human resource details online, the analysis team may try to utilize the existing data about the employees from the present database. The analysis should be done in the way, that it may not be too time consuming or with very less informative. 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, it should be realistic. To achieve this analyst should consult the designers, developers and testers to come up with a realistic plan. Input: Interviews with the clients, Mails and supporting docs by the client, Discussions Notes, Online chat, recorded telephone conversations, Model sites/applications etc., Output: 1.Work plan, 2.Cost involved 3.Team requirements, 4.Hardware-software requirements, 5.Supporting documents and 6.the approval 2. Specification Building: Notes by Prof. Waman, Dept. of MCA, FAMT 4

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, site navigation and dynamic parts of the site should be included in the spec. Larger projects will require further levels of consultation to assess additional business and technical requirements. After reviewing and approving the preliminary document, a written proposal is prepared, outlining the scope of the project including responsibilities, timelines and costs. Input: Reports from the analysis team Output: Complete requirement specifications representative

to

the

individuals

and

the

customer/customer's

3. Design and development: After building the specification, work on the web site is scheduled upon receipt of the signed proposal, a deposit, and any written content materials and graphics you wish to include. Here normally the layouts and navigation will be designed as a prototype. Some customers may be interested only in a full functional prototype. In this case we may need to show them the interactivity of the application or site. But in most of the cases customer may be interested in viewing two or three design with all images and navigation. There can be a lot of suggestions and changes from the customer side, and all the changes should be freezed before moving into the next phase. The revisions could be redisplayed via the web for the customer to view. As needed, customer comments, feedback and approvals can be communicated by e-mail, fax and telephone Throughout the design phase the team should develop test plans and procedures for quality assurance. It is necessary to obtain client approval on design and project plans. 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. Input: Requirement specification Output: Site design with templates, Images and prototype

4. Content writing: Notes by Prof. Waman, Dept. of MCA, FAMT 5

Introduction to Web Technology Sem-I

This phase is necessary mainly for the web sites. There are professional content developers who can write industry specific and relevant content for the site. Content writers to add their text can utilize the design templates. The grammatical and spelling check should be over in this phase. Input: Designed template Output: Site with formatted content 5. Coding: Now its programmers turn to add his code without disturbing the design. Unlike traditional design the developer must know the interface and the code should not disturb the look and feel of the site or application. So the developer should understand the design and navigation. If the site is dynamic then the code should utilize the template. The developer may need to interact with the designer, in order to understand the design. The designer may need to develop some graphic buttons when ever the developer is in need, especially while using some form buttons. If a team of developers is working they should use a CVS to control their sources. Coding team should generate necessary testing plans as well as technical documentation. For example Java users can use JavaDoc to develop their documents to understand their code flow. The end-user documentation can also be prepared by the coding team, which can be used by a technical writer who can understand them, writes helps and manuals later. Input: The site with forms and the requirement specification Output: Database driven functions with the site, Coding documents 6. Testing: Unlike software, web based applications need intensive testing, as the applications will always function as a multi-user system with bandwidth limitations. Some of the testing which should be done are, Integration testing, Stress testing, Scalablity testing, load testing, resolution testing and crossbrowser compatibility testing. Both automated testing and manual testing should be done without fail. For example its needed to test fast loading graphics and to calculate their loading time, as they are very important for any web site. There are certain testing tools as well as some online testing tools which can help the testers to test their applications. For example ASP developers can use Microsoft's Web Application Test Tool to test the ASP applications, 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. After uploading the site there should be a complete testing (E.g. Links test) Input: The site, Requirement specifications, supporting documents, technical specifications and technical documents Output: Completed application/site, testing reports, error logs, frequent interaction with the developers and designers 7. Promotion: This phase is applicable only for web sites. Promotion needs preparation of meta tags, constant analysis and submitting the URL to the search engines and directories. The site promotion is normally an ongoing process as the strategies of search engine may change quite often. Submitting a site URLs once in 2 months can be an ideal submission policy. If the customer is willing, then paid click and paid submissions can also be done with additional cost. Input: Site with content, Client mails mentioning the competitors Output: Site submission with necessary meta tag preparation

Notes by Prof. Waman, Dept. of MCA, FAMT

Introduction to Web Technology Sem-I

8. Maintenance and Updating: Web sites will need quite frequent updations to keep them very fresh. In that case we need to do analysis again, and all the other life cycle steps will repeat. Bug fixes can be done during the time of maintenance. Once your web site is operational, ongoing promotion, technical maintenance, content management & updating, site visit activity reports, staff training and mentoring is needed on a regular basis depend on the complexity of your web site and the needs within your organization. Input: Site/Application, content/functions to be updated, re-Analysis reports Output: Updated application, supporting documents to other life cycle steps and teams. The above-mentioned steps alone are not strict to web application or web site development. Some steps may not applicable for certain tasks. It depends on the cost and time involved and the necessity. Sometimes if it is a intranet site, then there will be no site promotion. But even if you are a small development firm, if you adopt certain planning along with this web engineering steps in mind, it will definitely reflects in the Quality of the outcome. Web Publishing Web Publishing is a term that refers to using Web services as a query mechanism against local databases. These data services publish databases as Web services in an XML format. Once these data services are deployed, they can be used in a number of ways such as populating Web sites, synchronizing data between sites, viewing data in a Web service client, or building new sources of data into an integrated application. In other words, Web publishing is a specific subset of the many possible types of Web services. Other Web service types include data submission, security, quality assurance, notification and status. Web Services Web services are automated information services that are conducted over the Internet, using standardized technologies and formats/protocols that simplify the exchange and integration of large amounts of data over the Internet. They make it easier to conduct work across organizations regardless of the types of operating systems, hardware/software, programming languages, and databases that are being used. Web Contents Web content is the textual, visual or aural content that is encountered as part of the user experience on websites. It may include, among other things: text, images, sounds, videos and animations. Web contents can be 'the stuff in your Web site.' This may include documents, data, applications, e-services, images, audio and video files, personal Web pages, archived e-mail messages, and more. And we include future stuff as well as present stuff. 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, the site can be navigated with ease, and the website can fulfill the role assigned to it by the business, that is, to sell to customers, or to market products and services, or to inform customers. Currently search engines are text based and are one of the common way by which people locate sites of interest. 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 contents are therefore "king" for searching proper web site. Because websites are often complex, 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. Content management often means that within a business there is a range of people who have distinct roles to do with content management, such as content author, editor, publisher, and Notes by Prof. Waman, Dept. of MCA, FAMT 7

Introduction to Web Technology Sem-I

administrator. But it also means there may be a content management system whereby each of the different roles are organized whereby to provide their assistance in operating the system and organizing the information for a website. Roughly speaking, there are two kinds of Web sites: those with static content and those with dynamically generated content. These are also called static Web sites and dynamic Web sites, or Web sites with static pages versus Web sites with dynamic pages. Static Web Page A static Web page is a Web page that always comprises the same information in response to all download requests from all users. Contrast with Dynamic web page. It displays the same information for all users, from all contexts, providing the classical hypertext, where navigation is performed through "static" documents. Such Web site usually costs less when initially developed, but then all future changes still have to be done by Web professionals. Therefore a static Web site can be more expensive to maintain, especially when you want to make frequent changes to your site. Advantages Quick and easy to put together, even by someone who doesn't have much experience. Ideal for demonstrating how a site will look. Cache friendly, one copy can be shown to many people. Disadvantages Difficult to maintain when a site gets large. Difficult to keep consistent and up to date. Offers little visitor personalization (all would have to be client side). Dynamic Web Sites In the case of dynamic Web sites (database-driven Web sites, or Web applications), page content is generated based on some information usually stored in a database or resulting from processing the inputs provided by the Web site visitor. On the other hand, pages in a dynamic-content Web site are constructed "on the fly" when a page is requested from a Web browser. Dynamic-content Web site, while still developed by professionals, can be maintained directly by you, our customer. Such Web site initially costs more to develop, but then you don't have to pay Web professionals every time you need to change something on your site. If you plan to make frequent changes to your site, you most likely will be better off with a dynamic Web site. There are two ways to create this kind of interactivity: 1. Using client-side scripting to change interface behaviors within a specific web page, in response to mouse or keyboard actions or at specified timing events. In this case the dynamic behavior occurs within the presentation. 2. Using server-side scripting to change the supplied page source between pages, adjusting the sequence or reload of the web pages or web content supplied to the browser. Server responses may be determined by such conditions as data in a posted HTML form, parameters in the URL, the type of browser being used, the passage of time, or a database or server state. The result of either technique is described as a dynamic web page, and both may be used simultaneously. To adhere to the first definition, web pages must use presentation technology called, in a broader sense, rich interfaced pages. Client-side scripting languages like JavaScript or ActionScript, used for Dynamic HTML (DHTML) and Flash technologies, are frequently used to orchestrate media types (sound, animations, changing text, etc.) of the presentation. The scripting also allows use of remote scripting, a technique by which the DHTML page requests additional information from a server, using a hidden Frame, XMLHttpRequests, or a Web service. Notes by Prof. Waman, Dept. of MCA, FAMT 8

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, Perl, ASP or ASP.NET, JSP, and other languages. These server-side languages typically use the Common Gateway Interface (CGI) to produce dynamic web pages. These kinds of pages can also use, on client-side, the first kind (DHTML, etc.). 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, without reloading the webpage. Google Maps is an example of a web application that uses Ajax techniques. Web Design A multidisciplinary pursuit pertaining to the planning and production of Web sites, including, but not limited to, technical development, information structure, visual design, and networked delivery. Web Design Themes When discussing Web design, we see similar themes come up over and over again. Whether it's the political struggle between a corporation's marketing department and information technology group over site ownership, or a graphic designer trying to convince a client of the appropriateness of a particular look or multimedia technology, these themes are at the heart of the matter. These issues often result in rather heated discussions among designers, as well as between designers and their clients both inside and outside corporate Web teams. While there is no simple answer to some of these issues, they are relatively easy to describe. 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, these themes are not at all unique to the Web medium. Artists like Leonardo DaVinci certainly struggled at times to balance the desires of patrons and even his viewing public with his own needs. Commercial artists producing something like a magazine advertisement or billboard have to balance the demands of visual look with successful and clear communication. Execution varies in any discipline, but in one as young as Web design, the effects are more evident. Lastly, the rules of convention and the desires of innovation are as common as the struggle of a young person rebelling against convention, the middle age designer discovering the wisdom of the masters, and the old designer trying to rediscover his or her innovative youth. Despite the general nature of these themes, their specific details vary with each medium. It will be valuable to introduce each here before we

Notes by Prof. Waman, Dept. of MCA, FAMT

Introduction to Web Technology Sem-I

encounter them later on. We start with the most important issue first: user-centered versus designercentered site design. User-Focused Design A common theme of Web design is the focus on users. Unfortunately, a common mistake made in Web development is that, far too often, sites are built more for designers and their needs than for the site's actual users. Always remember this important tenet of Web design: Rule: YOU are NOT the USER. What you understand is not what a user will understand. As a designer, you have intimate knowledge of a Web site. You understand where information is. You understand how to install plug-ins. You have the optimal screen resolution, browser setup, and so on. When you build your site around your own visual characteristics and skill levels, you often will confuse the actual users of the site. You must accept the fact that many users will not necessarily have intimate knowledge of the site you have so carefully crafted. They may not even have the same interests as you. Given the importance of the users' interests and desires, it might seem appropriate to simply ask the users to design the site the way they want. Rule: USERS are NOT DESIGNERS. Not everyone is or should be a Web designer. 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, we should not expect users to be able to design Web sites just because they have browsed a multitude of sites. Users often have unrealistic requirements and expectations for sites. Users will not think carefully about the individual components of a Web site. In summary, users are not going to have the sophisticated understanding of the Web that a designer will have. That said, the key to successful, usable Web site design is always trying to think from the point of view of the user. User-centered design is the term given to design that always puts the user first. 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, but we certainly should consider certain traits, such as reaction times, memory, and other cognitive or physical abilities, as we design sites. An overview of cognitive science helps us understand basic user capabilities; we will discuss this topic further in the next chapter. Remember, however, that while users may have similar basic characteristics, they are also individuals. What may seem easy to one user will be hard for another. Sites that are built for a "common" user may not meet the needs of all users. Power users may find a site restrictive, while novice users find it too difficult. Users are individuals with certain shared capacities and characteristics. Rule: Design for the common user, but account for differences. Lastly, we can see that the differing needs of the user and the designer raise an issue of control. Control over a visit to a site is an unwritten contract between the designer and the visitor to how the experience will unfold. Often, sites provide little user control, forcing the user to view content in a predetermined order with little control over presentation or technology. Rarely do we find the exact opposite occurs, where the site gives users ultimate control over visitation, 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. However, most sites do allow the user some choices and the ability to control experience, but always under the influence of the designer's requirements. 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, Dept. of MCA, FAMT 10

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. What does this mean? You should choose your text and background colors very carefully. You don't want to use backgrounds that obscure your text or use colors that are hard to read. Dark-colored text on a lightcolored background is easier to read than light-colored text on a dark-colored background. 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). All capitalized letters give the appearance of shouting at your visitors. Keep the alignment of your main text to the left, not centered. Center-aligned text is best used in headlines. You want your visitors to be comfortable with what they are reading, and most text (in the West) is left aligned. Your web site should be easy to navigate All of your hyperlinks should be clear to your visitors. Graphic images, such as buttons or tabs, should be clearly labeled and easy to read. Your web graphic designer should select the colors, backgrounds, textures, 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. 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), if possible. If you elect not to use the default colors, your text links should be emphasized in some other way (boldfaced, a larger font size, set between small vertical lines, or a combination of these). Text links should be unique -- they should not look the same as any other text in your web pages. You do not want people clicking on your headings because they think the headings are links. Your visitors should be able to find what they are looking for in your site within three clicks. If not, they are very likely to click off your site as quickly as they clicked on. Your web site should be easy to find How are your visitors finding you online? The myth, "If I build a web site, they will come," is still a commonly held belief among companies and organizations new to the Internet. People will not come to your web site unless you promote your site both online and offline. Web sites are promoted online via search engines, directories, award sites, banner advertising, electronic magazines (e-zines) and links from other web sites. If you are not familiar with any of these online terms, then it is best that you have your site promoted by an online marketing professional. (See our section, What to Look for in an Online Marketing Company, for some general guidelines.) Web sites are promoted offline via the conventional advertising methods: print ads, radio, television, brochures, word-of-mouth, etc. Once you have created a web site, all of your company's printed materials including business cards, letterhead, envelopes, invoices, etc. should have your URL printed on them. Not only should your web site be easy to find, but your contact information should be easy to find. 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. they need answers to questions which are not readily available on your web site; 2. some element on your site is not working and end users need to be able to tell you about it, and 3. directory editors need you to modify parts of your site to be sure that your site is placed in the most relevant category. By giving all relevant contact information (physical address, telephone numbers, fax numbers, and email address), you are also creating a sense of security for your end users. They can contact you in the way that makes them feel the most comfortable. Notes by Prof. Waman, Dept. of MCA, FAMT 11

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, newsletter, or newspaper formatted in a desktop publishing program, all graphic images and elements, typefaces, headings, and footers should remain consistent throughout your web site. Consistency and coherence in any document, whether it be a report or a set of web pages, project a professional image. For example, if you use a drop shadow as a special effect in your bullet points, you should use drop shadows in all of your bullets. Link-colors should be consistent throughout your web pages. Typefaces and background colors, too, should remain the same throughout your site. Color-coded web pages, in particular, need this consistency. Typefaces, alignment in the main text and the headings, background effects, and the special effects on graphics should remain the same. Only the colors should change. 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. (Artists' pages should have a warning at the top of their pages.) Even web sites that are marketed to high-end users need to consider download times. Sometimes, 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. If your business does not have good brand name recognition, it is best to keep your download time as short as possible. A good application of this rule is adding animation to your site. Sure, animation looks "cool" and does initially catch your eye, but animation graphics tend to be large files. Test the download time of your pages first. 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. Finally, before you consider the personal preferences of your web page design, you should consider all of the above rules FIRST and adapt your personal preferences accordingly. The attitude "I don't like how it looks" should always be secondary to your web site's function. 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). These are the most common Web sites on the Internet and often take on aspects of the other site categories over time. Transactional sites This type of site can be used to conduct some transaction or task. Ecommerce sites fall into this category. Community sites These provide information or transaction-related facilities, but focus on the interaction between the visitors of the site. Community-based sites tend to focus on a particular topic or type of person and encourage interaction between likeminded individuals. Entertainment sites These sites are for game playing or some form of amusing interaction, which may include transactional, community, and informational elements. Other sites Included here are artistic or experimental sites, personal Web spaces such as Web logs (also called blogs), and sites that may not follow common Web conventions or have a welldefined economic purpose. We might also group sites based upon the organization that is running, or in some sense paying for, the site. Within this type of categorization we see five major groupings: Commercial These sites provide information about a particular subject or organization (the "brochureware" sites). These are the most common Web sites on the Internet and often take on aspects of the other site categories over time.

Notes by Prof. Waman, Dept. of MCA, FAMT

12

Introduction to Web Technology Sem-I

Government This type of site can be used to conduct some transaction or task. E-commerce sites fall into this category. Educational These provide information or transaction-related facilities, but focus on the interaction between the visitors of the site. Community-based sites tend to focus on a particular topic or type of person and encourage interaction between likeminded individuals. Charitable These sites are for game playing or some form of amusing interaction, which may include transactional, community, and informational elements. Personal Included here are artistic or experimental sites, personal Web spaces such as Web logs (also called blogs), and sites that may not follow common Web conventions or have a welldefined economic purpose.

Categorization can be difficult. For example, educational sites might really fall under the governmental category. Some sites in the personal category may arguably belong in the charitable or commercial group, depending on the reason for the person putting the site together. Now we turn to the more visual characteristics of sites, with a few sample categories of sites commonly seen on the Web. (Extra point) Navigation schemes in web site design As web site designers, we always try to create a web site navigation scheme that (a) is consistent throughout the entire web site and (b) Allows the site's visitors to find what they are searching for quickly and easily. A consistent site navigation scheme shows your potential customers that you are thinking about their ease of finding your products or services on your web site. The following list shows some basic web site navigation schemes: Text links Graphic images - navigation buttons Graphic images - image maps Drop-down Menus - Javascript, CGI, etc. Dynamically generated URLs Text Links Many web newbie understand that blue, underlined text is a hyperlink. For this reason, we think that it's generally a good idea to include text links in your web site design along with other graphic images. The link colors in your text should be familiar to your visitor, if possible. Blue text usually indicates an unvisited link and purple or maroon text usually indicates a visited link. If you elect not to use the default colors, your text links should be emphasized in some other way: boldfaced, a larger font size, set between small vertical lines or square brackets, or a combination of these. Text links should be unique they should not look the same as any other text in your web pages. You do not want people clicking on your headings because they think the headings are links. Advantages: The biggest advantage of using text links is the quick download time. If you are using large (in K) graphic images on your web pages, then it might be best to have a navigation scheme of text links. The other advantage of text links is that some of the text can be keywords. Disadvantages: The biggest disadvantage of text links is that they can be boring to look at, especially if you have a large amount of blue links sprinkled throughout your web pages. People like simplicity and ease of navigation. Thus, if there is a way to make your text links more visually appealing and easy to discern

Notes by Prof. Waman, Dept. of MCA, FAMT

13

Introduction to Web Technology Sem-I

from other sections of content, such as placing them in a colored table cell or a colored sidebar, then we recommend you do this. Graphic images - navigation buttons Graphic images add uniqueness, color, and personality to a web site. Most web sites we see use web graphics (buttons) as a navigation scheme. Advantages: Graphic images have visual appeal. Peoples' eyes are naturally drawn to a splash of color and a change in dimension. The biggest advantage to using navigation buttons is that they give your visitors a visual representation of how to navigate your site right away, especially if the navigation buttons are visible on the top part of a computer screen. Another advantage of using graphic images/navigation buttons is that as long as the navigation buttons have alternative text in the HTML code, your web site can still be navigated even if your visitors turn off the graphic images. If navigation buttons are used in conjunction with text links, you have multiple places to put keywords: both within the text link and the alternative text of the navigation buttons. Many search engine optimization specialists recommend this combination for good search engine indexing. Disadvantages: Download time is a big consideration in determining whether or not you should use navigation buttons. In general, 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. You don't want the main message of your site to be the navigation buttons, and you don't want people clicking off of your site waiting for all of your navigation buttons to download.

Notes by Prof. Waman, Dept. of MCA, FAMT

14