Skip to content
thinkingwebdevelopment
  • Front Page
  • Blog
  • Lesson_4_HTML structure
  • Lesson 3. HTML code structure
  • Lesson 2. Open text editor
  • HTML page structure lesson 1
  • Resource Page
  • Home
  • Completed lessons
  • Introduction_Thinking web development
  • Checkout
  • PYTHON
  • Text books
  • Python-All lessons 2019
  • Python – All lessons 2019
  • Checkout
  • Courses
  • Profile
  • Become a Teacher
  • Activity
  • Members
  • Register
  • Activate
Site Search

Completed lessons

Completed lessons

HTML practice page
Lesson 1

this page is designed to help you master HTML web page format…
by memorizing the format and having muscle memory in your fingers of the keys you need to type for your format it will dramatically reduce your workload and speed up your progress…

~~
Copy and paste this entire page to “ Note pad “ .
if you cannot find Notepad installed on your computer don’t worry…
Do a Google search for “ free text editor “ and you will get a long list of text editors that you can download for free… any basic text editor will do a perfectly fine job for your homework studies.
I recommend notepad because if you are running Microsoft Windows it is pre-installed on your computer.
If you need to download a text editor I will not make any recommendation except that it be absolutely free. they all do basically the same thing the same way.
in lesson 2. I will teach you how to do this exact same exercise on an Android mobile device…
It will be necessary to download a text editor to do software programming on your cellular phone or tablet but it is possible.
~~~
Below each line of text that you see…

Use the empty line that is provided to..

Manually type in the text as exactly as what you see…
Be certain that you type in spaces, punctuation, text and numbers exactly the way you see them on the page.

When software interacts it perceives spaces and punctuation as a part of the code structure the same as it does text and numbers.
So Below each line of text use the space provided to copy exactly what you see

~~

<!DOCTYPE html>
<!DOCTYPE html>

<html>
<html>

<head>
<head>

<title>…</title>
<title>…</title>

</head>
</head>

<body>
<body>

<h1>…</h1>
<h1>…</h1>

<p>…</p>
<p>…</p>

</body>
</body>

</html>
</html>

<!DOCTYPE html>
<!DOCTYPE html>

<html>
<html>

<head>
<head>

<title>…</title>
<title>…</title>

</head>
</head>

<body>
<body>

<h1>…</h1>
<h1>…<h1>

<p>…</p>
<p>…</p>

</body>
</body>

</html>
</html>

<!DOCTYPEhtml>
<!DOCTYPE html>>

<html>
<html>

<head>
<head>

<title>…</title>
<title>…</title>

</head>
</head>

<body>
<body>

<h1>…</h1>
<h1>…</h1>

<p>…</p>
<p>…</p>

</body>
</body>

</html>
</html>

~~

<!DOCTYPE html>
<!DOCTYPE html>

<html>
<html>

<head>
<head>

<title>…</title>
<title>…</title>

</head>
</head>

<body>
<body>

<h1>…</h1>
<h1>…</h1>

<p>…</p>
<p>…</p>

</body>
</body>

</html>
</html>

~~

<!DOCTYPE html>
<!DOCTYPE html>

<html>
<html>

<head>
<head>

<title>…</title>
<title>…</title>

</head>
</head>

<body>
<body>

<h1>…</h1>
<h1>…</h1>

<p>…</p>
<p>…</p>

</body>
</body>

</html>
</html>

~~

<!DOCTYPE html>
<!DOCTYPE html>

<html>
<html>

<head>
<head>

<title>…</title>
<title>…</title>

</head>
</head>

<body>
<body>

<h1>…</h1>
<h1>…</h1>

<p>…</p>
<p>…</p>

</body>
</body>

</html>
</html>

~~

<!DOCTYPE html>
<!DOCTYPE html>

<html>
<html>

<head>
<head>

<title>…</title>
<title>…</title>

</head>
</head>

<body>
<body>

<h1>…</h1>
<h1>…</h1>

<p>…</p>
<p>…</p>

</body>
</body>

</html>
</html>

~~

<!DOCTYPE html>
<!DOCTYPE html>

<html>
<html>

<head>
<head>

<title>…</title>
<title>…</title>

</head>
</head>

<body>
<body>

<h1>…</h1>
<h1>…</h1>

<p>…</p>
<p>…</p>

</body>
</body>

</html>
</html>

~~

<!DOCTYPE html>
<!DOCTYPE html>

<html>
<html>

<head>
<head>

<title>…</title>
<title>…</title>

</head>
</head>

<body>
<body>

<h1>…</h1>
<h1>…</h1>

<p>…</p>
<p>…</p>

</body>
</body>

</html>
</html>

~~

~~

Lesson 7 continuing with HTML structure…completed.

Over the next couple of weeks we will be filling out this boilerplate so that it actually builds a website/page and you will be using your text editor and your browser from this point forward so hopefully you’ve gotten used to that…
~~

<!DOCTYPE html>
<!DOCTYPE html>

<html lang=”en”>
<html lang=”en”>

<head>
<head>

<meta charset=”utf-8″>
<meta charset=”utf-8”>

