Scribd
Upload
6 views3 pages

Spring 2025 - CS511 - 1

Cs documents

Uploaded by

sanaammara64
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
6 views3 pages

Spring 2025 - CS511 - 1

Cs documents

Uploaded by

sanaammara64
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
You are on page 1/ 3

Assignment No.

1 Total Marks: 20

Semester: Spring 2025


Due Date: 30/04/2025
CS511 – Web Engineering

Instructions
Please read the following instructions carefully before submitting the assignment solution:
It should be clear that your assignment will not get any credit/marks if:
o Assignment is submitted after due date.
o Submitted assignment does not open or file is corrupt.
o Assignment is copied (From internet/students).

Assignment Submission Instructions


You have to submit only “.html” file of your code on the assignments interface from your LMS
account.
Assignment submitted in any other format will not be accepted and will be scaled with
zero marks. No excuse will be accepted on submitting solution file in any other format.

Problem Statement:

Design a personal blog landing page that introduces the author, highlights featured blog topics,
and provides a way for visitors to contact the author. The page should be visually inviting, easy
to navigate, and fully responsive across devices. This project helps students practice building a
blog-style website using HTML and CSS, focusing on layout, styling, and interaction through a
form.
Requirements:
1. Content Sections:
Header: Includes the blog title ("John's Web Dev Blog") and a navigation bar with links to
Home, Topics, and Contact sections, styled with a consistent header background color and
centered layout.

· Welcome Section:
A brief introductory section welcoming visitors to the blog, explaining the purpose and voice of
the blog.
· Featured Topics:
A section highlighting three major blog topics (HTML5, CSS Grid/Flexbox, and JavaScript),
each with a heading, description, and placeholder image. Layout should be readable and content
visually separated.
· Quote Section (Aside):
A visually distinct aside element sharing a motivational or coding-related quote, adding
personality to the site.
· Contact Section:
A styled contact form with inputs for Name, Email, and a Message box. Fields are laid out
vertically with clear labels and a submit button.
2. · CSS Styling:
o Use CSS to create a cohesive design, with background images, color overlays,
and a clear typographic hierarchy.
o Style form fields with borders, padding, and hover effects to enhance usability
and aesthetics.
3. Responsiveness:
o Ensure the page is optimized for both desktop and mobile viewing, with well-
sized fonts and adjusted layouts for different screen sizes.

Sample Output:
Weeks Covered: 1 - 3
Due Date: Wednesday 30 April, 2025

You might also like