Web Development Basics Quiz

Static web pages

• Static web page content doesn't change.
• The same content is displayed for every user.
• Examples:
  • Glassfish
  • WebSphere

Dynamic content

• Request for the same document returns different results depending on the user.
• The web server must run certain programs to process user requests.
• Examples :
  • Servlet
  • PHP
  • ASP
  • Servlets
  • JSP

Web languages

• HTML is used for writing web pages.
• CSS is used for styling a web page.
• PHP is used to create dynamic pages on a web server.
• JavaScript adds interactive and programmable web pages.
• Ajax allows accessing data for web applications.
• MariaDB is a MySQL clone.

HTML

• HTML stands for Hyper Text Markup Language and was created to display web pages.
• HTML defines the structure of a web page through a series of elements.
• Each element tells the browser how to display content.
• Elements label parts of content like headings, paragraphs, and links.
• Examples include <h1>, <p>, <h1>, </p>.

Learning HTML

• HTML is a necessary skill for a front-end developer.
• HTML is also a requirement for a back-end developer.
• HTML is essential for Full Stack web developers.
• Full Stack web developers can create both client and server software.

Full Stack Web developer

• They are proficient in a variety of languages:
  • JavaScript
  • jQuery
  • Angular
  • Vue
  • PHP
  • ASP
  • Python
  • Node
  • SQL
  • SQLite
  • MongoDB

HTML Development environment

• You will need a text editor such as Visual Studio Code or Atom
• You will need a web browser like Google Chrome or Firefox.

HTML Tags

• Each tag has a name referred to as an element.
• HTML elements are defined by a start tag, some content, and an end tag.
• Synatx: <tagname>content </tagname>
• Example: <p>This is a paragraph </p>

HTML page structure

• HTML files are saved with the extension .html
• The basic structure: tags that enclose the content of the page.
• The head contains info about the page.
• The body contains the actual page content.
• The head section describes the page and includes information like the title.
• The body section contains the webpage content.

Page Title

• The title is placed inside the head section of the page.
• The title is displayed in the web browser's title and bookmarks.

Paragraph

• Paragraphs are placed within the body of the page.
• The <p> tag creates a paragraph.
• The <br> tag adds a line break.

Comments

• Comments in HTML are used to create notes that are not displayed on the page.
• Comments are enclosed in <!-- and -->.

Headings

• HTML uses heading elements <h1>, <h2>, <h3>, <h4>, <h5>, and <h6> to represent different heading levels.
• Headings are displayed in larger font sizes.

Horizontal rule

• The <hr> tag is used to create a horizontal rule.
• Horizontal rules are used to separate content.
• <hr> tags should be immediately closed with />.

More HTML tags

• HTML tags may include attributes.
• Attributes are used to specify extra information about the tag.
• Syntax: <tagname attribute="value"> content </tagname>
• Example: <a href="https://www.google.com">Next page</a>
• Some tags don't contain content; they can be opened and closed within the same tag.
• Syntax: <tagname />
• Example: <img src="image.jpg" alt="image description" />
• The img tag creates an image.
• The src attribute specifies the image source URL.
• The alt attribute provides a description for the image.

Formatting elements

• The <b> creates bold text.
• The <i> creates italic text.
• The <u> underlines text.
• <strong> indicates strong importance.
• <em> indicates emphasized text.
• The <sub> creates subscript text.
• The <sup> creates superscript text.

Unordered Lists

• The <ul> tag creates an unordered list.
• The <li> tag creates list items.

Preformatted text

• The <pre> tag preserves whitespace and line breaks.
• This is useful for displaying computer code or other text that should be formatted exactly as it is written.
• The <code> tag is used within <pre> to indicate computer code.

Summary

• Introduction to Web programming.
• Understanding the difference between static and dynamic web pages.
• Understanding the different types of servers: web servers and application servers.
• Understanding the client-server programming model.
• Learning how to create web pages using HTML.

Resources

• https://www.w3schools.com/html/
• https://www.geeksforgeeks.org/html/

Test your knowledge on static and dynamic web pages, web languages, and HTML. This quiz covers the essential concepts and examples related to web development. Challenge yourself to see how well you understand these foundational topics.