<title>The HTML5 Herald</title>
<title>The HTML5 Hearld</title>

<meta name=”description” content=”The HTML5 Herald”>
<meta name=”description” content=”The HTML5 Hearld”>

<meta name=”author” content=”SitePoint”>
<meta name=”author” content=”SitePoint”>

<link rel=”stylesheet” href=”css/styles.css”>
<link rel=”stylesheet” href=”css/styles.css”>

<!–[if lt IE 9]>
<!–[if it IE 9]>

<script src=”js/html5shim.js”>
<script src=”js/html5shim.js”>

</script>
</script>

<![endif]–>
<![endif]–>

</head>
</head>

<–everything above is in the head–>
<–everything above is in the head–>

<–everything below is in the body–>
<–everything below is in the body–>

<body>
<body>

<header>
<header>

<nav></nav>
<nav></nav>

</header>
</header>

<main role=”main”>
<main role=”main”>

<div class=”primary”>
<div class=”primary”>

<article></article>
<article></article>

</div>
</div>

<div class=”secondary”>
<div class=”secondary”>

<article></article>
<article></article>

</div>
</div>

<div class=”tertiary”>
<div class=”tertiary”>

<aside>
<aside>

<article></article>
<article></article>

</aside>
</aside>

<article>
<article>

</article>
</article>

</div>
</div>

</main><!– main –>
</main><!– main –>

<footer>
<footer>

<section id=”authors”>
<section Id=”authors”>

<section></section>
<section></section>

</section>
</section>

<section id=”copyright”>
<section Id=”copyright”>

</section>
</section>

</footer>
</footer>

<script src=”js/scripts.js”></script>
<script src=”js/scripts.js”></script>

</body>
</body>

</html>
</html>

<–this is a web page template for the project->
<–this is a web page template for the project –>

~~

<–below is the boiler plate in its full structure…

Underneath of this boiler plate… type out the entire boiler plate according to structure. Pay attention to spaces, punctuation, letters & numbers…

Make sure everything is identical to the original–>

<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”utf-8”>
<title>The HTML5 Hearld</title>
<meta name=”description” content=”The HTML5 Hearld”>
<meta name=”author” content=”SitePoint”>
<link rel=”stylesheet” href=”css/styles.css”>
<!–[if it IE 9]>
<script src=”js/html5shim.js”>
</script>
<![endif]–>
</head>
<–everything above this line is the head–>
<–everything below this line is the body–>
<body>
<header>
<nav></nav>
</header>
<main role=”main”>
<div class=”primary”>
<article></article>
</div>
<div class=”secondary”>
<article></article>
</div>
<div class=”tertiary”>
<article></article>
</div>
<aside>
<article></article>
</aside>
<article>
</article>
</div>
</main>
<!—main –>
<footer>
<section Id=”author”>
<section></section>
</section>
<Section Id=”copyright”>
</section>
</footer>
<script src=”js/scripts.js”></script>
</body>
</html>
~~

<–my transcription above

Original boilerplate code below–>

<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”utf-8″>
<title>The HTML5 Herald</title>
<meta name=”description” content=”The HTML5 Herald”>
<meta name=”author” content=”SitePoint”>
<link rel=”stylesheet” href=”css/styles.css”>
<!–[if lt IE 9]>
<script src=”js/html5shim.js”>
</script>
<![endif]–>
</head>
<–everything above is in the head–>
<–everything below is in the body–>
<body>
<header>
<nav></nav>
</header>
<main role=”main”>
<div class=”primary”>
<article></article>
</div>
<div class=”secondary”>
<article></article>
</div>
<div class=”tertiary”>
<aside>
<article></article>
</aside>
<article>
</article>
</div>
</main>
<!– main –>
<footer>
<section id=”authors”>
<section></section>
</section>
<section id=”copyright”>
</section>
</footer>
<script src=”js/scripts.js”></script>
</body>
</html>
<–this is a web page template for the project->

 

 

Recent Posts

  • Text book introduction and first chapter
  • I made an error
  • Keyboard navigation- Python prerequisite
  • TWD Python course introduction
  • 2019 Python for the serious student

Recent Comments

  • BrudderJ505 on Keyboard navigation- Python prerequisite
  • BrudderJ505 on Keyboard navigation- Python prerequisite

Archives

  • March 2019
  • February 2019
  • January 2019
  • November 2018
  • October 2018

Categories

  • Articles. .. machine learning
  • Uncategorised

Meta

  • Register
  • Log in
  • Entries RSS
  • Comments RSS
  • Hostinger
  • 000webhost

Open me. : )

Open Me to. ; )
Theme by Colorlib Powered by WordPress
  • Front Page
  • Blog
  • Lesson_4_HTML structure
  • Lesson 3. HTML code structure
  • Lesson 2. Open text editor
  • HTML page structure lesson 1
  • Resource Page
  • Home
  • Completed lessons
  • Introduction_Thinking web development
  • Checkout
  • PYTHON
  • Text books
  • Python-All lessons 2019
  • Python – All lessons 2019
  • Checkout
  • Courses
  • Profile
  • Become a Teacher
  • Activity
  • Members
  • Register
  • Activate
www.000webhost.com