Updated to use semantic elements; replaced <center>; added a lang tag

* Semantic html is better for screen readers: main, header, footer, aside
* added a lang tag to html (so screenreaders know what language to read it in)
* center tag replaced with footer (center is depreciated)
This commit is contained in:
Tarry_Dan 2023-09-24 14:10:07 +00:00 committed by likho
parent 7fba705bc6
commit bb0d20bd09

View File

@ -1,20 +1,27 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta content="initial-scale=1.0"> <meta content="initial-scale=1.0">
<title>Microblog</title> <title>Microblog</title>
<link href="./style.css" rel="stylesheet" type="text/css" media="all"> <link href="./style.css" rel="stylesheet" type="text/css" media="all">
<link href="./timeline.css" rel="stylesheet" type="text/css" media="all"> <link href="./timeline.css" rel="stylesheet" type="text/css" media="all">
</head> </head>
<body> <body>
<div class="content">
<header>
<h1>A Microblog in Plain HTML</h1>
</header>
<h1>A Microblog in Plain HTML</h1> <div class="primary">
<div>
<div class = "row"> <div class = "column"> <aside>
<div class="profile">
<img src="./images/avatar.jpg" alt="Avatar" class="avatar"> <img src="./images/avatar.jpg" alt="Avatar" class="avatar">
<span class="handle">Your Name Here</span> <span class="handle">Your Name Here</span>
<p><span class="email"><a href="mailto:user@host.tld">user@host.tld</a></span></p> <p><span class="email"><a href="mailto:user@host.tld">user@host.tld</a></span></p>
@ -24,19 +31,21 @@
<p>{tags}</p> <p>{tags}</p>
<h3>Pages</h3> <h3>Pages</h3>
<p>{pages}</p> <p>{pages}</p>
</div> </aside>
</div> </div>
</div>
<div class = "timeline"> <main>
{timeline} {timeline}
</div> </main>
</div> </div>
<center> <footer>
<a href="https://notabug.org/likho/microblog.py">microblog.py</a> <a href="https://notabug.org/likho/microblog.py">microblog.py</a>
</center> </footer>
</div>
</body> </body>
</html> </html>