SlideShare a Scribd company logo
1 of 25
Download to read offline
-Rajat Shah
-Soumya Ghosh
   What is Internet and how it works.
    ◦   DNS (Domain Name System)
    ◦   IP address
    ◦   Protocols: HTTP
    ◦   World Wide Web (WWW)
   Web Programming
    ◦ HTML
    ◦ CSS
    ◦ Basics of Server-side Scripting.
   Its is vast network of inter connected
    computers that uses a specific set of rules
    called Internet Protocols (abbreviated as IP) to
    communicate.

    Provides the physical backbone for a number
    of interesting applications.
   Is a part of the Internet "designed to allow
    easier navigation through the use of graphical
    user interfaces and hypertext links between
    different addresses“
   Uses the HTTP protocol.
   Global set of documents, images and other
    resources, logically interrelated by hyperlinks
    and referenced with Uniform Resource
    Locators(URLs).
   IP: Internet Protocol
    ◦ Responsible for labelling individual packets with the source
      address and destination address of two computers
      exchanging information over a network.
    ◦ IP Address:
    ◦ Eg.: IPv4: 172.16.254.1 (32 bits)
    ◦        IPv6: 2001:db8:0:1234:0::567:8:1 (128 bits)
    ◦ IP can be static or dynamic.

• HTTP: Hyper Text Transfer Protocol
  • Is the language Web browsers and Server use to
    communicate using IP.
  • Standard which describes how a browser makes a request
    to the web server program.
  • HTTPS?
   DNS (Domain Name System)
    ◦ Responsible for converting the hostnames to the IP Address.
    ◦ For example, the domain name www.example.com
      translates to the addresses 192.0.43.10 (IPv4) and
      2620:0:2d0:200::10 (IPv6)
    ◦ Name Server may query various website while resolving the
      address of the host name.

• UR(Uniform Resource Locator)

    ◦ Eg.
      http://www.vnit.ac.in/lecture/Introduction_to_web.html

   ISP (Internet Service Provider):
    ◦ Are those private companies which provide internet
      connection. We get connected to internet via our ISP.
   Client:
    ◦ Content or service requesters.
    ◦ Web browsers such as Mozilla, Chrome are clients.
    ◦ Functionalities?

   Server:
    ◦ The provider of a resource or service.
    ◦ High speed computers with large hard disk capacity.
    ◦ A server machine is a host that is running one or more server programs
      which share their resources with clients.
    ◦ Functionalities?

   Proxy servers:
    ◦ Acts as an intermediary for requests from clients seeking resources from server.
    ◦ Eg: The proxy server we user in our hostels : 172.31.16.10
    ◦ How does it speed up browsing?


    How it differs from Peer to Peer (P2P)?
   To view a web page from your browser, the
    following sequence happens:
    ◦ You either type an address (URL) into your "Address
      Bar" or click on a hyperlink.
    ◦ Your browser sends a request to your ISP server
      asking for the page.
    ◦ Your ISP server using DNS looks in a huge database
      of internet addresses (IP) and finds the exact host
      server which houses the website in question, then
      sends that host server a request for the page.
    ◦ The host server sends the requested page to your
      ISP server.
    ◦ Your ISP sends the page to your browser and you
      see it displayed on your screen.
   Commonly used languages:
    ◦ HTML: Defines the structure of a web page.
    ◦ CSS: Defines the styling and layout of contents of a
      webpage.
    ◦ Javascript: Client side scripting language. It adds
      interactivity to a web page.
    ◦ PHP (Hypertext Preprocessor): Server side scripting
      language.
    ◦ SQL (Structured Query Language): Language used to
      query databases.
   HTML stands for HyperText Markup
    Language.
   HTML is not a programming language, it is a
    markup language.
   Is the core technology in which all Web pages
    are written.
   HTML tags are interpreted by a web browser
    and composed into visible or audible
    webpages.
   HTML tags are case-insensitive.
    The majority of HTML tags do require both an open and a close tag.
    All HTML documents start with <html> tag and end with </html>

An example of a simple HTML document:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
  <HEAD>
     <!—Contains title, meta tags, links to external scripts(CSS, Javascript) -->
    <TITLE>My first HTML document</TITLE>
  </HEAD>
  <BODY>
     <!—Contains the content of the web page-->
    <P>Hello world!
  </BODY>
