A PROJECT REPORT ON

Undertaken At Certifications Management and System Technologies (P) LTD,Chandigarh

For the Partial Fulfillment of The Diploma in CSE of SESSION (2009-2012) Submitted By MANIK SINGLA(009686276502) JATINDER SINGH(009686207406) Under the Expert Guidance Of Mr. Arvind kumar

Submitted At SUSPC TANGORI (Punjab)

Punjab Technical University, Jalandhar

PREFACE
The project name as 10GURUS is running under HTML,DHTML,DREAMWEAVER,FLASH . The tables and flowcharts are made in the project keeps the information how a whole project has to face each phase of differ conditions. Color photographs have been added to improve the explanatory value of the project. Training in CMS technology is a learning experience, which helps to improve my technical as well as practical knowledge in the technical field.

ACKNOWLEDGEMENT
We take this opportunity to express our profound sense of gratitude and respect to all those who helped us throughout the duration of our project. First of all we acknowledge the role of our respected Faculties, who have played a significant role in shaping our career. We express our profound gratitude to Mrs. Gurpreet Chahal HOD (Comp. Dept.), who have been a source of perpetual inspiration to us and all the Faculties for gently guiding and paving our way towards a bright career, throughout our Diploma course. It is my proud privilege to express my profound indebtedness of gratitude from core of my heart to my training incharge Mr. Arvind kumar who has been kind to give me inspiring advice, rich experience, valuable learned guidance and unfailing interact. I would also like to thank all my Seniors to providing us with the required information and help during our project. This letter of thanks would be incomplete if we missed out the mention of our friends & family members. We are very thankful to our Parents, which have been a constant source of inspiration for us from the very starting of our life. Submitted By MANIK SINGLA(009686276502) JATINDER SINGH (009686207406)

CERTIFICATE
This is to certify that Manik Singla, Jatinder Singh , a student of Diploma in Computer Science from Saheed Udham Singh Pol. College, Tangori, affiliated from Punjab Technical University,Jalandhar (Punjab), is undergoing his project training at Certifications Management and System Technologies(P) LTD,Chandigarh, from 1-06-2011 to 15-07-2011 in

partial fulfillment of the requirement for the in Diploma in CSE. The project work entitled 10 Gurus embodies the original work done by her during her above training period.

This provisional certificate is issued for the purpose of submission of project report at her institute. The final certificate will be issued after successful completion & implementation of the project.

Mr. Arvind Kumar (Project Guide)

CONTENTS

SR. No. 1 2 3 4

TITLE HTML DHTML DREAME WEAVER FLASH

PAGE NO.

COMPANY PROFILE
About CMS technologies (P) LTD.

India has a large and fast growing computer industry and users globally. So far this growth and potential has often been misrepresented as meaning the opening-up of the floodgates of employment opportunities, where any and every type of person will find a place in front of a professional keyboard. While it is true that the floodgates have opened up, a discerning industry and the demands of a highly precise technology have made it difficult for inadequately trained people to progress in their career in this field. CMS Technologies fills this gap between Computer Training and Industry Standards. CMS Technologies at present is offering courses embedded with Networking skills, covering some of the latest & Cutting Edge Technologies like PHP, My SQL, WAP, WML, Win 2003, Linux & Microsoft Commerce Server and Site Server etc. CMS Technologies has excelled itself into Hi-End Network Training Courses and the driving force behind all this is PG System Engg. The Company dedicated to the field of Networking thus providing hi-end career tracks in Network & Software Training like MCSE, CCNA, CCNP, MCSD.NET, MCSA, A+, Sun Solaris and Linux/Unix Certifications. Programming languages such as C, C+ +, Oracle, VB, IIS, SQL DBA etc are also available. CMS Technologies is equipped with State of the Art VUE & Parametric Authorized Testing Canter's with On-Line Exam delivery facility for Microsoft, IBM, CISCO, CompTIA, ORACLE, Sun and many other IT & related companies. CMS Technologies is playing a major role in catering to the industry demand of skilled manpower, in Hardware, Software & Networking probably with Globally Recognized Certifications. CMS Technologies is as a result uniquely placed among the Top Training Establishments in India; born out of the computer industry itself; out of the manpower needs of growing industry; and out of a Commitment for Excellence to the computer users, making waves...

