Web engineering 2

Download as docx, pdf, or txt
Download as docx, pdf, or txt
You are on page 1of 2

1.

Web Basic Page Layout Tags in HTML:


HTML provides essential tags to define the structure and layout of a web page. Key tags include:
 <html>: Wraps the entire HTML document, signaling the start and end of the HTML
content.
 <head>: Contains metadata like the page title (<title>), links to stylesheets (<link>),
and scripts (<script>), as well as SEO and social media tags.
 <body>: Holds all visible content such as text, images, links, and interactive elements.
It’s the core of the webpage where layout and elements are placed.
 <header>: Defines the top section, often used for branding elements like logos or
navigation menus.
 <nav>: Specifically used for navigation links.
 <footer>: Used for placing the bottom part of a page, like contact info or copyright.
 <section>, <article>, <aside>: Semantic tags that help organize content into logical
sections.
2. Usage of Tags and Structure of a Web Page:
The structure of an HTML web page consists of different types of elements:
 Headings (<h1> to <h6>): Used for defining headings or titles, with <h1> being the
highest priority.
 Paragraphs (<p>): For textual content, providing clear blocks of information.
 Lists: Ordered lists (<ol>) and unordered lists (<ul>) with list items (<li>) for
organizing items.
 Links (<a href="">): Used for creating hyperlinks to other pages or resources.
 Images and Media: <img> for embedding images, and <video> or <audio> for
multimedia.
 Layout Elements: <div> (division) and <span> are non-semantic tags used to group
elements and apply styles. While <div> is a block-level element, <span> is inline.
3. Designing and Creating Tables in HTML:
Tables in HTML are structured for displaying tabular data:
 <table>: The container for table elements.
 <tr> (table row): Represents each row within the table.
 <td> (table data): Defines a single cell within a row.
 <th> (table header): Used for table headings, which are bold and centered by default.
 You can also use the colspan and rowspan attributes to merge cells across columns or
rows.
 CSS can be applied for styling tables (e.g., borders, padding) to improve readability.
4. Designing Principles of Web-Based Applications:
Key principles for designing user-friendly web applications include:
 Responsive Design: Ensuring the web application looks and works well on different
devices (e.g., mobile, tablet, desktop). Techniques like media queries and flexible grids
are used.
 User Experience (UX): Focusing on intuitive navigation, ease of use, and accessibility
for all users. Elements like buttons, menus, and forms should be simple to interact with.
 Consistency: Uniformity in layout, typography, and color schemes across all pages and
components ensures better user flow and less confusion.
 Performance Optimization: Reducing page load times by optimizing images,
minimizing CSS/JS files, and implementing caching techniques.
 Security: Applying secure design principles like HTTPS, input validation, and protection
against SQL injection or XSS attacks.
5. Requirements Engineering for Web Applications:
This process involves gathering and documenting the necessary features for the web application:
 Functional Requirements: Define what the system should do, such as user login, data
entry, search functionalities, etc. It includes user stories or use cases to capture
interactions.
 Non-functional Requirements: Cover performance, security, scalability, and reliability.
These determine how well the system should perform under certain conditions, such as
how fast the pages load or how many users the system can support at once.
 Stakeholder Interviews: To understand the needs of users, developers, and clients, and
transform them into actionable requirements.
 Wireframes and Prototypes: Help visualize how the app will function before
development.
6. How Data Collection Happens for Web Apps:
Web applications collect data through various mechanisms to perform operations:
 HTML Forms: Web forms with input fields like text, radio buttons, checkboxes, and
dropdowns collect user data, which is sent to a server when submitted.
 APIs (Application Programming Interfaces): Web apps connect to external services
(like databases or third-party applications) using APIs to fetch or send data in real time.
 Database Interactions: Web apps store, retrieve, and update data in databases (e.g.,
SQL, NoSQL) based on user input or interaction.
 Sessions and Cookies: Web apps use cookies to store small amounts of data (e.g., user
preferences) in the user’s browser, and sessions to track user activity across multiple
pages.
 Analytics Tools: Tools like Google Analytics track user behavior, such as clicks, time
spent on a page, or the user's location.

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy