navya-semantic-interactive-tags #524
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change | ||||
|---|---|---|---|---|---|---|
| @@ -0,0 +1,62 @@ | ||||||
| <!DOCTYPE html> | ||||||
| <html lang="en"> | ||||||
|
|
||||||
| <head> | ||||||
| <meta charset="UTF-8"> | ||||||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||||||
| <title>Blog webpage</title> | ||||||
| </head> | ||||||
|
|
||||||
| <body> | ||||||
|
|
||||||
| <header> | ||||||
| <h1 class="blog">Navya Jain</h1> | ||||||
| <nav class="nav-bar"> | ||||||
| <a href="#" class="home">Home</a> | ||||||
| <a href="#">About</a> | ||||||
| <a href="#">Contact</a> | ||||||
| </nav> | ||||||
|
|
||||||
|
|
||||||
| </header> | ||||||
| <main> | ||||||
| <section> | ||||||
| <article> | ||||||
| <h2>Blog</h2> | ||||||
| <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Doloribus ab tempora sequi sed voluptate | ||||||
| similique voluptas magnam exercitationem voluptatum incidunt nihil, fugiat eveniet architecto | ||||||
| quaerat distinctio aperiam obcaecati fugit iusto.</p> | ||||||
| </article> | ||||||
|
|
||||||
| <article> | ||||||
| <h2>Blog</h2> | ||||||
| <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Similique eaque animi est dignissimos dicta | ||||||
| quisquam ad explicabo eius, corrupti iste numquam, consequatur at natus temporibus. Modi, ipsa | ||||||
| omnis? Sequi, neque!</p> | ||||||
| </article> | ||||||
| <article> | ||||||
| <h2>Blog</h2> | ||||||
| <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Similique eaque animi est dignissimos dicta | ||||||
| quisquam ad explicabo eius, corrupti iste numquam, consequatur at natus temporibus. Modi, ipsa | ||||||
| omnis? Sequi, neque!</p> | ||||||
| </article> | ||||||
| <aside> | ||||||
| <h2>Related Content</h2> | ||||||
| <ul> | ||||||
| <li><a href="#">What is HTML?</a></li> | ||||||
| <li><a href="#">What is CSS</a></li> | ||||||
| <li><a href="#">What is JavaScript</a></li> | ||||||
| </ul> | ||||||
| </aside> | ||||||
|
|
||||||
| </section> | ||||||
| </main> | ||||||
|
|
||||||
| <footer> | ||||||
| <p>Contact : <a href="mailto:@abc@gmail.com">xyz@gmail.com</a></p> | ||||||
|
There was a problem hiding this comment. The email address in the
Suggested change
|
||||||
| <p>© Navya Jain</p> | ||||||
|
|
||||||
| </footer> | ||||||
| </body> | ||||||
|
|
||||||
| </html> | ||||||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,70 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
|
|
||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <title>Registration form</title> | ||
| </head> | ||
|
|
||
| <body> | ||
| <h1>Singing Club Registration</h1> | ||
| <form action="" method="post"> | ||
|
|
||
| <legend>Personal Information</legend> | ||
| <label for="firstname">First Name:</label> | ||
| <input type="text" placeholder="Enter First Name" pattern="^[A-Za-z]+$" autocomplete="off" required> | ||
| <br> <br> | ||
|
There was a problem hiding this comment. Using |
||
| <label for="lastname">Last Name:</label> | ||
| <input type="text" placeholder="Enter Last Name" pattern="^[A-Za-z]+$" autocomplete="off" required> | ||
|
|
||
| <br><br> | ||
|
|
||
| <label for="email">Email:</label> | ||
| <input type="email" pattern="^[a-zA-Z0-9._%!-]+@gmail\.com$" placeholder="Enter you Email" required> | ||
|
|
||
| <br><br> | ||
|
|
||
| <label for="phone number">Phone Number:</label> | ||
| <input type="tel" pattern="^(\+91)?[0-9]{10}$" placeholder="Enter Your Number" required> | ||
|
|
||
| <br><br> | ||
|
|
||
| <label for="dob">Date of Birth:</label> | ||
| <input type="date" id="birthday" min="2020-01-01" max="2025-12-31" required> | ||
|
|
||
| <br><br> | ||
|
|
||
| <legend>Singing Preference</legend> | ||
|
Comment on lines
+14
to
+38
There was a problem hiding this comment. The |
||
|
|
||
| <br> | ||
|
|
||
| <label>Preferred Singing Style:</label><br> | ||
| <input type="radio" name="style" value="Classical" required> | ||
|
|
||
| <label for="classical">Classical</label><br> | ||
| <input type="radio" name="style" value="Pop"> | ||
|
|
||
| <label for="pop">Pop</label><br> | ||
| <input type="radio" name="style" value="Rock"> | ||
|
|
||
| <label for="rock">Rock</label><br> | ||
| <input type="radio" name="style" value="Folk"> | ||
|
|
||
| <label for="folk">Folk</label><br><br> | ||
|
|
||
| <label>Instruments You Play (if any):</label><br> | ||
| <input type="checkbox" name="instrument" value="Guitar"> | ||
| <label for="guitar">Guitar</label><br> | ||
| <input type="checkbox" name="instrument" value="Piano"> | ||
| <label for="piano">Piano</label><br> | ||
| <input type="checkbox" name="instrument" value="Drums"> | ||
| <label for="drums">Drums</label><br> | ||
| <input type="checkbox" name="instrument" value="None"> | ||
| <label for="none">None</label><br><br> | ||
|
Comment on lines
+15
to
+64
There was a problem hiding this comment. The labels in this form are not correctly associated with their input fields, which is a critical accessibility issue. This prevents users of assistive technologies from understanding the form, and also prevents users from clicking on a label to focus its input. Here's a summary of the issues:
|
||
|
|
||
| </form> | ||
|
|
||
| </body> | ||
|
|
||
| </html> | ||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,25 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
|
|
||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <title>Navigation Links</title> | ||
| </head> | ||
|
|
||
| <body> | ||
| <header> | ||
| <h1>Welcome to Navigation Links</h1> | ||
| <nav> | ||
| <ul> | ||
| <li><a href="../assignment-1/blog.html">Blog</a></li> | ||
| <li><a href="../assignment-2/registration.html">Registration</a></li> | ||
| <li><a href="../assignment-4/audio-video.html">Audio/Video</a></li> | ||
| </ul> | ||
| </nav> | ||
| </header> | ||
|
|
||
|
|
||
| </body> | ||
|
|
||
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change | ||||
|---|---|---|---|---|---|---|
| @@ -0,0 +1,36 @@ | ||||||
| <!DOCTYPE html> | ||||||
| <html lang="en"> | ||||||
|
|
||||||
| <head> | ||||||
| <meta charset="UTF-8"> | ||||||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||||||
| <title>Media Page</title> | ||||||
| </head> | ||||||
|
|
||||||
| <body> | ||||||
| <h1>Media Example: Video and Audio</h1> | ||||||
|
|
||||||
| <section> | ||||||
| <h2>Sample Video</h2> | ||||||
| <p>This is a short sample video with captions explaining the content.</p> | ||||||
| <video width="640"controls> | ||||||
| <source src="nature.mp4" type="video/mp4"> | ||||||
| <track src="" kind="captions" srclang="en" label="English"> | ||||||
|
There was a problem hiding this comment. The
Suggested change
|
||||||
| Your browser does not support the video tag. | ||||||
| </video> | ||||||
| </section> | ||||||
|
|
||||||
| <hr> | ||||||
|
|
||||||
| <section> | ||||||
| <h2>Sample Audio</h2> | ||||||
| <p>This audio clip is a short narration about the content shown above.</p> | ||||||
| <audio controls> | ||||||
| <source src="" type="audio/mpeg"> | ||||||
|
There was a problem hiding this comment. The
Suggested change
|
||||||
| Your browser does not support the audio tag. | ||||||
| </audio> | ||||||
| </section> | ||||||
|
|
||||||
| </body> | ||||||
|
|
||||||
| </html> | ||||||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change | ||||
|---|---|---|---|---|---|---|
| @@ -0,0 +1,31 @@ | ||||||
| <!DOCTYPE html> | ||||||
| <html lang="en"> | ||||||
|
|
||||||
| <head> | ||||||
| <meta charset="UTF-8"> | ||||||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||||||
| <title>Form & Button</title> | ||||||
| <link rel="stylesheet" href="./styles//style.css"> | ||||||
|
There was a problem hiding this comment. There is a double slash
Suggested change
|
||||||
| </head> | ||||||
|
|
||||||
| <body> | ||||||
| <form action=""> | ||||||
| <label for="name">Name:</label> | ||||||
| <input type="text" placeholder="Enter your name" id="name" required /> | ||||||
|
|
||||||
| <label for="email">Email:</label> | ||||||
| <input type="email" name="email" id="email" required /> | ||||||
|
|
||||||
| <label for="message">Message: </label> | ||||||
| <textarea name="message" id="message" rows="2" required></textarea> | ||||||
|
|
||||||
| <button type="submit" class="btn-submit">submit</button> | ||||||
|
|
||||||
| <button type="reset" class="btn-reset">reset</button> | ||||||
|
|
||||||
| <button type="button" class="btn-plain">plain button</button> | ||||||
| </form> | ||||||
|
|
||||||
| </body> | ||||||
|
|
||||||
| </html> | ||||||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,50 @@ | ||
| form { | ||
| max-width: 400px; | ||
| margin: 50px auto; | ||
| padding: 20px; | ||
| border: 1px solid #ccc; | ||
| border-radius: 5px; | ||
| font-family: Arial, sans-serif; | ||
| } | ||
|
|
||
| label { | ||
| display: block; | ||
| margin-top: 15px; | ||
| font-weight: bold; | ||
| } | ||
|
|
||
| input, | ||
| textarea { | ||
| width: 100%; | ||
| padding: 8px; | ||
| margin-top: 5px; | ||
| border: 1px solid #aaa; | ||
| border-radius: 4px; | ||
| box-sizing: border-box; | ||
| } | ||
|
|
||
| button { | ||
| margin-top: 15px; | ||
| padding: 10px 15px; | ||
| border: none; | ||
| border-radius: 4px; | ||
| cursor: pointer; | ||
| font-weight: bold; | ||
| } | ||
|
|
||
| .btn-submit { | ||
| background-color: #28a745; | ||
| color: white; | ||
| } | ||
|
|
||
| .btn-reset { | ||
| background-color: #dc3545; | ||
| color: white; | ||
| margin-left: 10px; | ||
| } | ||
|
|
||
| .btn-plain { | ||
| background-color: #007bff; | ||
| color: white; | ||
| margin-left: 10px; | ||
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,46 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
|
|
||
| <head> | ||
| <meta charset="UTF-8" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
|
|
||
| <title>HTML Assignments | Navya Jain</title> | ||
| </head> | ||
|
|
||
| <body> | ||
| <details> | ||
| <summary>Assignment 1</summary> | ||
| <iframe src="./assignment-1/blog.html" frameborder="0" width="100%"></iframe> | ||
|
There was a problem hiding this comment. The Example: <iframe src="./assignment-1/blog.html" style="border: none; width: 100%;"></iframe>This comment applies to all |
||
| </details> | ||
|
|
||
| <details> | ||
| <summary> | ||
| Assignment 2 | ||
| </summary> | ||
| <iframe src="./assignment-2/registration.html" frameborder="0" width="100%"></iframe> | ||
| </details> | ||
|
|
||
| <details> | ||
| <summary> | ||
| Assignment 3 | ||
| </summary> | ||
| <iframe src="./assignment-3/navigate.html" frameborder="0" width="100%"></iframe> | ||
| </details> | ||
|
|
||
| <details> | ||
| <summary> | ||
| Assignment 4 | ||
| </summary> | ||
| <iframe src="./assignment-4/audio-video.html" frameborder="0" width="100%"></iframe> | ||
| </details> | ||
|
|
||
| <details> | ||
| <summary> | ||
| Assignment 5 | ||
| </summary> | ||
| <iframe src="./assignment-5/formbutton.html" frameborder="0" width="100%"></iframe> | ||
| </details> | ||
| </body> | ||
|
|
||
| </html> | ||
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The
<h2>headings for all articles are the same ('Blog'). For better semantics and user experience, each article should have a unique and descriptive heading that reflects its content.