</HTML>
   HTML headings are defined with the <h1> to <h6>
    tags. The lower the number, the larger the heading
    size.
   HTML paragraphs are defined with the <p> tag.
    Most browsers automatically put a line break and
    space after a </p> tags.
   HTML links are defined with the <a> called anchor
    tag.
    ◦ Absolute reference:
        <a href=“http://vnit.ac.in”>VNIT</a>
    ◦ Relative reference:
         <a href=“/contacts”>VNIT, Contacts</a>
        Target attribute?
   HTML elements can have attributes
   Attributes provide additional information about an
    element
   Attributes are always specified in the start tag
   Attributes come in name/value pairs
    like: name="value"
   Example:
       <a href="http://vnit.ac.in">This is a link</a>
       Here the attribute name is href and its value is
http://vnit.ac.in
   Images can be added to a web page using img
    or through CSS.
    ◦ Eg.:
        <img src=“abc.jpg” alt=“A image” width=“300px”
        height=“200px”/>
    ◦ Use of alt, src , width and height attributes?
   With HTML5, we can directly add a audio or
    video files into a web page
    ◦ Eg.: <audio controls="controls">
               <source src="audio file.mp3"
        type="audio/mpeg">
             </audio>
   Tables are an excellent way to organize and
    display information on a page.
    ◦ defined using the <table> tag.
    ◦ A table is divided into rows with the <tr> tag, and
      each row is divided into data cells using the <td>
      tag. The letters td stand for “table data,” which is
      the content of a data cell. A data cell can contain
      text, images, lists, paragraphs, forms, horizontal
      rules, tables, and so on.
   HTML forms are used to collect different
    kinds of user input. A form is an area that can
    contain form elements.
   Form elements are elements that allow the
    user to enter information in a form (like text
    fields, text area fields, drop-down menus,
    radio buttons, check boxes, and so on).
   Tags used:
    ◦ Form, Input, textarea, select, etc.
   Language used to design a webpage.

   Styles enable you to define a consistent 'look' for your
    documents by describing once how headings,
    paragraphs, quotes, etc. should be displayed.

   Latest version is CSS3.

   Can be inline, in page, external.
   Inline:
    ◦ Use style attribute. Multiple styles separated by semi-colon.
    ◦ Always defined in opening tag.
    ◦ <body style=“background-color:green;”>
   In page :
    ◦ Use style tag. Multiple styles separated by semi-colon.
    <style type=“text/css”>
        body
        {
               background-color:green;
            Color: red;
        }
    </style>
   External:
    ◦ a separate CSS file referenced from the document
                 <link href="path/to/file.css" rel="stylesheet">
    ◦ Style sheet syntax is made up of three parts:
        selector {property: value}
   Class:
    ◦ When multiple elements in a web page have similar
      properties, we define class of them.
       Class attribute is used.
       A single dot (.) is used to define property of a class.
       Eg.:
             .class_name
             { color:blue; }
   Id:
    ◦ Specifies a unique id for an element.
       Id attribute is used.
       A single hash (#) is used to define property of a class.
       Eg.:
             #id_name
             { color:blue; }
   Hand coding, use Nodepad++.
   Use a WYSIWYG editor like Adobe,
    dreamweaver.
   Use online services like Blogspot, Google site,
    Wordpress, etc.
   Use Content Management System (CMS) like
    Wordpress, Joomla, etc.
   http://w3schools.com
-Rajat Shah
rajat.shah200792@gmail.com

More Related Content

What's hot (20)

Webpage style with CSS
Webpage style with CSSWebpage style with CSS
Webpage style with CSS
 
Intro to Web Standards
Intro to Web StandardsIntro to Web Standards
Intro to Web Standards
 
Dynamic HTML (DHTML)
Dynamic HTML (DHTML)Dynamic HTML (DHTML)
Dynamic HTML (DHTML)
 
uptu web technology unit 2 html
uptu web technology unit 2 htmluptu web technology unit 2 html
uptu web technology unit 2 html
 
Html and css
Html and cssHtml and css
Html and css
 
Intr to-html-xhtml-1233508169541646-3
Intr to-html-xhtml-1233508169541646-3Intr to-html-xhtml-1233508169541646-3
Intr to-html-xhtml-1233508169541646-3
 
Dhtml ppt (2)
Dhtml ppt (2)Dhtml ppt (2)
Dhtml ppt (2)
 
Unit 3 (it workshop).pptx
Unit 3 (it workshop).pptxUnit 3 (it workshop).pptx
Unit 3 (it workshop).pptx
 
Url
UrlUrl
Url
 
Web Information Systems XML
Web Information Systems XMLWeb Information Systems XML
Web Information Systems XML
 
Introduction to web services
Introduction to web servicesIntroduction to web services
Introduction to web services
 
Web Information Systems Html and css
Web Information Systems Html and cssWeb Information Systems Html and css
Web Information Systems Html and css
 
Introduction to Web Standards
Introduction to Web StandardsIntroduction to Web Standards
Introduction to Web Standards
 
Complete Lecture on Css presentation
Complete Lecture on Css presentation Complete Lecture on Css presentation
Complete Lecture on Css presentation
 
Html css workshop, lesson 0, how browsers work
Html css workshop, lesson 0, how browsers workHtml css workshop, lesson 0, how browsers work
Html css workshop, lesson 0, how browsers work
 
Dhtml
DhtmlDhtml
Dhtml
 
Unit iv xml dom
Unit iv xml domUnit iv xml dom
Unit iv xml dom
 
Html introduction
Html introductionHtml introduction
Html introduction
 
Cascading style sheets
Cascading style sheetsCascading style sheets
Cascading style sheets
 
Advanced dreamweaver
Advanced dreamweaverAdvanced dreamweaver
Advanced dreamweaver
 

Viewers also liked

Eltra Opulent Associates Ltd Powerpoint Presentation Web Company Profile
Eltra  Opulent Associates Ltd   Powerpoint Presentation Web  Company ProfileEltra  Opulent Associates Ltd   Powerpoint Presentation Web  Company Profile
Eltra Opulent Associates Ltd Powerpoint Presentation Web Company ProfileEltra Consultants
 
Schemaless Change detection in XML Documents using Semantic Identifiers
Schemaless Change detection in XML Documents using Semantic IdentifiersSchemaless Change detection in XML Documents using Semantic Identifiers
Schemaless Change detection in XML Documents using Semantic IdentifiersKailaash Balachandran
 
Intro to Web Design
Intro to Web DesignIntro to Web Design
Intro to Web DesignKathy Gill
 
Life at Siegel+Gale
Life at Siegel+Gale Life at Siegel+Gale
Life at Siegel+Gale Siegel+Gale
 
THANATOS Digital Agency | Company Profile ENG
THANATOS Digital Agency | Company Profile ENGTHANATOS Digital Agency | Company Profile ENG
THANATOS Digital Agency | Company Profile ENGTHANATOS Digital Agency
 
Company Profile Design: Best Practices 2016
Company Profile Design: Best Practices 2016Company Profile Design: Best Practices 2016
Company Profile Design: Best Practices 2016Company Profile Design
 
Web Design 101
Web Design 101Web Design 101
Web Design 101T.S. Lim
 
eXo Digital Agency - Company Profile
eXo Digital Agency - Company ProfileeXo Digital Agency - Company Profile
eXo Digital Agency - Company ProfileeXo Digital Agency
 
TEN Creative Design Agency Creds
TEN Creative Design Agency CredsTEN Creative Design Agency Creds
TEN Creative Design Agency CredsTEN Creative
 
LEAP Agency Company Profile
LEAP Agency Company ProfileLEAP Agency Company Profile
LEAP Agency Company ProfilePrecision Group
 
Ppt of company profile in project
Ppt of company profile in projectPpt of company profile in project
Ppt of company profile in projectshivakumaranupama
 
Tcs company profile presentation -sample
Tcs company profile presentation  -sampleTcs company profile presentation  -sample
Tcs company profile presentation -sampleSivaraj Ganapathy
 
Company Profile Sample
Company Profile SampleCompany Profile Sample
Company Profile SampleYagika Madan
 

Viewers also liked (15)

Eltra Opulent Associates Ltd Powerpoint Presentation Web Company Profile
Eltra  Opulent Associates Ltd   Powerpoint Presentation Web  Company ProfileEltra  Opulent Associates Ltd   Powerpoint Presentation Web  Company Profile
Eltra Opulent Associates Ltd Powerpoint Presentation Web Company Profile
 
Schemaless Change detection in XML Documents using Semantic Identifiers
Schemaless Change detection in XML Documents using Semantic IdentifiersSchemaless Change detection in XML Documents using Semantic Identifiers
Schemaless Change detection in XML Documents using Semantic Identifiers
 
Introduction to Web Designing
Introduction to Web DesigningIntroduction to Web Designing
Introduction to Web Designing
 
Intro to Web Design
Intro to Web DesignIntro to Web Design
Intro to Web Design
 
Life at Siegel+Gale
Life at Siegel+Gale Life at Siegel+Gale
Life at Siegel+Gale
 
THANATOS Digital Agency | Company Profile ENG
THANATOS Digital Agency | Company Profile ENGTHANATOS Digital Agency | Company Profile ENG
THANATOS Digital Agency | Company Profile ENG
 
Company Profile Design: Best Practices 2016
Company Profile Design: Best Practices 2016Company Profile Design: Best Practices 2016
Company Profile Design: Best Practices 2016
 
Web Design 101
Web Design 101Web Design 101
Web Design 101
 
eXo Digital Agency - Company Profile
eXo Digital Agency - Company ProfileeXo Digital Agency - Company Profile
eXo Digital Agency - Company Profile
 
TEN Creative Design Agency Creds
TEN Creative Design Agency CredsTEN Creative Design Agency Creds
TEN Creative Design Agency Creds
 
LEAP Agency Company Profile
LEAP Agency Company ProfileLEAP Agency Company Profile
LEAP Agency Company Profile
 
Mix Digital Marketing Agency Credentials
Mix Digital Marketing Agency CredentialsMix Digital Marketing Agency Credentials
Mix Digital Marketing Agency Credentials
 
Ppt of company profile in project
Ppt of company profile in projectPpt of company profile in project
Ppt of company profile in project
 
Tcs company profile presentation -sample
Tcs company profile presentation  -sampleTcs company profile presentation  -sample
Tcs company profile presentation -sample
 
Company Profile Sample
Company Profile SampleCompany Profile Sample
Company Profile Sample
 

Similar to How the Internet Works: A Comprehensive Guide to Internet Protocols, Web Programming, and More

Les Basiques - Web Développement HTML5, CSS3, JS et PHP
Les Basiques - Web  Développement HTML5, CSS3, JS et PHPLes Basiques - Web  Développement HTML5, CSS3, JS et PHP
Les Basiques - Web Développement HTML5, CSS3, JS et PHPHamdi Hmidi
 
WEB TECHNOLOGY:Web Essentials and Markup Language HTML
WEB TECHNOLOGY:Web Essentials and Markup Language HTMLWEB TECHNOLOGY:Web Essentials and Markup Language HTML
WEB TECHNOLOGY:Web Essentials and Markup Language HTMLsmitawagh14
 
Website/Web Applications / Static vs Dynamic Website / Web Browser /
Website/Web Applications  / Static vs Dynamic Website / Web Browser / Website/Web Applications  / Static vs Dynamic Website / Web Browser /
Website/Web Applications / Static vs Dynamic Website / Web Browser / Sachin Yadav
 
Choice of programming language for web developing.
Choice of programming language for web developing.Choice of programming language for web developing.
Choice of programming language for web developing.Mohammad Kamrul Hasan
 
Ncp computer appls web tech asish
Ncp computer appls  web tech asishNcp computer appls  web tech asish
Ncp computer appls web tech asishNCP
 
Html intake 38 lect1
Html intake 38 lect1Html intake 38 lect1
Html intake 38 lect1ghkadous
 
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptx
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptxINDUSTRIAL TRAINING Presentation on Web Development. (2).pptx
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptx12KritiGaneriwal
 
Introduction to internet
Introduction to internetIntroduction to internet
Introduction to internetYusuf Brima
 

Similar to How the Internet Works: A Comprehensive Guide to Internet Protocols, Web Programming, and More (20)

Les Basiques - Web Développement HTML5, CSS3, JS et PHP
Les Basiques - Web  Développement HTML5, CSS3, JS et PHPLes Basiques - Web  Développement HTML5, CSS3, JS et PHP
Les Basiques - Web Développement HTML5, CSS3, JS et PHP
 
Unit 01 (1).pdf
Unit 01 (1).pdfUnit 01 (1).pdf
Unit 01 (1).pdf
 
WEB TECHNOLOGY:Web Essentials and Markup Language HTML
WEB TECHNOLOGY:Web Essentials and Markup Language HTMLWEB TECHNOLOGY:Web Essentials and Markup Language HTML
WEB TECHNOLOGY:Web Essentials and Markup Language HTML
 
Website/Web Applications / Static vs Dynamic Website / Web Browser /
Website/Web Applications  / Static vs Dynamic Website / Web Browser / Website/Web Applications  / Static vs Dynamic Website / Web Browser /
Website/Web Applications / Static vs Dynamic Website / Web Browser /
 
Choice of programming language for web developing.
Choice of programming language for web developing.Choice of programming language for web developing.
Choice of programming language for web developing.
 
Ncp computer appls web tech asish
Ncp computer appls  web tech asishNcp computer appls  web tech asish
Ncp computer appls web tech asish
 
Iwt module 1
Iwt  module 1Iwt  module 1
Iwt module 1
 
WP Chap 1 & 2.pptx
WP Chap 1 & 2.pptxWP Chap 1 & 2.pptx
WP Chap 1 & 2.pptx
 
web devs ppt.ppsx
web devs ppt.ppsxweb devs ppt.ppsx
web devs ppt.ppsx
 
Html-meeting1-1.pptx
Html-meeting1-1.pptxHtml-meeting1-1.pptx
Html-meeting1-1.pptx
 
Web Pages
Web PagesWeb Pages
Web Pages
 
Html intake 38 lect1
Html intake 38 lect1Html intake 38 lect1
Html intake 38 lect1
 
WEB DEVELOPMENT
WEB DEVELOPMENTWEB DEVELOPMENT
WEB DEVELOPMENT
 
web development process WT
web development process WTweb development process WT
web development process WT
 
Wt unit 1 ppts web development process
Wt unit 1 ppts web development processWt unit 1 ppts web development process
Wt unit 1 ppts web development process
 
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptx
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptxINDUSTRIAL TRAINING Presentation on Web Development. (2).pptx
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptx
 
Introduction to internet
Introduction to internetIntroduction to internet
Introduction to internet
 
Web Browsers.pptx
Web Browsers.pptxWeb Browsers.pptx
Web Browsers.pptx
 
mst_unit1.pptx
mst_unit1.pptxmst_unit1.pptx
mst_unit1.pptx
 
webservices.pptx
webservices.pptxwebservices.pptx
webservices.pptx
 

How the Internet Works: A Comprehensive Guide to Internet Protocols, Web Programming, and More

  • 2. What is Internet and how it works. ◦ DNS (Domain Name System) ◦ IP address ◦ Protocols: HTTP ◦ World Wide Web (WWW)  Web Programming ◦ HTML ◦ CSS ◦ Basics of Server-side Scripting.
  • 3. Its is vast network of inter connected computers that uses a specific set of rules called Internet Protocols (abbreviated as IP) to communicate.  Provides the physical backbone for a number of interesting applications.
  • 4. Is a part of the Internet "designed to allow easier navigation through the use of graphical user interfaces and hypertext links between different addresses“  Uses the HTTP protocol.  Global set of documents, images and other resources, logically interrelated by hyperlinks and referenced with Uniform Resource Locators(URLs).
  • 5. IP: Internet Protocol ◦ Responsible for labelling individual packets with the source address and destination address of two computers exchanging information over a network. ◦ IP Address: ◦ Eg.: IPv4: 172.16.254.1 (32 bits) ◦ IPv6: 2001:db8:0:1234:0::567:8:1 (128 bits) ◦ IP can be static or dynamic. • HTTP: Hyper Text Transfer Protocol • Is the language Web browsers and Server use to communicate using IP. • Standard which describes how a browser makes a request to the web server program. • HTTPS?
  • 6. DNS (Domain Name System) ◦ Responsible for converting the hostnames to the IP Address. ◦ For example, the domain name www.example.com translates to the addresses 192.0.43.10 (IPv4) and 2620:0:2d0:200::10 (IPv6) ◦ Name Server may query various website while resolving the address of the host name. • UR(Uniform Resource Locator) ◦ Eg. http://www.vnit.ac.in/lecture/Introduction_to_web.html  ISP (Internet Service Provider): ◦ Are those private companies which provide internet connection. We get connected to internet via our ISP.
  • 7.
  • 8. Client: ◦ Content or service requesters. ◦ Web browsers such as Mozilla, Chrome are clients. ◦ Functionalities?  Server: ◦ The provider of a resource or service. ◦ High speed computers with large hard disk capacity. ◦ A server machine is a host that is running one or more server programs which share their resources with clients. ◦ Functionalities?  Proxy servers: ◦ Acts as an intermediary for requests from clients seeking resources from server. ◦ Eg: The proxy server we user in our hostels : 172.31.16.10 ◦ How does it speed up browsing? How it differs from Peer to Peer (P2P)?
  • 9.
  • 10. To view a web page from your browser, the following sequence happens: ◦ You either type an address (URL) into your "Address Bar" or click on a hyperlink. ◦ Your browser sends a request to your ISP server asking for the page. ◦ Your ISP server using DNS looks in a huge database of internet addresses (IP) and finds the exact host server which houses the website in question, then sends that host server a request for the page. ◦ The host server sends the requested page to your ISP server. ◦ Your ISP sends the page to your browser and you see it displayed on your screen.
  • 11. Commonly used languages: ◦ HTML: Defines the structure of a web page. ◦ CSS: Defines the styling and layout of contents of a webpage. ◦ Javascript: Client side scripting language. It adds interactivity to a web page. ◦ PHP (Hypertext Preprocessor): Server side scripting language. ◦ SQL (Structured Query Language): Language used to query databases.
  • 12.
  • 13. HTML stands for HyperText Markup Language.  HTML is not a programming language, it is a markup language.  Is the core technology in which all Web pages are written.  HTML tags are interpreted by a web browser and composed into visible or audible webpages.
  • 14. HTML tags are case-insensitive.  The majority of HTML tags do require both an open and a close tag.  All HTML documents start with <html> tag and end with </html> An example of a simple HTML document: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <HTML> <HEAD> <!—Contains title, meta tags, links to external scripts(CSS, Javascript) --> <TITLE>My first HTML document</TITLE> </HEAD> <BODY> <!—Contains the content of the web page--> <P>Hello world! </BODY> </HTML>
  • 15. HTML headings are defined with the <h1> to <h6> tags. The lower the number, the larger the heading size.  HTML paragraphs are defined with the <p> tag. Most browsers automatically put a line break and space after a </p> tags.  HTML links are defined with the <a> called anchor tag. ◦ Absolute reference: <a href=“http://vnit.ac.in”>VNIT</a> ◦ Relative reference: <a href=“/contacts”>VNIT, Contacts</a> Target attribute?
  • 16. HTML elements can have attributes  Attributes provide additional information about an element  Attributes are always specified in the start tag  Attributes come in name/value pairs like: name="value"  Example: <a href="http://vnit.ac.in">This is a link</a> Here the attribute name is href and its value is http://vnit.ac.in
  • 17. Images can be added to a web page using img or through CSS. ◦ Eg.: <img src=“abc.jpg” alt=“A image” width=“300px” height=“200px”/> ◦ Use of alt, src , width and height attributes?  With HTML5, we can directly add a audio or video files into a web page ◦ Eg.: <audio controls="controls"> <source src="audio file.mp3" type="audio/mpeg"> </audio>
  • 18. Tables are an excellent way to organize and display information on a page. ◦ defined using the <table> tag. ◦ A table is divided into rows with the <tr> tag, and each row is divided into data cells using the <td> tag. The letters td stand for “table data,” which is the content of a data cell. A data cell can contain text, images, lists, paragraphs, forms, horizontal rules, tables, and so on.
  • 19. HTML forms are used to collect different kinds of user input. A form is an area that can contain form elements.  Form elements are elements that allow the user to enter information in a form (like text fields, text area fields, drop-down menus, radio buttons, check boxes, and so on).  Tags used: ◦ Form, Input, textarea, select, etc.
  • 20. Language used to design a webpage.  Styles enable you to define a consistent 'look' for your documents by describing once how headings, paragraphs, quotes, etc. should be displayed.  Latest version is CSS3.  Can be inline, in page, external.  Inline: ◦ Use style attribute. Multiple styles separated by semi-colon. ◦ Always defined in opening tag. ◦ <body style=“background-color:green;”>
  • 21. In page : ◦ Use style tag. Multiple styles separated by semi-colon. <style type=“text/css”> body { background-color:green; Color: red; } </style>  External: ◦ a separate CSS file referenced from the document <link href="path/to/file.css" rel="stylesheet"> ◦ Style sheet syntax is made up of three parts: selector {property: value}
  • 22. Class: ◦ When multiple elements in a web page have similar properties, we define class of them.  Class attribute is used.  A single dot (.) is used to define property of a class.  Eg.: .class_name { color:blue; }  Id: ◦ Specifies a unique id for an element.  Id attribute is used.  A single hash (#) is used to define property of a class.  Eg.: #id_name { color:blue; }
  • 23. Hand coding, use Nodepad++.  Use a WYSIWYG editor like Adobe, dreamweaver.  Use online services like Blogspot, Google site, Wordpress, etc.  Use Content Management System (CMS) like Wordpress, Joomla, etc.
  • 24. http://w3schools.com