Information Technology Standard Twelve (Commerce) PDF

 Practical Notebook for Standard XII Practical Notebook Cum Journal Price: ` 72.00.00 Pric e: ` 91 e:` Pri...

 Practical Notebook for Standard XII Practical Notebook Cum Journal Price: ` 72.00.00 Pric e: ` 91 e:` Pric 81.0 0 Practical Notebook prescribed for the subjects Biology, Physics and Chemistry for Standard Twelve as per subject scheme Based on Government approved syllabus and textbook Inclusion of all practicals as per Evaluation scheme. Inclusion of various activities and objective questions Inclusion of useful questions for oral examination Practical notebooks are available for sale in the regional depots of the Textbook Bureau. (1) Maharashtra State Textbook Stores and Distribution Centre, Senapati Bapat Marg, Pune 411004  25659465 (2) Maharashtra State Textbook Stores and Distribution Centre, P-41, Industrial Estate, Mumbai - Bengaluru Highway, Opposite Sakal Office, Kolhapur 416122  2468576 (3) Maharashtra State Textbook Stores and Distribution Centre, 10, Udyognagar, S. V. Road, Goregaon (West), Mumbai 400062  28771842 (4) Maharashtra State Textbook Stores and Distribution Centre, CIDCO, Plot no. 14, W-Sector 12, Wavanja Road, New Panvel, Dist. Rajgad, Panvel 410206  274626465 (5) Maharashtra State Textbook Stores and Distribution Centre, Near Lekhanagar, Plot no. 24, 'MAGH' Sector, CIDCO, New Mumbai-Agra Road, Nashik 422009  2391511 (6) Maharashtra State Textbook Stores and Distribution Centre, M.I.D.C. Shed no. 2 and 3, Near Railway Station, Aurangabad 431001  2332171 (7) Maharashtra State Textbook Stores and Distribution Centre, Opposite Rabindranath Tagore Science College, Maharaj Baug Road, Nagpur 440001  2547716/2523078 (8) Maharashtra State Textbook Stores and Distribution Centre, Plot no. F-91, M.I.D.C., Latur 413531  220930 (9) Maharashtra State Textbook Stores and Distribution Centre, Shakuntal Colony, Behind V.M.V. College, Amravati 444604  2530965 E-learning material (Audio-Visual) for Standards One to Twelve is available through Textbook Bureau, Balbharati... Register your demand by scanning the Q.R. Code given alongside. Register your demand for E-learning material by using Google play store and downloading ebalbharati app. ebalbharati www.ebalbharati.in, www.balbharati.in The Coordination Committee formed by GR No. Abhyas - 2116/(Pra.Kra.43/16) SD - 4 Dated 25.4.2016 has given approval to prescribe this textbook in its meeting held on 30.01.2020 and it has been decided to implement it from academic year 2020-21. INFORMATION TECHNOLOGY STANDARD - TWELVE (Commerce) Maharashtra State Bureau of Textbook Production and Curriculum Research, Pune. The digital textbook can be obtained through DIKSHA App on smart phone by using the Q.R. Code given on title page of the textbook and useful audio-visual teaching-learning material of the relevant lesson. First Edition: 2020 © Maharashtra State Bureau of Textbook Production and Reprint: 2021 Curriculum Research, Pune- 411004. The Maharashtra State Bureau of Textbook Production and Curriculum Research reserves all rights relating to the book. No part of this book should be reproduced without the written permission of the Director, Maharashtra State Bureau of Textbook Production and Curriculum Research, ‘Balbharati’, Pune. Co-ordination Information Technology Subject Committee and Study group Dr. Ajaykumar Lolage Special Officer, Work Experience, Shri. Sanjay Kulkarni, Chairman Incharge Special Officer, Smt. Neha N. Katti Health and Physical Education, Shri. Prashant M. Patil Textbook Bureau, Pune Smt. Vijaya A. Parekar Smt. Archana K. Mulay Production Shri. Sachchidanand Aaphale Smt. Dipali G. Dhumal Chief. Production Officer Smt. Jyoti J. Barge Shri. Sachin Mehata Smt. Aasha C. Mohite Production Officer Smt. Sushama S. Patil Shri. Nitin Wani Smt. Sangita A. Jaju Asst. Production Officer Shri. Tayyabali M. Sayyad Paper Shri. Nilesh S. Ghavate 70 GSM Creamwove Shri. Milind Oka Print Order N/PB/2021-22/35,000 Shri. Prashant D. Hakim Shri. Satyawan B. Guram Printer M/S. PRABHAT PRINTING PRESS, Shri. Nitin R. Choubey PUNE Dr. Ajaykumar S. Lolage (Member Secretary) Publisher Vivek Gosavi, Cover & Illusatrations Controller Shri. Ramesh Malage Maharashtra State Textbook Shri. Sandeep Koli Bureau, Prabhadevi, Typesetting Mumbai-400025 Textbook Bureau, Pune NATIONAL ANTHEM  Foreword Dear Students, Congratulations to all of you for the successful completion of Std XI and welcome to the second year of Higher Secondary Education. The syllabus of Information Technology (Commerce) at Higher Secondary Level has been revised and implemented in view of the fact that computer is used currently as a tool for various applications, especially in the field of e-Banking, e-Commerce, e-Governance, etc. Higher studies and placements, at present, greatly demand human resources with adequate knowledge in computer applications and information technology. The Information Technology aims to equip students the knowledge, skills and attitudes to become productive employees in the area of Computer science and technology. In this course, you all will gain a perspective to become a successful entrepreneur in Information Technology and allied sectors. Scope of this textbook also provides you all with the foundation for higher studies. Information technology is one of the most significant growth catalysts for the Indian economy. I am sure after completion of HSC with IT, you will acquire skills and competency to enter in the upcoming job market. In Class XI, the syllabus focused on the fundamentals of computer, computer network, basics of website designing and some knowledge of database. Emphasis is also given to put a strong foundation to develop problem solving skills and create computer programs using JavaScript as a scripting language. You all are also familiar with web page designing and database concepts. The syllabus of Class XII Information Technology (Commerce) is a continuation to that of Class XI. Hence the textbook designed in accordance with the syllabus, begins with some advanced features of HTML5. Since we are in the age of Internet and most of us are users of web applications, concept of digital marketing is being introduced to become Digital Marketing expert. The concept of database and facilities of information retrieval are included with Libre Office (Base). A chapter is dedicated to present a brief idea about Enterprise Resource Planning. This book will surely meet all the requirements for stepping to levels of higher education and pave the way to the peak of success. Each unit comprises of simple activities and demonstrations which can be done by you on your own. (Vivek Gosavi) Pune Director Date : 21 February, 2020 Maharashtra State Bureau of Texbook Bharatiya Saur : 2 Phalguna 1941 Production and Curriculum Research, Pune  For Teachers Dear Teacher, The subject Information Technology (Commerce) is an optional subject of the Higher Secondary Education. The content is developed in view of the fact that it should be useful to the students for their higher studies and they should be able to use computer as a tool in accounting and other commercial applications. Besides, if somebody wishes a shift towards the IT field in higher education, the syllabus can cater to their needs. Although the field of IT continues to expand rapidly, it is not feasible to expand the size of the curriculum proportionately. As a result, the syllabus has been designed in such a manner to inculcate the current technical knowledge among the students. The textbook on Information Technology (Commerce) is developed as per the approaches and methods used in recent era of internet and web. As the curriculum is activity-based, process-oriented and based on constructivism, it demands higher level proficiency and dedication from the part of the teachers for effective teaching. This textbook takes two aspects into consideration - knowledge domain and process domain. The knowledge area of the curriculum of Class XII is a continuation to that of Class XI. The programming aspects to solve complex problems and handle complex data are introduced. Since we are in an era of Internet, a wide coverage is given to the contents required for designing web pages and developing web applications. It also enhances the knowledge of web hosting. The knowledge domain also initiates brief idea about Enterprise Resource Planning with its various aspects. The new concept of digital marketing is presented in this textbook in the dialogue format. This type of format may make students to understand the concept quickly and permanently. The concepts such as E commerce and E Governance will make student aware about the digitalization process. The knowledge about the same is must for today’s generation. The process domain gives importance to gain the scientific and logical method and develop interest for deeper investigation. The accounting software package topic gives freedom to use any accounting software. We prefer FOSS policy. The conceptual idea behind this topic is that, the process of computerised accounting should be understood by the students. While transacting the concepts through activities, it should be ensured that the students are attaining the skills along with learning outcomes. The Textbook IT (Commerce) is prepared by a team of practicing teachers under the guidance of a panel of subject experts. All possible efforts have been taken to make the book learner-friendly and interesting. There is no denying the fact that our teachers are resourceful and committed, and hence directions towards the right path can make the transaction of the curriculum most effective and productive. Constructive criticism and creative suggestions for improvement of the book are most welcome. Information Technology Subject Committee and Study Group Textbook Bureau, Pune  Competency Statements For Information Technology Standard - XII (All Streams) Competency Theory 1. To create awareness and acquire knowledge about new technology. 2. To acquire in-depth knowledge about technologies related to AI, IOT, 3D Printing, 5G. 3. To enable the student to think and create interest in emerging technology from career point of view. 4. To make students aware about concept of E-commerce. 5. To acquire knowledge about scope of E-commerce. 6. To create awareness about different E-commerce websites and discuss its features. 7. To develop higher order logical skills based on basic knowledge acquired in 11th standard. 8. To make students aware about HTML5’s advanced tags while developing web page. 9. To make students competent in scripting language to create dynamic web page. 10. To acquire knowledge about concept of object. Skill Oriented Practicals (SOP) 1. To inculcate web designing skills using advance tags. 2. To make students confident to create website. 3. To develop skills for programming using DOM. 4. To develop ability to create dynamic web pages using advance features. 5. To develop ability to program for server side scripting. 6. To develop skill to create simple PHP Program. 7. To make student aware about connectivity with database. 8. To develop skill in handling accounting package with advance feature. 9. To make student competent to display and print different accounting report. 10. To acquire skills in recording and manipulating audios. 11. To make student skillful to mix audio. 12. To acquire skills to record, create and manipulate video. 13. To enhance the creative ability by mixing and fusion of the different media.  INFORMATION TECHNOLOGY STANDARD - TWELVE (Commerce) INDEX No. Title of the Chapter Page No 1 Advanced Web Designing 1 2 Digital Marketing 27 3 Computerised Accounting with GST 42 4 E-Commerce and E-Governance 71 5 Database Concepts using Libre Office Base 82 6 Enterprise Resource Planning (ERP) 99 Skill Oriented Practicals (SOP) 1. Advanced Web Designing 110 2. Digital Marketing 113 3. Computerised Accounting with GST 115 4. Database Concepts using Libre Office Base 118  1 Advanced Web Designing 1 Let us learn different versions supporting different features. HTML5 is currently used  Student can design the layout of web because it supports mobile technology. pages using CSS. The major browsers are Google Chrome,  Students can learn to design the Mozilla Firefox, Microsoft Edge, Safari, website. Opera and Apple support the features of HTML5.  Student can design the web form with validations. 1.2 Forms in HTML5  Students can learn concept of image In eleventh standard we have studied map and Iframe (inline frame). different controls related to form like text, radio, checkbox, submit, reset, select and  The aim is to give the skills to create textarea. HTML WebPages, using HTML5 These controls are used to collect and CSS. different kinds of user inputs, such as contact details like name, address, single 1.1 Advanced Web Designing or multiple options from group of options, as well as clearing and submitting data We have been introduced to basic etc. terminologies related to creation of web pages. The Hypertext Mark-up Language HTML5 has introduced additional (HTML) is an evolving language, with form controls which can also be used for validation purpose. HTML5 advanced elements HTML5 introduces a number of new input type values for the type attribute of tag. Input type Description Defines a color picker Defines a field for entering a number Defines a field for entering a URL. Defines an image as a submit button. Defines a date picker with the year, month and day Defines a field for an e-mail address 1  Input type Description Defines a month and year control in format is "YYYY-MM" Define a range control. Default range is 0 to 100. Defines a date picker that includes the year, month, day and time. Defines a control for entering a time. Defines a week and year control. Defines a text field for entering a search string like a site search or Google search. Defines a file-select field and a "Browse" button for file uploads. Used to define input fields that should contain a telephone number. Input Restrictions A list of some common input restrictions is given below, few of which can be used for validation purpose. Attribute Description disabled Specifies that an input field should be disabled. max Specifies the maximum value for an input field. min Specifies the minimum value for an input field. pattern Specifies a regular expression to check the input values. read only Specifies that an input field is read only (cannot be changed). This acts as a temporary label showing the purpose of a text field placeholder without requiring a label tag. required Specifies that an input field is required (must be filled out). Specifies whether a form or input field should have autocomplete On autocomplete or Off. Specifies that the input field should automatically get focus when the autofocus page loads. height and Specifies the height and width of an width Specifies that the user is allowed to enter more than one value in the multiple element. This works with input types like email and file. 2 Some other useful attributes used with are- 1. id : This is used to identify the html element uniquely through the document object model. 2. class: It is used to apply CSS style to the individual input element. Examples : Forms in html 5 Name: E-mail: Date of Inception: Office time: Number of years completed(between 1 and 100): Office phone number: Add your homepage: The output is as follows Do it Yourself 1. Use multiple attribute in 2. Use pattern attribute in and see the Output. 1.3 tag The meta tag is a tag in html that describes some aspects of contents of a webpage. The HTML tag is used by search engines to search information 3 that is provided with the webpage. This is empty tag (singular tag) which carries information within its attributes. The tag is placed between the and tags. Metadata will not be displayed on the webpage. Attribute of tag Attribute Values Description Name The value of the name attribute Specifies the Name of the meta- can be related to any of the data like the author, keywords or following- i) Author ii) Description description. iii) Keywords iv) copyright e.g. Content It can have any textual matter related to the name as in eg. i. balbharati. ii. advance web designing. iii. like html5 , learn html5 etc. Charset UTF-8, Big5 Specifies the character encoding e.g used by the document, This is called a character encoding declaration. UTF-8 For Indian characters Big5 – for Chinese characters http-equiv refresh , set-cookie, content-type, Used for http response message expires, headers. e.g. every 5 seconds. The browser sends the cookies for the document 4 Example: meta tag examples element you want to style. It could be Declaration Block : The declaration declarations separated by a semicolon. 1. color : yellow; 2. font-size :11 px; Welcome to HTML5 Each declaration contains a property name and value, separated by a colon. Property : A Property is a type of attribute of HTML element. It could be color, border etc. 1.4 Cascading Style Sheets in HTML5 Value : Values are assigned to CSS CSS stands for Cascading Style properties. In the above example, value Sheets. CSS describes how HTML "yellow" is assigned to color property. elements are to be displayed on screen, Selector{Property1: value1; Property2: paper, or in other media. CSS saves a value2} lot of work. It can control the layout Types of CSS of multiple web pages all at once. CSS allows you to control the look and feel There are three methods of of several pages by changing a single implementing styling information to an source. HTML document. 1. Inline CSS CSS Syntax 2. Embedded stylesheet or Internal  A CSS rule set contains CSS  a selector and 3. External CSS  a declaration block. 1. Inline stylesheet : It uses the style attribute in the HTML start tag. 5  Inline CSS is used to apply CSS on a single line or element. For example : The internal style sheet is applied on this heading. Hello CSS This paragraph will not be affected. 2. Embedded stylesheet or internal CSS : This is used to apply CSS on a single document or page. It can affect all the elements of the page. It The output of above program is as is written inside the style tag within follows- head section of html. For example : h1{color: Red;} CSS Properties Property Use Value Example Color Changes the color of the text Color name h1{color: maroon} Background-color To set the background color Color name body{background- in your webpage color:yellow} Font-weight Used to bold text bold or 100, p{font-weight:300} 200…900 Font-style Used to italicize text Italic, oblique or p{font-style:italic} normal Text-decoration This property is used to add p{text-decoration: 1. strike-through marks 1. line-through underline} 2. underline 2. underline a{text-decoration: 3. overstrike 3. overline none} 4. to remove underlines from 4. none links Text-align This property is use to left, right, center h1{text- control the horizontal or justify align:center} alignment of any block-level text that are paragraphs, tables and other elements Font-family This is used to control the Font name p{font- fonts family:arial} 6  Property Use Value Example Font-size This property allows you to px, in, mm, cm, p{font-size:10px} control the size of the font pt Letter-spacing This helps in controlling the px, in, mm, cm, h1{letter-spacing: horizontal spacing between pt 5pt} characters of text Padding This property is used when Pixel h1{padding:30px} you want to add padding (blank spaces) around the content of an element. Border This property adds a border Solid, double, h1{border:double} to a webpage element groove, ridge, inset, outset, dotted or dashed Background-image To set an image as the url(''X'') body{background- background of your webpage where X is the image: path of image url('background. file jpg')} Background-repeat To set the background image repeat no-repeat background-repeat: to repeat or not repeat background-repeat: no-repeat Margin-Left Sets margin area on the left px,pt,cm etc. h1{margin- side of the element. left;10px} 3. External stylesheet : The external An external style sheet can be written style sheet is generally used when you in any text editor, and must be saved want to make changes on multiple with a.css extension. The external css pages. It facilitates to change the look file should not contain any HTML tags. of the entire web site by changing just one file. It uses the tag on Here is how the "style.css" file looks every page and the tag should like: be put inside the head section. Style.css For example : h1{color:navy;margin-left:20px} The output is as follows This is a heading 7 CSS Id Selector The class name should not start The Id selector selects the id with number. attribute of an HTML element to Let's take an example with a class "intro". select a specific element. An id is always unique within the page so it is unique element. It is written with the hash character(#), followed by the id name..intro{text-align:center;color:blue} This heading is blue and center-aligned. #para1{text-align: center; color: blue} This paragraph is blue and center-aligned. Hello Students The above code results as This paragraph will not be affected. Class Selector for specific element See the output as follows To specify only one specific HTML element should be affected then you should use the element name with class selector. Let's see an example : p.intro {text-align: center;color: blue} CSS Class Selector The class selector selects HTML elements with a specific class attribute. This heading is not It is used with a period character '.' affected (full stop symbol) followed by the class This paragraph is name. The Class selector is used when blue and center-aligned. you want to change a group of elements within your HTML page. 8 The output is as follows h1{ text-align:center;color:blue} h2{ text-align:center;color:blue} p {text-align:center;color:blue} As you can see, you need to define Universal Selector CSS properties for all the elements. It The universal selector is used as can be grouped as- a wildcard character. It selects all the h1,h2,p{ text-align:center;color:blue} elements on the Webpages. Let`s see full code as follows : * { color: green; font-size: 20px;} h1,h2,p{text-align: center; color: blue} This css style will be applied on Entire page.It does not check tag or plain text This css is applied to heading Hello Heading 1 Hello Heading 2 (In smaller it is applied to first font) paragaraph This is a paragraph. Also to second paragraph ! Output : Output : Group Selector The grouping selector is used to select Positioning in CSS all the elements with the same style CSS helps to position the HTML definitions. It is used to minimize the elements. The position property is used code. Commas are used to separate each to set position for an element. The selector in grouping. element can be positioned using the top, Let's see the CSS code without group bottom, left and right properties. selector. 9 Syntax : Output : Selector{position:value;top:value; left:value:bottom:value;right:value} Where values in positions are fixed, absolute, relative and values of top, bottom, left, right are in pixels 3. Relative Positioning : The relative There are four types of positioning in positioning property is used to set the CSS element relative to its normal position. 1. Static Positioning : This is a by- 4. Absolute Positioning : This property default position for HTML elements. sets an element in a specific location It is not affected by the top, bottom, and it is not affected by the flow of left and right properties. the page. This property positions the element at the specified coordinates 2. Fixed Positioning : This property relative to your screen top-left corner. helps to put the text fixed on the For example : browser. The FIXED property forces an element into a fixed position relative to the browser window. The fixed element will not move, even.first{position: relative;top: -10px; when the page is scrolled. right: -10px;} h2{position: absolute; Let`s see the example : left:100px;top:150px} This is heading 1 p.fixed{position: fixed; top: 50px; right: 5px; color: blue} This is heading 2 Output : This is paragraph 1 This is paragraph 2 This is paragraph 3 This is the fix positioned text. 10  In above output the Level 1 headings Balbharati with class=“first"have a relative position 10 pixels above and 10 pixels to the right This text rearranges itself to flow of it’s original position. around the element that is floated right. All level 2 headings will be positioned 100 pixels from the left of the browser window and 150 pixels from the top of Output the browser window. Float Property Float is a CSS property written in CSS file or directly in the style of an element. Display property The float property defines the flow of content. The Display property in CSS defines how the components (div, hyperlink, Following are the types of floating heading, etc) are going to be placed on properties : the web page. It specifies how the element 1. float : left : This keeps the element is displayed. As the name suggests, this float on left side of the container property is used to define the display of 2. float : right : This keeps the element different parts of a web page. float on right side of container Syntax : 3. float : none : This is default property Display : value; i.e. this shows the element as it is. Where values are : For example : Inline : It is used to display an element as an inline element. Float Example Block : It is used to display an element as an block element. It starts on a new.float-left{float:left;font- line, and takes up the whole width of the size:20px;background-color:gold} browser window..float-right{float: right; Inline-Block : This value is very similar font-size:20px;background-color:gold} to inline element but the difference is that Balbharati you are able to set the width and height. This text rearranges itself to None : The element is completely flow around the element that is floated removed. left. 11 Let's see an example Output : Based on the CSS properties studied so far, the representation of semantic tags p{ displayed in 11th standard textbook can display: inline; be coded as follows. } Example 1 : Use of semantic tags and CSS. welcome to balbharti Javascript HTML5 CSS header{background-color:pink;width:1 Output : 00%;height:20%} nav{background- color:skyblue;width:100%;height:20%} aside{background-color:grey;width:40 Example 2 : %;height:42%;float:right} section{background-color:lightyellow; width:60%;height:10%;float:left} article{background-color:violet;width: Example of CSS display 60%;height:40%} footer{background-color:orange;width a{ :100%;height:10%} display : block; background-color:orange; } HTML5 includes new semantics It includes semantic tags like Visit balbharti header, footer, nav Example of complete HTML5 Basics The markup of the future under 12 development. forum posts or individual comments. The nav element represents a section of navigation links. It is suitable for either site © 2018 Balbharti. navigation or a table of contents. http://www.w3schools.com Balbharti website 1.5 Ordered list or numbered list The tag defines an ordered Other education based websites of State list. An ordered list can be numerical or State alphabetical. Board website Pune university Attributes of tag- website Attribute Values Description Type "1" 1 is default value and Impressive Web Designing /"a"/"I"/"i" other values specify The aside element is for content the numbering type for that is tangentially related to the content around the used items. it, and is typically useful for marking up sidebars. Reversed Reversed This attribute specifies that the items of the list are specified in the Articles on:Article tag reverse order. Start Number Specifies the starting The article element represents an number of the first independent section of a document, page or site. item in an ordered list. It is suitable for content like news or blog articles, 13  Output : List of Topics Basics of IT HTML 5 PostgreSQL List of Topics start with series 1.6 Unordered list or bulleted list 50 An unordered list created using the Basics of IT tag, and each list item starts with HTML 5 the tag. The list items in unordered PostgreSQL lists are marked with bullets (small black circles), by default. Output : Example : 1 Example of HTML Unordered List HTML Unordered List Basics of IT HTML 5 Example 2 : PostgreSQL Output : List of Topics in reverse sequence Basics of IT HTML 5 PostgreSQL 14  Attributes of tag Attribute Values Description Type = disc/ style="list-style-type:disc" Sets the list item marker to a circle/square e.g bullet (default) (use style (css) instead of type style="list-style-type:circle" attribute in e.g HTML5. Sets the list item marker to a Type attribute is circle supported by style="list-style-type:square" previous e.g versions of Sets the list item marker to a HTML) square style="list-style-type:none" e.g The list items will not be marked Note : HTML5 does not support bullets, circle and square value of type attribute Example of HTML definition instead you use CSS style. List 1.7 Definition list Web To define a definition list tag is The part of the Internet that used. You can create items in definition contains websites and web pages HTML list with the and tags. The A markup language for creating tag is used to define the term whereas web pages the tag is used to define the term’s CSS definition. A technology to make HTML look Type the following code better definition List 15 Output : Multi level list : nested list Multi-level list Nested List Nested list List within another list either order Daily computing list or unordered list is called nested list. Web design Examples : Single level nested list html 5 hyperlink Inserting Images Example of HTML nested list conditional structure HTML Nested List If statment If else statement Introduction to IT case statement Introduction to DBMS loop statement Definition of DBMS applications of DBMS Advantages of DBMS Postgresql Output : Output : 16 1.8 Inserting audio and video in Attributes of tag HTML 5 Attribute Values Description HTML5 new specifications enables The audio will users to have a far more control over start playing as audio on webpages. Autoplay - soon as it is HTML5 features include native audio ready and video support without the need for The audio Flash. HTML5 includes special elements controls should (tags) allowing to include video and Controls - be displayed audio and to define controls. (i.e. play/pause button etc.) Common Audio Formats : The audio will mp3 : An audio format from start over MPEG(Moving / Motion Pictures Experts loop - again, every Group). time it is aac : Advanced Audio Coding, standard finished format on Iphone, YouTube etc. This Specifies ogg : An Open container and free audio that the audio muted - format. output should be muted Tag Specifies the The element enables you to src URL URL of the embed(or add) audio files on Webpages. audio file Declare the audio tag, and specify Example : the source attribute with the Audio file location. Syntax : Note: Autoplay, controls, muted are without any values. Browsers have their own policies. Autoplay attribute is supported by Microsoft Edge or Firfox, Output : when the permission from 'Privacy & Security' panel is set as 'Allow Audio Autoplay'. 17 In previous code Tag The controls attribute is used to add The HTML tag is used to audio controls such as play, pause, and embed video into your web page, it has volume. several video sources. The"source"element is used to specify There are three different formats that the audio files which the browser may are commonly supported by web browsers use. –.mp4,.Ogg and.WebM. Adding audio with multiple sources : Syntax : Multiple sources of audios are specified so that if the browser is unable to play the first source then it will Attributes of tag : automatically jump to the second source. tag Attribute Values Description The tag is used to specify Defines link to Src URL multiple media resources for media video file elements. It is used with and Specifies that both. the video will autoplay - start playing as Example : soon as it is ready Specifies that video controls Audio Sample should be controls - displayed (such button etc). height Pixels of the video Specifies that the video will loop Value start over again, every time it is finished Output : Specifies that the audio output muted - of the video should be muted 18 Attribute Values Description Output : Specifies an image to be shown while the video is poster URL downloading, or until the user hits the play button Specifies if and 1. auto how the author 2. metadata thinks the video preload 3. none should be 1.9 Image map in HTML 5 loaded when the An image with multiple hyperlinks is webpage loads called an image map. Sets the width Image map is used to connect links width Pixels of the video to different regions on the webpage. An player Image map is created by marking certain The tag is used to specify regions on an image clickable. These multiple media resources for video as clickable regions are called as hotspots. well as audio media elements. Image Maps are of two types; Client Side and Server Side. We will confine Example : only to Client Side image map. The tags used to define client side image map are 1. : It is used to insert an image on a web page. To create a client side is used with value which is preceded acts as a pointer which indicates that 2. : It has only one attribute Your browser does not support the name. It specifies name of the image video tag. used for client side image map. The value of the name attribute is the value specified in usemap attribute of. 19 3) - It defines specific clickable Example : Image Map with element regions. A given element can and contain multiple element within it. is singular tag and is paired. Attributes of : image map Attribute Description An example of Image Map Defines the URL to which the clickable region It can value rect, circle or Shape the clickable regions on rectangular area with coords co-ordinates. Poly-Defines a polygon region with co-ordinates (In the above program great_wall_ specifying each point on china.html is a local file created on the the polygon. It requires machine.) four co-ordinates. Default-Region covers the entire image. No 1.10 Inline Frame in HTML5 co-ordinates are required The element creates an inline frame. Inline frames are often used Specifies extra in online advertising, where the contents information about of the is an advertisement alt clickable area. It is the alternative text to the from an external party. HTML5 allows clickable region. the incorporation to be seamless (no scrollbars, borders, margins etc). 20 Attributes of : 1.11 Website Hosting Attribute Values Description In this chapter we have seen how to Specifies the create a website. But just creating of a address of the website is not sufficient. One has to make Src URL document to the website available on the Internet. embed in the These web pages are to be stored in the web servers that are connected to the Specifies the Internet, to be made available to others. Height Pixel height of an What is web hosting? Specifies the Web hosting is the service of providing Width Pixels width of an storage space. The website is made available on the Internet with the help of Specifies name of web hosting. Text an Name What is Web Host? Specifies the The companies that provides web HTML_ HTML content of hosting services are called web hosts. srcdoc code the page to show Web hosts own and manage web servers. in the These web servers offer uninterrupted Internet connectivity. For example : Types of Web hosting : Types of web hosting are 1. Shared hosting : It is cost effective. It HTML Iframes gives domain name to your website. This is the example of iframes. websites which provide you free hosting of the website for limited period of time. Output : 3. Dedicated hosting : These are paid hosting servers for large websites. Note : You can buy your own web server space, but it is the most expensive way to publish your website. Though it is very expensive, but it gives you a lot of control over your website. 21  For information purpose only Prerequisites for Free Web Hosting : webpages including image, audio 1. Three to Four pages website having files etc) and click on "Logout" first or Home Page named as index. 10. Your website is ready with the sub html. domain as 000webhostapp.com 2. Computer with internet connection. e.g.it-xi-textbook.000webhostapp. 3. Gmail id with password. com 4. Need to toggle between two websites Acquire Domain Name : https://www.000webhost.com/ and 1. Open the website https://my.freenom. http://my.freenom.com com 5. Have to acquire free web space from 2. From Use social sign in Click on web server named 000webhost.com. "sign in" Login with your gmail id 6. Have to acquire domain name for and give password your website from my.freenom.com. 3. Click on "Services" --> Register a 7. Park the website domain address with New Domain free server website i.e. with 000web- 4. Type your website name and click on host.com. "check availability" button Redirect the domain free server name 5. Choose any domain(e.g..tk,.ml.cg to the domain website i.e. with my. etc) and click on "Get it now" if avail- freenom.com. able click on "CheckOut" button Steps to Acquire free webspace : 6. Set the free period to host the website, 1. Open the website https:// click on "Continue" button www.000webhost.com/ 7. From Review &Checkout page if the 2. Click on free signup Login with your Total Due is $0.00 then only select email id and password terms and conditions 3. verification email will be send to your 8. Click on "Complete Order" button e.g. email it-xi-textbook.tk 4. open your email and click on "verify 9. From Order Confirmation Screen email" click on "Click here to go to Client 5. Click on "Get Started" Area" button 6. From My Website page click on Park the website domain : "+Create New site" button Go to http://www.000webhost.com 7. Type your website name and any website perform the following steps first password 1. Select "MyWebsite"--> "Manage 8. e.g. website name as :- it-xi-textbook Website" -->dashboard-->Tools--> 9. From File Manager box select "Up- Set Web Address load" option to upload your web pag- 2. Click on "+Add domain" button then es. Home page of the website must be select radio button Park domain and named as "index.html" (Select all then click on "Next" button 22 3. Type the site URL acquired by you 2. "My Domains"-->"Manage Domain" from Freenom.com e.g. it-xi-textbook. 3. From Domain details screen click on tk. (Remember don’t give http or / or "Management Tools" --> any special character) "Nameservers" 4. Then click on "Park domain" button. 4. Change the radio button to "Use 5. You may see domain status as custom nameservers (enter below)" "pending" for sometime. Once it is and type the NameServer1 as through from the 000webhost side you "NS01.000WEBHOST.COM"and can see the domain status as "parked". NameServer2 as 6. Configure your domain's DNS "NS02.000WEBHOST.COM" provider to point to the 5. Click on "Change Nameservers" ns01.000webhost.com and button ns02.000webhost.com as your 6. Logout from the my.freenom.com nameservers. 7. Type the website address in the Redirect the domain to free server : browser's address bar to view your Now follow the final steps given website below through my.freenom.com website 8. The website can also be seen from 1. Sign in to my.freenom.com click on your mobile. Hosting is done. "Services"--> Summary  Html5 has introduced new types in like number, date, Tel, email, search, URL, range, month, week, color.  Few attributes of can be used for validation purpose.  is used by search engines to search information that is provided with the webpage. It is inserted in the  CSS- Cascading Style Sheet describes how HTML elements are to be displayed on screen, paper, or in other media.  CSS syntax Selector{Property1: value1; Property2: value2}  The tag defines an ordered list. An ordered list can be numerical or alphabetical.  An unordered list created using the tag, and each list item starts with the tag. The list items in unordered lists are marked with bullets (small black circles), by default.  To insert Audio and Video in a web page, and are used which specifies the source with the file location.  An image with multiple hyperlinks is called an image map. The usemap attribute acts as a pointer which indicates that the image is a client side image map.  The element creates an inline frame. 23  Exercise Q 1. Fill in the blanks. Q2. State whether the following statement is True or False. 1. The………………element is a staring element in an HTML, it 1. HTML is an Object Oriented indicates that document type Programming Language. definition being used by the 2. Charset is used for character document. encoding declaration. 2. The……………. is a tag in html 3. An unordered list can be that describe some aspects of numerical or alphabetical. contents of a webpage. 4. Multilevel list can be created in 3. The tag defines HTML 5. an……………… 5. Srccode specifies the HTML 4. An unordered list is created using content of the page to show in the the…………….. tag. 6. The ‘controls’ attribute is not 5. T h e … … … … … … … e l e m e n t used to add play, pause, and creates an inline frame. volume. 6. …………….tag is used to specify 7..cs is the extension of CSS file video on an HTML document. Q.3. Choose Single correct answer 7. If a web developer wants to add from the given options. the description to an image he must use ……… attribute of 1. ………………….element used tag. to create a linking image. 8. The……………… property is a) b) used to set position for an element. c) d) 9. The float property defines 2. The ……………tag is used to the………………..of content. embed audio files on Webpages. 10. ………………is used with a) b) elements that overlap with each c) d) other. 24  3. A programmer wants to define 4. Client-side image map can be range for age between 18 to 50, created using two elements he will use a form with following …………… and………... appropriate control. a) b) a) number b) compare c) d) c) range d) Textboxes e) 4. ……….character is used to Q.5. Choose Three correct answers create id in CSS. from the given options. a) % b) $ 1. Attributes of tag c) @ d) # is…………………….. a) href b) src Q 4. Choose Two correct answers from c) coords d) data the given options. e) alt f) usemap 1. List within another list 2. Attributes used with iframe either………list or………list is are……………….. called nested list. a) srcdoc b) name a) multilevel b) order c) att d) src c) unordered d) general e) href f) loop e) cascading 3. Following are the Form 2. Image maps are of two types controls…………… ……...........and ………….......... a) Network side a) email b) search c) label d) video b) Client Side e) tel f) audio c) Computer side 4. Attributes used with d) Server Side tag………………………….. e) n-computing a) autoplay b) href 3. A CSS rule set contains……….. c) controls d) cntrl and……………………............... e) loop f) bgsound a) Set b) selector c) post d) declaration block e) < > 25  5. CSS types are …………………, 1. The background colour of the ………...... and………………… company name should be in green. a) internal b) external 2. The text colour of the c) control d) inline company name should be red. e) loop f) style 3. The heading should be large with font ''comic sans ms'' 6. Positioning types in CSS 4. The description of the are…………………… company should be displayed in blue color in a paragraph. a) Static b) fixed c) absolute d)position 2) Write Html5 code with CSS as follows- e) dynamic f) nested 1. To create form to accept 7. Types of floating properties name,age, email address, are………,…………, ………….. from the user. a) left b) zero 2. Create a submit button to c) right d) all send the data. e) none f) dock 3. The heading of the form should have a background colour and a different font Q. 6. Match the pair style. A B a) Client side 3) Write Html5 code with CSS as 1) image map follows- 2) usemap b) CSS Property 1. Create ordered list with names c) bulleted list of tourist Cities. 3) color d) Image as a 2. Create unordered list with 4) submit tourist places of those cities. button 3. Divide the list into two 5) e) inserts an sections left and right by image using CSS. Q.7. Programs.  1) Write a program using html with following CSS specification- 26  2 Digital Marketing Let us learn Mr. Suhas : "Good morning sir !" I want to understand new method of marketing  Meaning of Marketing. in the web technology and how it defers  Concept of Digital Marketing. from traditional marketing?  Channels in Digital marketing. Dr Ajay : Marketing has always been  Concept of Search Engine. about connecting with your audience in the right place and at the right time.  Organic and paid search. In today’s era of technology it simply  Categories of SEO Black Hat SEO means you need to meet them where they and White Hat SEO. are spending more time and that is on the  Different SEO strategies. internet.  Long tail and short tail keywords.  Actual working with SEO.  Concept of Google Analytics. Dr. Ajay is Senior Vice President marketing at "Click and Boost India Private Ltd". He is a digital marketing Fig. 2.1 : Traditional Marketing Vs expert and social media specialist. He Digital Marketing has over 10 years experience in the digital marketing. Traditional Marketing examples Mr. Suhas has floated a small might include tangible items such as company which manufactures springs business cards, print ads in newspapers and bearings required for machines. He or magazines. It can also include posters, is facing a problem to market his product commercials on TV and radio, billboards through website. He appointed Dr. Ajay and brochures. as consultant for Digital marketing. The world of digital marketing Given below is the conversation continues to evolve as long as technology between Dr. Ajay and Suhas. The idea continues to advance. Examples of digital behind this dialogue lesson is to make marketing include things like websites, students understand the different aspects social media mentions, YouTube videos, of digital marketing. and banner ads. Specifically, digital 27 marketing is similar to traditional product you wanted and your ultimate advertising, but using digital devices. buying decision would have been based Mr. Suhas : Sir, You mean to say on the customer reviews, features, and that online advertising means digital pricing you researched. marketing? Purchasing decisions begin online Dr Ajay : Well, you are partially correct today. Hence, an online presence is but not fully, let me explain. Digital absolutely necessary regardless of what marketing is not new. It's been around you sell. since the Internet started. Now digital Mr. Suhas : Ok Sir, How digital marketing is becoming popular due to the marketing will help me to promote my increase in internet users, mobile phone business online? Is there any tactic or users and digital content consumption. method or channel to sell my product Think about the last important online? purchase you made on Internet. Before Dr. Ajay : Yes Sir! Understand some buying, you probably would have Channels in Digital Marketing. searched the internet to learn about the Fig. 2.2 : Channels in Digital Marketing. 28 1. Search Engine Optimization : SEO customers. The channels that play a is the process of boosting content and part in your content marketing include technical set-up of the website so that video, blogs, e-books etc. it appear at the top of a search engine 6. Social Media Marketing : Social result for specific keywords. SEO is to media marketing is the use of social attract visitors to your website when media platforms and websites to they search for products or services promote a product or service. Social related to your business. media marketing is the use of social 2. Mobile Marketing : From SMS and media platforms to connect with your MMS to in-app marketing, there are audience to build your brand, increase many ways to go through with mobile sales, and drive website traffic. marketing. The major social media platforms 3. Email Marketing : Companies are Facebook, InstaGram, Twitter, communicate with their audience LinkedIn, Pinterest, YouTube, and through email marketing. Emails are Snapchat. used to promote content, events, and Mr. Suhas : Ok sir. So I need to use discounts, and also to direct people any one of the above channel to increase toward the business’s website. sale of my product over the internet? But what is Search Engine? And how shall 4. Paid Search : Paid search or pay- my website rank high on search engine? per-click (PPC) advertising refers to the "sponsored result" on the search Dr. Ajay : Ok! We will see the terms one engine results pages (SERP). PPC ads by one are visible, flexible, and effective for Search Engine : A web search engine or many different types of organizations. Internet search engine is a software system With paid search, you only pay when that is designed to carry out web search your ad is clicked. You can tailor your (Internet search), which means to search ads to appear when specific search the World Wide Web in a systematic way phrases are entered, targeting them to for particular information specified in a a particular audience. textual web search query. 5. Content Marketing : Have you heard The search results are generally the saying, "Content is king?" Quality presented in a line of results often referred content is the fuel that drives your to as Search Engine Results Pages Digital Marketing strategies. Content (SERPs). Marketing denotes the creation The information may be a mix of and promotion of content assets in links to web pages, images, videos, info order to generate brand awareness, graphics, articles, research papers, and lead generation, traffic growth, and other types of files. 29  Do it yourself Make a list of Search Engines, Browsers you know. Dr. Ajay : To understand this see the comparison of Search Result of Yahoo and Google for same product. (Fig. 2.3 and 2.4) Fig. 2.3 : Result of Yahoo Search Engine to buy a new car. Fig. 2.4 : Result of Google Search Engine to buy a new car. 30  Now you can easily differentiate Now I will tell you the difference the result shown by two search engines between Organic Search and Paid i.e. Yahoo and Google. It is showing search. Look at these two figures fig. different websites having information for 2.5(a)(b) and you will understand buying new car. The entire SEO works that you can pay Google or any Search on keywords. If those keywords are being Engine and rank your website on top of used in the content of the website then search. The keyword Ad marked here that website may rank in top ten or twenty fig 2.5(a) shows that this site has paid search results. Google search engine to rank him at top. Mr. Suhas : oh yes! It is crystal clear Fig.2.5(b) shows the keyword Sponsored now how search engine plays important which is also paid site to rank the images role in ranking the website. Please tell and information at top. In fig 2.6 the me shall I pay and rank my website or is searched web site is so popular that many there any other way which is economical users must have visited it. Therefore it which I can use to rank without paying. has become popular and it is ranked by search engine on its first page. Why we Dr. Ajay : There are two ways to rank must opt for first five pages because as website one can pay and rank and other we go on higher number customer does is without payment one can rank website not search those pages or there are very doing SEO process. i.e. Organic Search. less visitors as page number grows. Fig. 2.5 (a) : Links with advertisements are called as "Paid Search" 31  Fig. 2.5 (b) : Links with advertisements are called as "Paid Search" Fig. 2.6 : Links with Organic Search 32 Dr. Ajay : Let me explain you how we can rank our website with the help of Do it yourself SEO. Techniques and strategies used to Distinguish between Black Hat SEO get higher search rankings, and breaking and White Hat SEO. search engine rules are 1. Black Hat SEO Mr. Suhas : I heard something about On Page SEO and Off Page SEO; can you 2. White Hat SEO please tell me something about it? Mr. Suhas : What do You Mean by Black Dr. Ajay : Search engines don’t look Hat and White Hat SEO? at a page the way a person looks at it. Dr. Ajay : They can only read the source code of the page. If you right-click on any webpage, i) White hat SEO involves looking for you’ll likely to see an option for viewing ways to improve user experience that page’s source code (HTML code). ethically and genuinely. It ensures If you’re not familiar with HTML code that web page content should have it will look like a jumbled mess. There been created for the users and not just are number of ways to approach SEO for the search engines. to generate traffic to your website. Those ii) Black hat SEO relies on manipulating are On-page SEO, Off-page SEO and Google's algorithm to improve Technical SEO. rankings. By creating a copy of a 1. On-Page SEO : Anything within popular website which shows contents < > is HTML code. Anything between similar to the original web site. The two sets of tags is something that Google crawler reads the content and could get put on the page for a person thinks the website is original one and it to read. The text inside the < > tells ranks the page. Crawler is a program browsers and search engines how to used by search engines to collect data render the information between the from the website. tags. The reason it is called on-page SEO is that these changes are visible Note : REMEMBER - Always follow to readers. It is a balance between a White Hat SEO tactic and don't try giving the right information to search to fool your site visitors. Be honest and engines without compromising the definitely you will get proper rank. Now information that your customers are Google’s search algorithm has become reading on the page. intelligent as it finds you are fooling to 2. Off-Page SEO : Off-page SEO is rank your website, It ranks you down about everything that doesn’t happen and black list you and your business go directly on your website. Off-page down in open market. SEO is about, among other things, 33  link building, social media, and local Mr. Suhas : Sir, What are keywords? SEO. It allows generating traffic to Dr Ajay : To rank your website you must your site. follow the tactic of Long Tail and Short 3. Technical SEO : Technical SEO Tail keyword concept. is a very important step in the whole Dr. Ajay : A long tail is a long keyword SEO process. If there are problems and short tail is a short keyword. You can with your technical SEO then it is use your intelligence to rank your website likely that your SEO efforts will using small keywords or long keywords, not generate the expected results. A let me give you an example. If I want to simple example of technical SEO is search shoes and I type keyword ‘shoes’ site speed. People do not like to wait on search engine. It is a small keyword for slow websites. If your pages load used by millions of people. Here your slowly, you will be ranked lower search result shows only popular websites than a comparable site that has faster on the first few pages. Someone with new pages. Another example is mobile born website about 'shoes' can't expect his friendliness. If your site looks bad on website to be shown on top. But now if a mobile device, search engines can he uses a keyword in the “Brown detect that and lower its rankings on Soft Comfortable Running shoes” then mobile-specific search engines. such a long keyword may be used by less Mr. Suhas : Oh yes sir! Now I understand websites. This may result in ranking the I must put relevant content on my website. website at higher position. But then how do I decide whether my Mr. Suhas : Now suggest me a tool which content is relevant or not? can work and tell me what is short fall in my website so I can successfully evaluate Dr. Ajay : Your company is manufacturer my website optimization. of springs and bearings. While developing the website a website designer must take Dr Ajay : Now I will tell you very care to add keywords such as Compression important things about SEO Audit and Springs, Extension Springs, Drawbar how SEO optimises the website. An SEO Springs etc. If such keywords are used in Audit helps to find out what could be the tag while creating a website done to improve ranking on search that means topic or aim of the website is engines, so that consumers could find same and its contents are relevant. The the website with greater ease. content must be designed using HTML5 SEOptimer is a free SEO Audit Tool that or HTML tags i.e. use will perform a detailed SEO Analysis. etc Tags. Even the alt attribute of Note : There are many SEO Audit tools images must be used with keywords so available on internet such as woorank. crawlers cannot read image but they read com, varvy.com, seositecheckup.com, description and classify the content. etc. 34 It provides clear and actionable keywords or sets of keywords those recommendations that can be taken to will rank your site in search engine. improve your online presence. Some of 3) Links : the ways to optimize the webpage for i) Number of Backlinks : Backlinks SEO are:- are links that are directed towards 1) HTML Header : your website. Backlinks are important i) : Webpages having for SEO because some search engines, HTML code should start with especially Google, will give more. credit to websites that have a good ii) tag : A title tag is an HTML number of quality backlinks, and element that specifies the title of a consider those websites more relevant web page. Title tags are displayed on than others in their results pages for a search engine results pages (SERPs) search query. as the clickable headline for a given ii) Broken Links : Broken links are links result therefor it is recommended to that send a message to its visitors that use tag. the webpage no longer exists, iii) tag : Meta tags are snippets triggering a 404 error page. of code that tell search engines iii) Friendly URLs : SEO friendly URLs important information about your are URLs that are designed to meet web page, is also essential to boost the needs of users and searchers. your On-Page SEO. Specifically, URLs optimized for 2) Body Content : SEO tend to be short and keyword- i) Heading Tags : Heading tags are rich. You give links to Big Banner necessary for both usability, and SEO Website and they give you link back of your web page. Search engines to your website. This will create primarily take keywords from content, friendly website support to your heading tags, and titles to develop website. the context of a web page. Therefor 4) Indexing : Indexing is the process of the webpage should include proper adding web pages into Google search. It heading tags from to is very important in SEO to increase the wherever required. ranking of the webpages. ii) tag with alt attribute : By 5) Googlebot : Googlebot is the Google’s adding an alt text, you provide users spider. i.e. the robot that pass over the of screen readers and search engines Web and indexes pages for inclusion in with a textual description of what's on Google’s database. Googlebot collects that image. This improves accessibility documents from the web to build Google's and your chance of ranking high in search index. image search. 6) Others Factors : iii) Keyword Consistency - Keyword i) Robot.txt : Robots.txt file is what consistency means having the tells the search engines which pages 35  to access and index on your website tab icon URL icon, or bookmark icon. and which not. For example, if you A favicon is a visual representation of specify in your Robots.txt file that your website and business, so users you don’t want the search engines to will identify with your brand based on be able to access your thank you page, the favicon you use. that page won’t be able to show up in vi) Legible Font Sizes : It means that a the search results and web users won’t font size declared as bigger, smaller, be able to find it. Your Robots.txt file or the same size as should be easily instructs these programs not to search readable (legible) when a user is your thank you page on your site viewing the page on mobile or smaller which you designate using a screens. “disallow” command as follows : vii)Tap Target Sizing : A tap target is User-agent: * any element on a web page that a user Disallow: /thankyou.html interacts with. These include action buttons, links, ads, etc. that a user taps ii) Device Rendering : This check on when accessing a web page using visually demonstrates how your page a touchscreen. Therefor the size of renders on different devices. It is such taps/touch elements should be important that your page is optimized relevant neither too small nor too for mobile and tablet devices as today big. the majority of web traffic comes 7) Performance Results : from these sources. i) Number of Resources : This check iii) Flash : Flash is an interactive media displays the total number of files that technology that makes sites more need to be retrieved from web servers interesting. At the same time, Flash to load your page. As a general rule, can kill your search rankings because having more files to retrieve increases search engines can’t index Flash the number of server requests and can content directly. subsequently increase page load time. iv) iFrames : Similarly to Flash, frames It is a good to remove unnecessary are a burden in terms of SEO. When files or consolidate files like styles you use frames on a page, you and scripts which are less required. confuses search engines which may ii) Page Speed Info : Page speed does rank down your website. affect SEO as it is a direct ranking v) Favicon : Means favourite icon also factor. While creating a website, known as a shortcut icon, website icon, attention is given on the design, content and as many visuals as possible. This can slow down the website and obstruct usability. Fig 2.7 Favicons of popular websites 36 iii) Page Size Info : The term page size in the created website it builds familiarity the SEO world refers to the and trust about the website. downloaded file size of a given web 9) SEO Security Checks : Security is page. important to ensure your website protects 8) SEO Social Media Optimisation : user data, doesn't become compromised It deals with enhancing the website's or experience downtime or data loss. It ranking, using Interactive Communities includes SSL Enabled yes or no whether like Facebook, twitter, blogs, forums etc. it follows HTTPS, Malware Check, Email When these communities have links to Privacy. Fig. 2.8 : SEO Audit & Reporting Tool Screen Being a free Website Audit Tool SEOptimer will not allow you to audit more than one or two websites per day. In that case you can try with the other Audit Tool mentioned on page number 34. Mr. Suhas : Sir, I am also facing this Dr Ajay : Yes! I will tell you why this problem. Many people visit my website is happening please don’t be depressed. but they do not purchase or place order to Take a look at funnel drawn below. buy my product. This is very depressing. You must try to understand that Sir please tell me what to do? many users may come to your website Why Digital Analytics? but conversion will be little because the customer is having more choice and the Acquisition Knowing about your website market has become consumer oriented. Acquisition Behavior Developing an interest Understand that market behaves in Behavior Conversion Watching a video on your site 3 stages Acquisition, behavior and Clicking on a product description conversion Conversion Purchasing Funnel User becomes a customer Note : SEO for sample website refer Fig. 2.9 : Purchasing Funnel appendix - I. 37  Acquisition : Means creating interest The Google Analytics Report contains: in the mind of customer about your product. He must know that this Users : how many visitors came to product is essential for him without your website (in the past 7 days) this product he cannot satisfy his need. Sessions : how many interactions a visitor makes with your website in a Behavior : Once he knows ab