* 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)
52 lines
997 B
Smarty
52 lines
997 B
Smarty
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta content="initial-scale=1.0">
|
|
<title>Microblog</title>
|
|
|
|
<link href="./style.css" rel="stylesheet" type="text/css" media="all">
|
|
<link href="./timeline.css" rel="stylesheet" type="text/css" media="all">
|
|
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<header>
|
|
<h1>A Microblog in Plain HTML</h1>
|
|
</header>
|
|
|
|
<div class="primary">
|
|
|
|
<div>
|
|
|
|
<aside>
|
|
<img src="./images/avatar.jpg" alt="Avatar" class="avatar">
|
|
<span class="handle">Your Name Here</span>
|
|
<p><span class="email"><a href="mailto:user@host.tld">user@host.tld</a></span></p>
|
|
<div class="bio">Description
|
|
<h4>{postcount} total posts</h4>
|
|
<h3>Tags</h3>
|
|
<p>{tags}</p>
|
|
<h3>Pages</h3>
|
|
<p>{pages}</p>
|
|
</aside>
|
|
|
|
</div>
|
|
|
|
<main>
|
|
{timeline}
|
|
</main>
|
|
|
|
</div>
|
|
|
|
<footer>
|
|
<a href="https://notabug.org/likho/microblog.py">microblog.py</a>
|
|
</footer>
|
|
|
|
</body>
|
|
|
|
</html>
|
|
|