How unit 1 is examined
This unit covers the web's architecture and protocols, browsers and servers, Web 2.0, and the design, planning and navigation of websites. Web browser and servers and effective web design carry the most marks.
Concept of WWW
<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Medium weight</span>
Definition. <mark>The World Wide Web (WWW) is a system of interlinked hypertext documents, identified by URLs and transferred over HTTP, that users access through a browser.</mark>
Key points.
- WWW architecture has four parts: the client (browser), the server, the URL that names a resource, and HTTP that carries the request and response.
- The web works on the client-server model: the browser sends a request and the server returns a response.
- In the three-tier architecture the presentation tier is the browser, which shows the user interface and takes input.
- The application (logic) tier is the web/app server, which processes requests, applies business rules and talks to the database.
- The data tier is the database server, which stores and retrieves the data.
- Three tiers give scalability, since each tier scales alone, and maintainability, since a change in one tier does not disturb the others.
- In the HTTP cycle the client sends a method (GET, POST) and receives a status code such as 200 OK or 404 Not Found with the content.
Diagram. <figure class="ds-fig" style="margin:1.4rem 0;overflow-x:auto"><svg xmlns="http://www.w3.org/2000/svg" id="dsfig-u1-01" viewBox="0 0 424 80" width="424" height="80" role="img" aria-label="Three-tier architecture: C = client/presentation tier (browser), A = application tier (web/app server), D = data tier (database server)"><style>#dsfig-u1-01 .e{stroke:#454C5A;stroke-width:1.4;fill:none}#dsfig-u1-01 .e.hi{stroke:#2340B8;stroke-width:2.6}#dsfig-u1-01 .n{fill:#FFFFFF;stroke:#16181D;stroke-width:1.4}#dsfig-u1-01 .n.hi{fill:#E3E9FC;stroke:#2340B8;stroke-width:2.2}#dsfig-u1-01 .n.rb-b{fill:#16181D;stroke:#16181D}#dsfig-u1-01 .n.rb-r{fill:#BD3227;stroke:#BD3227}#dsfig-u1-01 text{font-family:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;font-size:13px}#dsfig-u1-01 .t{fill:#16181D;font-weight:500}#dsfig-u1-01 .t.inv{fill:#FFFFFF;font-weight:700}#dsfig-u1-01 .kd{stroke:#16181D;stroke-width:1.2}#dsfig-u1-01 .dot{fill:#16181D}#dsfig-u1-01 .ann{fill:#2340B8;font-size:11px;font-weight:700}#dsfig-u1-01 .lbl{fill:#6F7787;font-family:system-ui,-apple-system,sans-serif;font-size:12px;font-weight:700}#dsfig-u1-01 .ptr{fill:#2340B8;font-size:12px;font-weight:700}#dsfig-u1-01 .ah{fill:#454C5A}#dsfig-u1-01 .ah.hi{fill:#2340B8}#dsfig-u1-01 .wl rect{fill:#FFFFFF;stroke:#DCE0E7}#dsfig-u1-01 .wl .t{font-size:12px;font-weight:700}#dsfig-u1-01 .wl.hi rect{fill:#2340B8;stroke:#2340B8}#dsfig-u1-01 .wl.hi .t{fill:#FFFFFF}html.dark #dsfig-u1-01 .e{stroke:#B1B7C3}html.dark #dsfig-u1-01 .e.hi{stroke:#8FA3FF}html.dark #dsfig-u1-01 .n{fill:#161920;stroke:#E6E8ED}html.dark #dsfig-u1-01 .n.hi{fill:#1E2748;stroke:#8FA3FF}html.dark #dsfig-u1-01 .n.rb-b{fill:#E6E8ED;stroke:#E6E8ED}html.dark #dsfig-u1-01 .n.rb-r{fill:#FF7E71;stroke:#FF7E71}html.dark #dsfig-u1-01 .t{fill:#E6E8ED}html.dark #dsfig-u1-01 .t.inv{fill:#0F1115}html.dark #dsfig-u1-01 .kd{stroke:#E6E8ED}html.dark #dsfig-u1-01 .dot{fill:#E6E8ED}html.dark #dsfig-u1-01 .ann{fill:#8FA3FF}html.dark #dsfig-u1-01 .lbl{fill:#858D9C}html.dark #dsfig-u1-01 .ptr{fill:#8FA3FF}html.dark #dsfig-u1-01 .ah{fill:#B1B7C3}html.dark #dsfig-u1-01 .ah.hi{fill:#8FA3FF}html.dark #dsfig-u1-01 .wl rect{fill:#161920;stroke:#2A2E37}html.dark #dsfig-u1-01 .wl.hi rect{fill:#8FA3FF;stroke:#8FA3FF}html.dark #dsfig-u1-01 .wl.hi .t{fill:#0F1115}</style><defs><marker id="ah1" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse"><path class="ah" d="M0,1 L9,5 L0,9 z"/></marker><marker id="ahh1" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse"><path class="ah hi" d="M0,1 L9,5 L0,9 z"/></marker></defs><path class="e" d="M61,40 L191,40" marker-end="url(#ah1)" marker-start="url(#ah1)"/><path class="e" d="M233,40 L363,40" marker-end="url(#ah1)" marker-start="url(#ah1)"/><g class="wl"><rect x="105.6" y="31" width="40.8" height="18" rx="9"/><text class="t" x="126" y="40" dy=".35em" text-anchor="middle">HTTP</text></g><g class="wl"><rect x="281.2" y="31" width="33.6" height="18" rx="9"/><text class="t" x="298" y="40" dy=".35em" text-anchor="middle">SQL</text></g><circle class="n" cx="40" cy="40" r="18"/><text class="t" x="40" y="40" dy=".35em" text-anchor="middle">C</text><circle class="n" cx="212" cy="40" r="18"/><text class="t" x="212" y="40" dy=".35em" text-anchor="middle">A</text><circle class="n" cx="384" cy="40" r="18"/><text class="t" x="384" y="40" dy=".35em" text-anchor="middle">D</text></svg><figcaption style="font-size:.82em;opacity:.72;margin-top:.45rem">Three-tier architecture: C = client/presentation tier (browser), A = application tier (web/app server), D = data tier (database server)</figcaption></figure>
Answer frame. Open with the WWW definition; draw the three-tier figure with request and response arrows; develop points 1-2, then 3-5, then 7; close with the advantages in point 6.
Asked: [7 marks] (Jun 2020) Explain three tier web architecture with suitable diagram. Asked: [7 marks] (Dec 2025) Explain WWW architecture, HTTP request-response cycle and role of web servers.
Internet and WWW
<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Low weight</span>
Definition. <mark>The Internet is a global network of interconnected networks that communicate using the TCP/IP protocol suite.</mark>
Key points.
- The Internet is the infrastructure (cables, routers, protocols); the WWW is only one service running on it, alongside email and FTP.
- Uses of the Internet include communication, information search, e-commerce, education and file transfer.
- A web page is a single document served on the web; it is static (fixed content) or dynamic (generated per request).
- A website is a collection of related web pages under one domain; a URL addresses each page and the browser displays it.
Asked: [7 marks] (Dec 2024) Define Internet. What do you mean by Webpage?
HTTP Protocol : Request and Response
<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Low weight</span>
Definition. <mark>HTTP (HyperText Transfer Protocol) is a stateless, application-layer, request-response protocol used to transfer web resources between browser and server.</mark>
Key points.
- Its utility is retrieving and sending resources: the client requests, the server responds with a status code and content, and each request is independent (stateless).
- GET retrieves a resource; POST submits data to the server; PUT replaces or uploads a resource; DELETE removes it; HEAD fetches headers only; OPTIONS lists the methods allowed.
- Example request:
GET /index.html HTTP/1.1withHost: example.com; response:HTTP/1.1 200 OKfollowed by headers and the HTML body.
Asked: [7 marks] (Jun 2020) What is HTTP? Explain its utility and the various methods used by HTTP.
Web browser and Web servers
<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">High weight</span>
Definition. <mark>A web browser is client software that requests, receives and renders web content, and a web server is software (or the machine running it) that stores web pages and serves them in reply to HTTP requests.</mark>
Key points.
- A web page is a single HTML document; a website is a collection of related web pages; a web server is the software/hardware that serves them.
- Browser functions are sending HTTP requests, parsing HTML/CSS, running JavaScript, rendering the page, and storing cookies and cache. Examples are Chrome, Firefox, Edge and Safari.
- Common web servers are Apache, Nginx, Microsoft IIS and LiteSpeed.
- Web servers are compared on performance (requests per second), concurrency (simultaneous clients), security (SSL/TLS, access control), scalability, platform support, cost and ease of configuration.
- A protocol is an agreed set of rules for communication: HTTP transfers web pages, HTTPS is HTTP secured with TLS, FTP transfers files, and TCP/IP moves packets reliably across networks.
- Interaction: the user types a URL; the browser asks DNS for the IP address; it opens a TCP connection and sends an HTTP request.
- The server locates or generates the resource and returns a response with a status code (200 OK, 404 Not Found, 500 Server Error); the browser renders it.
Diagram. <figure class="ds-fig" style="margin:1.4rem 0;overflow-x:auto"><svg xmlns="http://www.w3.org/2000/svg" id="dsfig-u1-02" viewBox="0 0 424 166" width="424" height="166" role="img" aria-label="Browser-server interaction: B = browser, D = DNS server, S = web server"><style>#dsfig-u1-02 .e{stroke:#454C5A;stroke-width:1.4;fill:none}#dsfig-u1-02 .e.hi{stroke:#2340B8;stroke-width:2.6}#dsfig-u1-02 .n{fill:#FFFFFF;stroke:#16181D;stroke-width:1.4}#dsfig-u1-02 .n.hi{fill:#E3E9FC;stroke:#2340B8;stroke-width:2.2}#dsfig-u1-02 .n.rb-b{fill:#16181D;stroke:#16181D}#dsfig-u1-02 .n.rb-r{fill:#BD3227;stroke:#BD3227}#dsfig-u1-02 text{font-family:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;font-size:13px}#dsfig-u1-02 .t{fill:#16181D;font-weight:500}#dsfig-u1-02 .t.inv{fill:#FFFFFF;font-weight:700}#dsfig-u1-02 .kd{stroke:#16181D;stroke-width:1.2}#dsfig-u1-02 .dot{fill:#16181D}#dsfig-u1-02 .ann{fill:#2340B8;font-size:11px;font-weight:700}#dsfig-u1-02 .lbl{fill:#6F7787;font-family:system-ui,-apple-system,sans-serif;font-size:12px;font-weight:700}#dsfig-u1-02 .ptr{fill:#2340B8;font-size:12px;font-weight:700}#dsfig-u1-02 .ah{fill:#454C5A}#dsfig-u1-02 .ah.hi{fill:#2340B8}#dsfig-u1-02 .wl rect{fill:#FFFFFF;stroke:#DCE0E7}#dsfig-u1-02 .wl .t{font-size:12px;font-weight:700}#dsfig-u1-02 .wl.hi rect{fill:#2340B8;stroke:#2340B8}#dsfig-u1-02 .wl.hi .t{fill:#FFFFFF}html.dark #dsfig-u1-02 .e{stroke:#B1B7C3}html.dark #dsfig-u1-02 .e.hi{stroke:#8FA3FF}html.dark #dsfig-u1-02 .n{fill:#161920;stroke:#E6E8ED}html.dark #dsfig-u1-02 .n.hi{fill:#1E2748;stroke:#8FA3FF}html.dark #dsfig-u1-02 .n.rb-b{fill:#E6E8ED;stroke:#E6E8ED}html.dark #dsfig-u1-02 .n.rb-r{fill:#FF7E71;stroke:#FF7E71}html.dark #dsfig-u1-02 .t{fill:#E6E8ED}html.dark #dsfig-u1-02 .t.inv{fill:#0F1115}html.dark #dsfig-u1-02 .kd{stroke:#E6E8ED}html.dark #dsfig-u1-02 .dot{fill:#E6E8ED}html.dark #dsfig-u1-02 .ann{fill:#8FA3FF}html.dark #dsfig-u1-02 .lbl{fill:#858D9C}html.dark #dsfig-u1-02 .ptr{fill:#8FA3FF}html.dark #dsfig-u1-02 .ah{fill:#B1B7C3}html.dark #dsfig-u1-02 .ah.hi{fill:#8FA3FF}html.dark #dsfig-u1-02 .wl rect{fill:#161920;stroke:#2A2E37}html.dark #dsfig-u1-02 .wl.hi rect{fill:#8FA3FF;stroke:#8FA3FF}html.dark #dsfig-u1-02 .wl.hi .t{fill:#0F1115}</style><defs><marker id="ah2" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse"><path class="ah" d="M0,1 L9,5 L0,9 z"/></marker><marker id="ahh2" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse"><path class="ah hi" d="M0,1 L9,5 L0,9 z"/></marker></defs><path class="e" d="M58.8,123.3 Q140.3,111.6 197.1,54.8" marker-end="url(#ah2)"/><path class="e" d="M193.2,42.7 Q111.7,54.4 54.9,111.2" marker-end="url(#ah2)"/><path class="e" d="M58.7,129.5 Q212,158 363.4,129.8" marker-end="url(#ah2)"/><path class="e" d="M365.3,122.5 Q212,94 60.6,122.2" marker-end="url(#ah2)"/><g class="wl"><rect x="117.3" y="91.3" width="33.6" height="18" rx="9"/><text class="t" x="134.1" y="100.3" dy=".35em" text-anchor="middle">URL</text></g><g class="wl"><rect x="104.7" y="56.7" width="26.4" height="18" rx="9"/><text class="t" x="117.9" y="65.7" dy=".35em" text-anchor="middle">IP</text></g><g class="wl"><rect x="180.8" y="134.8" width="61.5" height="18" rx="9"/><text class="t" x="211.5" y="143.8" dy=".35em" text-anchor="middle">request</text></g><g class="wl"><rect x="178.1" y="99.2" width="68.7" height="18" rx="9"/><text class="t" x="212.5" y="108.2" dy=".35em" text-anchor="middle">response</text></g><circle class="n" cx="40" cy="126" r="18"/><text class="t" x="40" y="126" dy=".35em" text-anchor="middle">B</text><circle class="n" cx="212" cy="40" r="18"/><text class="t" x="212" y="40" dy=".35em" text-anchor="middle">D</text><circle class="n" cx="384" cy="126" r="18"/><text class="t" x="384" y="126" dy=".35em" text-anchor="middle">S</text></svg><figcaption style="font-size:.82em;opacity:.72;margin-top:.45rem">Browser-server interaction: B = browser, D = DNS server, S = web server</figcaption></figure>
Answer frame. Definition questions: give one line each for web page, website and web server. Explanation questions: define both terms, draw the interaction figure, then develop points 6-7 with the status codes; for the protocols question develop points 2 and 5; for server comparison develop points 3-4; close with the criteria used to choose a server.
Pitfall: Do not call the browser and the server the same thing; the browser is the client and only the server stores and serves the pages.
Asked: [7 marks] (Nov 2019) Define: i) Web page ii) Web site iii) Web server Asked: [7 marks] (Jun 2020) What are Web servers? Explain the features and characteristics used for comparison of web servers. Asked: [7 marks] (Nov 2022) Explain in detail about the web browser and protocols. Asked: [7 marks] (Dec 2024) What is a web server and a web browser? What is the interaction between a web browser and a web server?
Features of Web 2.0
<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Medium weight</span>
Definition. <mark>Web 2.0 is the second generation of the web, in which users interact, collaborate and create content instead of only reading static pages as in Web 1.0.</mark>
Key points.
- Web 2.0 is interactive and dynamic, so pages respond to the user without a full reload.
- User-generated content such as blogs, wikis and reviews is central, so users become contributors.
- Social media and networking (Facebook, YouTube, Twitter) enable sharing and collaboration.
- AJAX updates parts of a page asynchronously, which gives desktop-like applications in the browser.
- Impact on development: developers moved from static HTML to JavaScript frameworks, APIs, RSS feeds and database-driven sites, with rich interfaces and the browser as the platform.
- Examples of Web 2.0 applications are Wikipedia, Blogger, Flickr and Google Docs.
Answer frame. Open with the definition and the contrast with Web 1.0; develop points 1-4 as features; then point 5 as the impact; close with the examples in point 6.
Asked: [7 marks] (Nov 2023, Dec 2025) Describe the impact of Web 2.0 on web development. Explain Web 2.0 features and their impact on modern websites.
Web Design: Concepts of effective web design
<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">High weight</span>
Definition. <mark>Web design is the process of planning and creating the look, layout, content and usability of a website so that it meets user needs and its goals.</mark>
Key points.
- Simplicity: a clean, uncluttered page with a clear purpose lets users find things quickly.
- Consistency: the same fonts, colours, layout and navigation on every page make the site predictable.
- Navigation: clear, visible menus and links let users reach any page in a few clicks.
- Readability and visual hierarchy: legible typography, good contrast, colour and white space guide the eye to the important items.
- Accessibility: alt text, keyboard support and sufficient contrast let all users, including those with disabilities, use the site.
- Responsiveness and mobile-first design make the layout adapt to any screen size.
- Load speed: optimised images and light code keep pages fast, and SEO-friendly structure and a clear call to action (CTA) support the site's goal.
Steps.
Step 1: Planning - fix the purpose, audience and scope.
Step 2: Analysis - gather requirements and study users and competitors.
Step 3: Design - sitemap, layout, navigation, colours and content.
Step 4: Implementation - code the pages with HTML, CSS and scripts.
Step 5: Testing - check function, usability, compatibility and speed.
Step 6: Maintenance - update content, fix bugs and take backups.
Answer frame. Definition question: define web design, list the elements (layout, colour, typography, content, navigation), then the principles in points 1-7 and a good-design example such as a responsive site with a clear CTA. Steps question: list the six steps in order, one sentence each, mentioning navigation, layout and content. Principles question: develop points 1-7, then navigation types under user-centric navigation; close with the benefit to users.
Asked: [7 marks] (Nov 2019) Explain various steps of Web site design. Asked: [7 marks] (Nov 2022) Explain the concept of web designing and give its clarification. Asked: [7 marks] (Dec 2025, Jun 2025) Discuss principles of effective web design and user-centric navigation. Give some examples of best practices and techniques for designing modern, user-friendly websites.
Webdesign issues including Browser
<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Medium weight</span>
Definition. <mark>Web design issues are the problems that reduce a site's usability, compatibility, performance or security, and so harm the user experience.</mark>
Key points.
- Usability: confusing layouts, small text and cluttered pages make the site hard to use.
- Navigation: broken links, hidden menus and deep structures leave users lost.
- Browser compatibility: the same page can render differently in Chrome, Firefox and Safari, so it must be tested on each.
- Performance: large images and heavy scripts slow loading; aesthetics must be balanced against speed and responsiveness.
- Accessibility: sites without alt text or keyboard support exclude disabled users.
- Security and SEO: unsecured forms and missing HTTPS put data at risk, and poor structure lowers search ranking.
Answer frame. Open by defining design issues; develop points 1-6 with one example each; close with the impact on user experience and the guideline to test early across browsers and devices.
Asked: [7 marks] (Nov 2023, Dec 2024) Explain the various types of web design issues. Discuss web design issues in details.
Bandwidth and Cache
<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Low weight</span>
Definition. <mark>Bandwidth is the maximum amount of data a connection can transfer per second, measured in bits per second (bps, Kbps, Mbps, Gbps); a cache is a temporary store of copies of frequently used data for faster reuse.</mark>
Key points.
- Bandwidth decides page load time: low bandwidth makes pages with large images or video slow, so sites must be lightweight.
- A cache keeps a copy of a resource; on a repeat request it is served locally instead of being fetched again, which saves bandwidth and time.
- Types: browser cache (on the user's machine), proxy cache (shared by a network or ISP), server/web cache (at the server side), and CDN cache (copies on geographically distributed servers).
Asked: [7 marks] (Nov 2022) What do you understand by bandwidth? Discuss about cache and its types.
Display resolution
<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Not asked since 2022</span>
Definition. <mark>Display resolution is the number of pixels a screen shows, given as width x height, for example 1920 x 1080.</mark>
Key points.
- Users have very different resolutions, so a fixed-width page may need scrolling or leave empty space.
- Designers therefore use flexible layouts, percentages and media queries so the page fits every screen.
- Higher resolution means sharper display; images should be supplied at suitable sizes.
Look and Feel of the Web site
<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Not asked since 2022</span>
Definition. <mark>The look and feel of a website is its overall visual design (colours, fonts, images, layout) together with how it behaves when users interact with it.</mark>
Key points.
- Look covers the visual style, and feel covers the interaction such as menus, buttons and feedback.
- A consistent look and feel builds brand identity and user trust.
- It is achieved with a common style sheet or template applied to all pages.
Page Layout and linking
<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Not asked since 2022</span>
Definition. <mark>Page layout is the arrangement of elements such as header, menu, content and footer on a page, and linking connects pages through hyperlinks.</mark>
Key points.
- A standard layout has a header, navigation bar, main content, sidebar and footer.
- Layouts are built with tables, frames or CSS, of which CSS is the modern method.
- Links should be descriptive, working and consistent; they can be internal (same site) or external.
User centric design
<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Low weight</span>
Definition. <mark>User-Centric Design (UCD) is an approach that places the needs, goals and feedback of the users at the centre of every design decision.</mark>
| Basis | User-centric design | Traditional design |
|---|---|---|
| Focus | User needs | Designer or business ideas |
| User involvement | Throughout | Little or none |
| Process | Iterative | Linear |
| Testing | Continuous with users | At the end |
Key points. UCD is essential because it improves usability and satisfaction, reduces costly rework and makes the product succeed.
Asked: [7 marks] (Jun 2025) How does User-Centric Design (UCD) differ from traditional design approaches, and why is it considered essential for creating successful digital products?
Sitemap
<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Not asked since 2022</span>
Definition. <mark>A sitemap is a diagram or list of all the pages of a website showing their hierarchy and links.</mark>
Key points.
- It is planned before design to organise content and to show how pages connect.
- A visual sitemap helps designers and clients; a page or XML sitemap helps users and search engines find pages.
- A good sitemap keeps the structure shallow, so any page is a few clicks from the home page.
Planning and publishing website
<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Medium weight</span>
Definition. <mark>Planning and publishing a website is the ordered process of deciding its purpose, audience and content, building and testing it, and then making it live on a web server.</mark>
Steps.
Step 1: Planning - purpose, target audience and content; requirement analysis.
Step 2: Sitemap and design - structure, layout and navigation.
Step 3: Content and development - write content and code the pages.
Step 4: Testing - functionality, usability, compatibility, performance.
Step 5: Hosting and domain - register a domain and buy web space.
Step 6: Publishing - upload the files by FTP.
Step 7: Promotion and maintenance - SEO, updates, backups, security.
Key points.
- Web page editors such as FrontPage and Dreamweaver create pages visually and can upload them directly.
- To upload with an editor, create the pages, enter the host, user name and password of the FTP account, connect, and transfer the files to the server folder.
- After upload, browse the live site to test that pages, links and images work.
- Testing checks functionality, usability, compatibility and performance; maintenance means updating content, taking backups and applying security patches.
Answer frame. Open with the definition; list the seven steps in order, one sentence each; for the editor question develop points 1-3; for the short note develop point 4; close with the need for regular maintenance.
Asked: [7 marks] (Nov 2023, Dec 2025) What are the steps involved in planning and publishing a website? Explain website planning, sitemap creation and publishing process. Asked: [7 marks] (Dec 2020) Explain uploading of web page using web page editors. Asked: [7 marks] (Dec 2020) Write a short note on testing and maintenance of website.
Designing effective navigation
<span style="display:inline-block;padding:.16em .6em;border:1.5px solid currentColor;border-radius:999px;font-size:.68em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75">Low weight</span>
Definition. <mark>Navigation is the system of menus, links and search that lets users find their way around a website or app.</mark>
Key points.
- Principles are consistency, simplicity, visibility, feedback (highlighting the current page) and a search option.
- Web sites use top menus, sidebars and breadcrumbs; mobile apps use a hamburger menu, bottom tab bar and gestures because the screen is small.
- These principles improve findability and reduce cognitive load, giving a better user experience.
Asked: [7 marks] (Jun 2025) What are some key principles for designing effective navigation systems in websites or mobile apps, and how do these principles contribute to a better user experience?
Last-minute revision
- WWW: hypertext documents identified by URLs, transferred over HTTP; the Internet is the network beneath it.
- Three tiers: presentation (browser), application (web/app server), data (database).
- HTTP is stateless; methods GET, POST, PUT, DELETE, HEAD, OPTIONS.
- Status codes: 200 OK, 404 Not Found, 500 Server Error.
- Request flow: URL, DNS lookup, TCP connection, HTTP request, response, rendering.
- Web servers: Apache, Nginx, IIS; compared on performance, concurrency, security, scalability.
- Web 2.0: interactive, user-generated content, social media, AJAX.
- Design steps: planning, analysis, design, implementation, testing, maintenance.
- Bandwidth is data per second (bps); cache types are browser, proxy, server and CDN.
- Publishing: domain, hosting, FTP upload, testing, promotion, maintenance.
- UCD is iterative and involves users throughout; traditional design is designer-led.
Memory hooks
- Three tiers = "P-A-D": Presentation, Application, Data.
- Design steps = "PADITM": Planning, Analysis, Design, Implementation, Testing, Maintenance.
- Navigation principles = "CSVFS": Consistency, Simplicity, Visibility, Feedback, Search.
- Cache types = "BPSC": Browser, Proxy, Server, CDN.
- Web 2.0 = Read plus Write; Web 1.0 = Read only.
Coverage checklist
- Concept of WWW: three-tier architecture (Jun 2020); WWW architecture and HTTP cycle (Dec 2025).
- Internet and WWW: define Internet and Webpage (Dec 2024).
- HTTP Protocol : Request and Response: HTTP and its methods (Jun 2020).
- Web browser and Web servers: define page, site, server (Nov 2019); web server comparison (Jun 2020); browser and protocols (Nov 2022); browser-server interaction (Dec 2024).
- Features of Web 2.0: impact of Web 2.0 (Nov 2023, Dec 2025).
- Web Design: Concepts of effective web design: design steps (Nov 2019); concept of web designing (Nov 2022); principles (Jun 2025, Dec 2025).
- Webdesign issues including Browser: types of design issues (Nov 2023, Dec 2024).
- Bandwidth and Cache: bandwidth and cache types (Nov 2022).
- Display resolution: not asked recently.
- Look and Feel of the Web site: not asked recently.
- Page Layout and linking: not asked recently.
- User centric design: UCD versus traditional (Jun 2025).
- Sitemap: not asked recently (sitemap creation appears in the Nov 2023, Dec 2025 planning question).
- Planning and publishing website: steps (Nov 2023, Dec 2025); editors and upload (Dec 2020); testing and maintenance (Dec 2020).
- Designing effective navigation: navigation principles (Jun 2025).