Skip to content

Instantly share code, notes, and snippets.

@beatrizsmerino

beatrizsmerino/index.html

Created October 5, 2019 11:20
Show Gist options
  • Save beatrizsmerino/7270ce4990dd7813db0ace82fcdde000 to your computer and use it in GitHub Desktop.
Save beatrizsmerino/7270ce4990dd7813db0ace82fcdde000 to your computer and use it in GitHub Desktop.
Download ZIP
Sample HTML5 Layout
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="description" content="Sample HTML5 Layout">
<meta name="keywords" content="keyword 1, keyword 2, keyword 3">
<meta name="author" content="Beatriz Sopeña Merino">
<meta name="copyright" content="" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sample HTML5 Layout</title>
<link href="styles.min.css" rel="stylesheet" />
</head>
<body>
<header>
<div>
MY LOGO
</div>
<nav>
<ul>
<li>
<a href="#">
Link 1
</a>
</li>
<li>
<a href="#">
Link 2
</a>
</li>
<li>
<a href="#">
Link 3
</a>
</li>
<li>
<a href="#">
Link 4
</a>
</li>
<li>
<a href="#">
Link 5
</a>
</li>
</ul>
</nav>
</header>
<main>
<h1>
PAGE TITLE
</h1>
<section>
<h2>
SECTION TITLE
</h2>
<article>
<header>
<h2>
ARTICLE TITLE
</h2>
<p>
Posted on <time datetime="2009-09-04T16:31:24+02:00">September 4th 2009</time> by <a
href="#">Writer</a> - <a href="#comments">6 comments</a>
</p>
</header>
<div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper lacus a velit auctor,
sit amet viverra mi lobortis. Phasellus facilisis tempus enim. Interdum et malesuada fames ac
ante ipsum primis in faucibus. In eget porttitor magna. Cras nibh lorem, sodales ut eros ac,
convallis fermentum diam. Fusce lacus dolor, eleifend sit amet nulla sit amet, imperdiet pretium
neque. Maecenas facilisis maximus elementum.</p>
</div>
</article>
<article>
<h2>
ARTICLE TITLE
</h2>
</article>
</section>
<section>
<h2>
SECTION TITLE
</h2>
<article>
<h2>
ARTICLE TITLE
</h2>
</article>
<article>
<h2>
ARTICLE TITLE
</h2>
</article>
<article>
<h2>
ARTICLE TITLE
</h2>
</article>
</section>
</main>
<aside>
SIDEBAR
</aside>
<footer>
<nav>
<ul>
<li>
<a href="#">
Link 1
</a>
</li>
<li>
<a href="#">
Link 2
</a>
</li>
<li>
<a href="#">
Link 3
</a>
</li>
</ul>
</nav>
<p>Copyright 2019. beatrizsmerino. All right reserved.</p>
</footer>
<script src="scripts.min.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment