Page 151 - Web Applications (803) Class 11
P. 151

WYSIWYG Editor
                 WYSIWYG stands for What You See Is What You Get. This type of editor allows the developer to see what the end result
                 will look like when the document is created. These editors provide various tools and graphical interfaces where the
                 web pages are designed. Examples of WYSIWYG editors are Adobe Dreamweaver, Amaya and Google Web Designer.
                 Text Editor

                 We can create HTML documents using normal text editors like Notepad or Wordpad. The user should have a proper
                 knowledge of the HTML commands to develop a web page.

                 HTML Tags and Attributes
                 Tags are the basic building blocks of an HTML document. A tag is a formatting specification that directs a web browser
                 how to display the information it marks up or encloses (text, picture, video, audio, and so on). Attributes are present
                 in the majority of tags.
                 Attributes are tag sub-elements or features that provide additional functionality by allowing a user to change the
                 marked-up elements in various ways. To better understand tags and their attributes, see the example given below:
                                                 <font color=blue size=4>





                                                    Tag                  Attribute


                 Structure of an HTML Document
                 The basic structure of an HTML document is as follows:

                 <html>                                              ÐÐThe <html> tag is the root element of an HTML document.
                 <head>                                              ÐÐÐThe <head> tag contains important information about the
                 <title> My webpage </title>                           HTML page.
                 </head>                                             ÐÐÐThe <title> tag specifies a title for the HTML page which is
                 <body>                                                shown in the browser’s title bar or in the page’s tab.
                                                                     ÐÐÐMain contents of the document are defined by the <body>
                 Tiger Tiger, burning bright, in the forests of the night.  element,  and  contains  all  the  visible  contents,  such  as
                 </body>                                               headings, paragraphs, images, hyperlinks, tables, lists, etc.
                 <html>

                       Do You Know?


                       •  There are Two Types of Tags—Container Tag and Empty Tag
                       •  Container Tags have starting as well as ending tag. For example, <font color= “Blue”> I am writing blue text </font>
                       •  If  you’re  going  to  define  attributes  for  a  container  tag,  do  it  in  the  starting  tag.  For  example,
                          <body bgcolor= “red”> Document Content </Body>
                       •  Empty Tags like <br>, <hr> have only the starting tag.
                       •  HTML Tags are not case sensitive.


                   2.4 CREATING AND SAVING AN HTML DOCUMENT

                 Let us start  by designing the first web page using the basic tags.
                 Step 1:   Open the Notepad and write the following HTML code:

                        <!DOCTYPE html>
                        <html>
                                                                            Website Development using HTML and CSS   149
   146   147   148   149   150   151   152   153   154   155   156