Vision:Certifications Management and System Technologies (P) LTD has been setup to train individuals in all areas of information technology. As a Training division of PG System Engineering, it was set up in1998 to provide industrial training in PC Engg.,Network Engg.,Database and Software Programming and Web Technologies as well-Being an integral Part of PG System Engg.the Institute has developed a systematic training methodology which ensures that knowledge and skills imparted, go well up to meet the industry standards.

Services to Large Number of Clients:Geographically diverse clients from the Middle East, Asia Pacific, Europe, the Americas and local markets have entrusted their faith in the development and outsourcing requirements with us for the past 5+ years.

Experience:With this well entrenched background, PG System Engg. Is the driving force behind CMS Technologies commitment to effective, specially designed, highly comprehensive, practical and career oriented programs.PG System Engg.,has the right tie-ups with companies like MICROSOFT,CISCO,Pearson-VUE,Sun Microsystems,Splitzer consulting & others for providing quality education and internationally recognized certifications to its customers.CMS technologies at present is offering the Web Centering Program, an advanced training program embedded with Networking Skills, covering some of the latest and Cutting Edge Technologies like PHP,MySQL,WML,Windows Server 2003,LINUX and Microsoft Commerce Server and Site Server etc. CMS Technologies has excelled itself into hi-end Network Training Courses and the driving force behind all this is PG System Engg. The company dedicated to the field of networking thus providing hi end certification tracks in Network Training and Software Programming like MCSE, CCNA,

CCNP, MCSD.NET, MCTS and MCTD. CMS Technologies is equipped with a State of Art Pearson-VUE Authorized Testing Centre with online exam delivery facility for MICROSOFT, IBM, CISCO, CompTIA, Awaya.Checkpoint, Siebel systems and many other IT and related companies.

Strong Technology Expertise:The team at CMS has over 200 man-years of technology experience, and has a wide range of skill-sets. Professionals having in-depth knowledge of Programming Languages, Networking, Web Technologies, Databases and Operating Systems compliment this extensive domain expertise.

Reliability:We have successfully demonstrated skills in sensitive and high-end technology on mission critical systems delivering the best solution time and again. Strong Management Team: Professionals and a young management team having proven records and impeccable credentials lead the CMS team. World Class Infrastructure: We have a world-class infrastructure to deliver your solutions without any glitches, and provide 24x7 support. Quality Driven ISO 9001 like Procedures and High SLAs: All our practices are in strict adherence with the standard ISO 9001 like procedures, which allows you to trace and track every stage of the implementation and post-implementation lifecycle. Resources: Our team members are all highly qualified professionals with a proven track

record in building successful companies. We offer you a pool of technical resources, with a high skill set and wide experience of technologies to choose from. All this resources are from the best technical institutes. CMS Technologies currently employs 35 trained resources. Commitment to Your Projects' Success: too Once your project begins, we continue to provide support and value to our customers. We make sure your project runs smoothly. We help keep the project on track, delivering quality work that is on time and within your budget. it as a uniquely placed among the top training establishments in India, born out of the computer industry itself, out of the manpower needs of growing industry .

PROJECT PLAN
To understand the system development it is required to recognize that the candidate system has a life cycle just like any living system or a new product. This life cycle forms the basis for the development of the basic system. The system development life cycle is the systematic process of converting an idea, a problem into a tangible solution or system using the state of the art process. The System Development Life Cycle can be divided into the following phases:
1. HTML

2. DHTML 3. DREAME WEAVER 4. FLASH

SOFTWARE CONFIGURATION

HTML, DHTML, DREAMWEAVER,FLASH

Introduction to HTML:HTML (Hypertext Markup Language) is used to create document on the World Wide Web. It is simply a collection of certain key words called Tags that are helpful in writing the document to be displayed using a browser on Internet. It is a platform independent language that can be used on any platform such as Windows, Linux, Macintosh, and so on. To display a document in web it is essential to mark-up the different elements (headings, paragraphs, tables, and so on) of the document with the HTML tags. To view a mark-up document, user has to open the document in a browser. A browser understands and interpret the HTML tags, identifies the structure of the document (which part are which) and makes decision about presentation (how the parts look) of the document. HTML also provides tags to make the document look attractive using graphics, font size and colors. User can make a link to the other document or the different section of the same document by creating Hypertext Links also known as Hyperlinks.

OBJECTIVE OF HTML:Author Keith Wong, keithwong@optushome.com.au Last updated: 23rd Feb 2002 Downloads Click here to download the toolkit. Introduction The Objective HTML (Html) toolkit allows programming of HTML forms (in Java) in the style of traditional client-server GUI toolkits. Its aim is to

make maintenance and development easier through encapsulation of form components into Java objects. These are some of the features offered by Html: A signals and slots system for event handling The Html Compiler (html) that generates Java code from normal html files Automatic updating of form data Ability to configure event handling and form properties through xml configuration files Fully integrated with Struts Native support of multipart/form-data via Struts Automatic escaping of special html characters The ability to hide/show form objects such as html table rows and columns. Why Html? Whilst tem plating based frameworks are excellent tools for building content based pages, they are an unnatural fit for form based pages. A html form consists of interactive components and like any GUI application these components are best modeled with Java objects. Having these form components as Java objects allows it to maintain its own state and allow it to have properties that it otherwise wouldn't have in a tem plating framework. Using an object-orientated methodology for GUI applications has been a long proven solution and it is the aim of OHtml to bring to Web developers

the same benefits and advantages of this methodology. How Html Fits Into Your Project l is not meant to be a complete MVC solution. The toolkit was designed to be light-weight component that can be plugged into almost any
other existing Java framework such as Struts, Velocity, etc. The toolkit aims solely at providing an easier way to build and maintain html forms. Strengths And Features Of Objective Html Clean Separation Of Page Design And Logic The Html Compiler (html) gives you the ability to generate Html Java code from normal html files. Because your page logic resides in your Java object, your html page need not be corrupted with script let code and/or custom tags. This way your html developers can always modify the form design by using the favorite WYSIWYG html editor. Object-Orientated By using Html you gain all the benefits of OO programming. Instead of having to fiddle your way through html code, you build your html forms

using Java objects. All form elements are encapsulated in Java objects. This allows you to keep your code neat and in the one style as oppose to having to use a complex mix of html and scripting code. As objects your html elements has properties which it otherwise wouldn't have. All textual objects have automatic escaping of special html characters and all objects can be made hidden. Intuitive Data Handling The toolkit encapsulates html form data inside Java form objects. Instead of having to work directly with posted data, developers can access data through these objects. For example, if you have a Html Checkbox object on the form, you can verify whether the check box was check simply by calling the method is Checked on the object. You don't have to bother checking what data got posted back in the request object and you don't have to update your html code so that the check box will be drawn next with a checked attribute. All this is magically handled for you by the toolkit. Event Handling By using the signals and slots mechanism offered by Html you can capture client-side events on the server. Signals are emitted by objects that wish to inform other objects of something that has happened to it. The Html Textbox object, for instance, emits the value Changed signal when its text value is changed, and the Html Push-Button object emits the clicked signal when the object is clicked. Objects (the slots) that are interested in these events can connect to these signals and the slot method will execute when the signal is emitted.

Xml Programming;By integrating Objective Html with Struts developers can configure their Objective Html forms using xml configuration files. In these configuration files you can specify the signal and slot connections for a form and between forms. You can also specify how the forms are to behave when a Objective Html/Struts action is triggered. This flexibility allows developers to build highly self-contained forms that are loosely coupled with each other and highly reusable. The behavior and interactions of the forms can be easy configured in the xml file for a particular problem domain. View Access From The Controller The toolkit provides an implementation that is much more cohesive than with typical tem plating frameworks. In a typical tem plating framework the model (Bean), the view and the controller (Java Class) are uncohesive to the most extreme. Say for example your current business logic tells you that you must disable a certain field on the form. To do this you must first identify this logic in the controller, set a boolean flag in your model and then have the Jsp page extract this boolean flag and process it. So for your controller to do what it wants (to disable a field), you must go through the model and then

the Jsp. These extra layers make it much harder for people to understand your code (especially when you start adding more flags for other things) and as well gives your application many more points of failure. Using Objective Html you end up with only one class that represents the html form, that contains all the data and also contains the presentation logic for the form. So in this example when you identify that this field needs to be disabled you are able to do this immediately and in the one place as you have access to your view from the controller. Supports Multiple Output Formats Your html can be written out in either standard Html or the new Xhtml format. Because all your form elements are encapsulated in objects you can choose the output format of your forms dynamically. More Html variants may be supported in the future. Minimal Html Knowledge Required The toolkit abstracts all the low-level html code away from the developer. The object hierarchy used by OHtml is very intuitive and allows people with a basic understanding of html and general concepts of user interfaces to start building rich user-interface web pages. Tutorials Click below on the links below to see some tutorials. Tutorial - An Introduction To Objective Html Tutorial - Using Objective Html and Struts (DEPRECATED) Tutorial - Separating Page Design and Logic Tutorial - Signals and Slots Tutorial - Objective Html Compiler Tutorial - Using Objective Html and Struts Advanced (NEW) Objective Html With Struts Click here for more details on Objective Html With Struts. Objective Html Compiler Click here for more details on ohtmlc. Signals and Slots Click here for more details on the Signals and Slots mechanism in OHtml. Click here to see the signals available on each HtmlWidget. Objective Html - Class Hierarchy For an overview of the classes in the toolkit and the class hierarchy click here. Objective Html API Javadocs for Objective Html Support - Emailing List There is a general user emailing list. Click here to subscribe.

FEATURES OH DHTML:We can dynamically change web pages using scripts, eg: changing

the size of text as the mouse pointer rolls over it. By far the most popular special effect on the Web is the mouseover (also known as a rollover): When the user places his mouse over an image, it gets replaced with a different image. (The usual effect involves restoring the original image when the user moves his mouse off the new image.) Unlike some effects that serve no useful purpose, a well-done mouseover can enhance the user's experience of the page by supplying visual cues about image links. For example, the mouseover image could be a "highlighted" version of the image or an arrow that appears alongside the image. You can also use mouseovers to supply extra information about what an image link does. For example, the mouseover could display a text image that offers a description of the link. How a mouseover might work: Set up a handler for the MouseOver event that changes the src property of an Image object to display a different file. The MouseOver event is supported by the Link object. To use we surround the img tag with a href and a, and then add the onMouseOver
attribute to the a href tag. For example, if the original image is named image1.gif and the mouseover image is named image2.gif, then we set up the mouseover as follows: <a href="javascript:void(0)" onMouseOver="document.images['my_image'].src = 'image2.gif'"> <img src="image1.gif" name="my_image"></a>

Introduction to Dynamic HTML:Dynamic HTML (DHTML) is a set of innovative features originally introduced in Microsoft Internet Explorer 4.0. By enabling authors to dynamically change the rendering and content of a Web page as the user interacts with it, DHTML enables authors to create visually compelling Web sites without the overhead of server-side programs or complicated sets of controls to achieve special effects. With DHTML, you can easily add effects to your pages that previously were

difficult to achieve. For example, you can: Hide content until a given time elapses or the user interacts with the page. Animate text and images in your document, independently moving each element from any starting point to any ending point, following a predetermined path or one chosen by the user. Embed a ticker that automatically refreshes its content with the latest news, stock quotes, or other data. Use a form to capture user input, and then instantly process and respond to that data. DHTML achieves these effects by modifying the in-memory representation of the current document and automatically reformatting it to show changes. It does not reload the document, load a new document, or require a distant server to generate new content. Instead, it uses the user's computer to calculate and carry out changes. This means a user does not wait for text and data to complete time-consuming roundtrips to and from a server before seeing the results. Furthermore, DHTML does not require additional support from applications or embedded controls to make changes. Typically, DHTML documents are self-contained, using styles and a script to process user input and directly manipulate the HTML elements, attributes, styles, and text of the document. In short, DHTML eliminates the shortcomings of static pages. You can create innovative Web sites, on the Internet or on an intranet, without having to sacrifice performance for interactivity. Not only does DHTML enhance the user's perception of your documents, it also improves server performance by reducing requests to the server. The following sections describe DHTML in more detail and how to use it. Document Object Model Dynamic Styles Dynamic Content Positioning and Animation Filters and Transitions Font Download Data Binding Summary Related Topics

Document Object Model:DHTML is not a technology in and of itself; rather, it is the product of three related and complementary technologies: HTML, Cascading Style Sheets (CSS), and script. To allow scripts and components to access features of

HTML and CSS, the contents of the document were represented as objects in a programming model known as the Document Object Model (DOM). The DOM API is the foundation of DHTML, providing a structured interface that allows you to access and manipulate virtually anything within the document. The HTML elements in the document are available as individual objects, meaning you can examine and modify an element and its attributes by reading and setting properties and by calling methods. The text between elements is also available through DOM properties and methods. The DOM also provides access to user actions such as pressing a key and clicking the mouse. You can intercept and process these and other events by creating event handler functions and routines. The event handler receives control each time a given event occurs and can carry out any appropriate action, including using the DOM to change the document.

OBJECTIVE OF DHTML:-

HTML is based on thinking of a web page like a printed page: a document that is rendered once and that is static once rendered. The idea behind Dynamic HTML (DHTML), however, is to make every element of a page interactively controllable, before, during, and after the page is rendered. This means you can make things move, appear and disappear, overlap, change styles, and interact with the user to your heart's content. Through DHTML, users get a more engaging and interactive web experience without constant calls to a web server or the overhead of loading new pages, plug-ins, or large applets. DHTML is not a language itself, but rather a combination of:

HTML 4.0 (or XHTML 1.0) JavaScript -- the Web's standard scripting language Cascading Style Sheets (CSS) -- styles dictated outside a document's content Document Object Model (DOM) -- a means of accessing a document's individual elements

Since the first edition of this book, Dynamic HTML has developed into a stable standard that is well supported by both Netscape 6 and Internet Netscape Navigator 4.0 and IE 4.0 supported earlier, proprietary versions of DHTML, and they differed greatly in their support for CSS and

dynamically positioned elements. The differences between what these two browser versions called DHTML has created a million migraines among web developers. Accounting for the

inconsistencies required creating two separate web pages or jumping through browser-detection hoops to give all users the same experience. Fortunately, with the latest browsers, there are significantly fewer headaches involved with DHTML. In this chapter, we'll be concentrating on using the W3C and ECMA standards supported by the latest browsers, but we'll briefly cover the earlier versions of DHTML later in this chapter.

Using DHTML:Like most web technologies, DHTML comes with its share of pros and cons. DHTML's reliance on a variety of standards makes it difficult to generalize, so you should decide on a case by case basis whether or not to use DHTML. The following are the major factors to consider when considering using DHTML on your site.

Advantages to Using DHTML:Using DHTML has the following advantages:

File sizes are small. DHTML files are small compared to other interactive media like Flash or Shockwave, so they download more quickly. It's supported by both major browser manufacturers. Both Microsoft and Netscape currently support DHTML in some shape or form. DHTML is a standard. The World Wide Web Consortium (W3C) has released specifications for DOM 0, 1, and 2, and CSS 1 and 2 (see the web site at http://www.w3c.org for more information). These specifications lay the groundwork for DHTML. No plug-ins, ActiveX controls, or Java is necessary. A visitor to your site needs only a recent web browser to take advantage of your DHTML. This puts fewer requirements on your audience because they don't need to download special software to view your site.
There are fewer calls to the server. Since you can change and move elements after a page is loaded, you don't need to create separate pages just to change styles or display a menu.

Disadvantages:But keep in mind these disadvantages:

Only new browsers support DHTML. Only recent browsers like Netscape 6, IE 5.5, and Opera 5 support standards-based DHTML. Many people are still using older versions of these browsers, however, so web designers using DHTML must accommodate these older browsers or sacrifice a significant portion of their audience. Netscape and Microsoft have different DHTML implementations. Different implementations, especially in the 4.0 browsers, can make creating a DHTML document tedious and complicated. DHTML creation has a steep learning curve. Because DHTML requires at least partial knowledge of many different web technologies (HTML, JavaScript, CSS, and DOM), it takes some learning and practice before you begin creating DHTML content. DHTML tools can go a long way towards eliminating this problem.

INTRODUCTION TO DREAMWEAVER:When working with Macromedia Dreamweaver MX for the first time, or on a new site for the first time, you need to define the Web site so that Dreamweaver can work with it. This process includes naming the site, placing the local files on a directory on your hard drive, and showing Dreamweaver where those files will be published on the Web. Follow these easy instructions to define a new Web site for Dreamweaver MX. 1. Go to the Site menu, and choose New Site. Dreamweaver has a site definition wizard that will walk you through the steps of creating a new Web site. Make sure that the Basic tab is displayed. 2. Name your site and click Next. This name is for you to remember what Web site it is. I named mine "Jenn's Web". 3. Leave the option "No, I do not want to use a server technology." checked, and click Next. Macromedia Dreamweaver MX supports many different technologies, beyond just straight HTML. But for this example, we'll be creating a basic Web site with no special technologies 4. Leave the option "Edit local copies on my machine, then upload to server when ready" checked. This allows you to keep a backup copy on your local hard drive. While it can be a bit slower than editing files directly on the Web server, it is a lot safer, especially if your Web server doesn't have any

revision control or backup processes. 5. Decide where you want to store the local files, and click Next. I tend to leave it in the default location, but if you want to change where the files are stored, click on the folder icon and surf to the directory you want. 6. Change the "How do you connect to your remote server?" drop-down to "FTP". FTP is the most common way that people connect to Web servers, but Macromedia Dreamweaver offers several options: Local/Network, RDS, SourceSafe Database, and WebDAV.
7. Fill in the hostname, folder, and login name. For security leave the

"save" checkbox unchecked next to the password. I recommend running the "Test Connection" option as well, to make sure that Dreamweaver can connect. If the connection works, click Next. If you need help with the FTP options, please read my article on uploading. 8. Leave the option "No, do not enable check in and check out" checked and click Next. Dreamweaver provides an option to protect against overwriting by a team of developers. Unless you know your site will be edited by more than just you, you can leave this option checked. 9. Review the options. If they look correct, click Done. You have successfully set up a site in Dreamweaver. In the files tab of the resource pane, you will see a folder named the name of your site. This is the local view of your Web site. Go to the Site Menu, and click Site Files if you don't see it. Connect to Your Site It's easy to connect to a site once it's been defined in Dreamweaver. 1. On the Site Files tab in the Resource bar, click on the icon with the three circles in a triangle shape. 2. Fill in your FTP login password. Once you've defined your site, you're ready to start editing. Just click on the files you want to edit, or create a new file and build your site. When you've finished editing a page or section, highlight the page or section and click the blue up arrow to move them to your Web site. Web Design Path

Beginning HTML and Web Design

Suggested Reading

Dreamweaver Help Dreamweaver How Tos Dreamweaver Resources JavaScript: DW Product Review 3D Graphics: Studio Product Review How to Create a New Web Site Using Macromedia Dreamweaver Upload Your Web Site Controlling Web Robots - Using the robots.txt File How to Set Up a PHP/MySQL Site in Dreamweaver - Dynamic Websites in Dreamwe... How to Create a New Web Site in FrontPage Headlines Forum

From Other Guides

Related Articles