diff options
Diffstat (limited to 'HTML/Chapter/Ch. 2 hands-on assignments')
27 files changed, 674 insertions, 0 deletions
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.1.heading.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.1.heading.html new file mode 100644 index 0000000..bf901fa --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.1.heading.html @@ -0,0 +1,15 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Heading Example</title>
+<meta charset="utf-8">
+</head>
+<body>
+<h1>Test 1</h1>
+<h2>Test 2</h2>
+<h3>Test 3</h3>
+<h4>Test 4</h4>
+<h5>Test 5</h5>
+<h6>Test 6</h6>
+</body>
+</html>
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.10.png b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.10.png Binary files differnew file mode 100644 index 0000000..c0c553f --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.10.png diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.11.structure.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.11.structure.html new file mode 100644 index 0000000..78d7e90 --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.11.structure.html @@ -0,0 +1,29 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Trillium Media Design</title>
+<meta charset="utf-8">
+</head>
+<body>
+<header>
+ <h1>Trillium Media Design</h1>
+</header>
+<nav>
+ <b>Home Services Contact</b>
+</nav>
+<main>
+ <h2>New Media and Web Design</h2>
+ <p>Trillium Media Design offers a comprehensive range of services to take your company's Web presence to the next level. </p>
+ <h2>Meeting Your Business Needs</h2>
+ <p>Our expert designers will listen to you as they create a website that helps to promote and grow your business. </p>
+</main>
+<footer>
+ <i><small>Copyleft 🄯 2022 msglm. Licensed under the <a href=https://creativecommons.org/licenses/by-sa/4.0/>CC BY-SA 4.0</a>.</small></i>
+</footer>
+</body>
+</html>
+
+
+
+
+
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.12.casita.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.12.casita.html new file mode 100644 index 0000000..a4549b4 --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.12.casita.html @@ -0,0 +1,40 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Casita Sedona</title>
+<meta charset="utf-8">
+</head>
+<body>
+<header>
+ <h1>Casita Sedona Bed & Breakfast</h1>
+</header>
+<nav>
+ <b>
+ Home
+ Rooms
+ Events
+ Contact
+ </b>
+</nav>
+<main>
+ <h2>Stay in the Heart of Sedona</h2>
+ <p>At Casita Sedona Bed & Breakfast you'll be close to art galleries, shops, restaurants, hiking trails, and tours. Ride the free trolley to shops and galleries.</p>
+ <h3>Luxurious Rooms </h3>
+ <p>Stay in a well-appointed room at Casita Sedona with your own fireplace, king-size bed, and balcony overlooking the red rocks.</p>
+ <div>
+ <strong>Casita Sedona Bed & Breakfast</strong><br>
+ 612 Tortuga Lane<br>
+ Sedona, AZ 86336<br>
+ 928-555-5555<br><br>
+ </div>
+</main>
+<footer>
+ <small><i>Copyleft 🄯 2022 msglm. Licensed under the <a href=https://creativecommons.org/licenses/by-sa/4.0/>CC BY-SA 4.0</a>.</i></small>
+</footer>
+</body>
+</html>
+
+
+
+
+
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.13.blog.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.13.blog.html new file mode 100644 index 0000000..497798f --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.13.blog.html @@ -0,0 +1,46 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Lighthouse Bistro Blog</title>
+<meta charset="utf-8">
+</head>
+<body>
+ <header>
+ <h1>Lighthouse Bistro</h1>
+ </header>
+ <nav>
+ <b>
+ Home
+ Menu
+ Blog
+ Contact
+ </b>
+ </nav>
+ <main>
+ <section>
+ <aside><p><i>Watch for the March Madness Wrap next month!</i></p></aside>
+ <h2>Bistro Blog</h2>
+
+ <article>
+ <header><h3>Valentine Wrap</h3></header>
+ <time datetime="2022-02-01">February 1, 2022</time>
+ <p>The February special sandwich is the Valentine Wrap —
+ heart-healthy organic chicken with roasted red peppers on a
+ whole wheat wrap.</p>
+ </article>
+ <article>
+ <header><h3>New Coffee of the Day Promotion</h3></header>
+ <time datetime="2022-01-12">January 12, 2022</time>
+ <p>Enjoy the best coffee on the coast in the comfort of your
+ home. We will feature a different flavor of our gourmet,
+ locally roasted coffee each day with free bistro tastings and a
+ discount on one-pound bags.</p>
+ </article>
+ </section>
+ </main>
+ <footer>Copyleft 🄯 2022
+ </footer>
+</body>
+</html>
+
+
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.14.anchor.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.14.anchor.html new file mode 100644 index 0000000..815ca8c --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.14.anchor.html @@ -0,0 +1,10 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Anchor Example</title>
+<meta charset="utf-8">
+</head>
+<body>
+<a href="http://webdevbasics.net">Basics of Web Design Textbook Companion</a>
+</body>
+</html>
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.16/contact.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.16/contact.html new file mode 100644 index 0000000..8ca9ab7 --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.16/contact.html @@ -0,0 +1,34 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Trillium Media Design - Contact</title>
+<meta charset="utf-8">
+</head>
+<body>
+<header>
+ <h1>Trillium Media Design</h1>
+</header>
+<nav>
+ <b>
+ <a href="index.html">Home</a>
+ <a href="services.html">Services</a>
+ <a href="contact.html">Contact</a>
+ </b>
+</nav>
+<main>
+ <h2>Contact Trillium Media Design Today</h2>
+ <ul>
+ <li>E-mail: <a href="mailto:contact@trilliummediadesign.com">contact@trilliummediadesign.com</a></li>
+ <li>Phone: 555-555-5555</li>
+ </ul>
+</main>
+<footer>
+ <small><i>Copyleft 🄯 2022 msglm</i></small>
+</footer>
+</body>
+</html>
+
+
+
+
+
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.16/index.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.16/index.html new file mode 100644 index 0000000..a933d75 --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.16/index.html @@ -0,0 +1,33 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Trillium Media Design</title>
+<meta charset="utf-8">
+</head>
+<body>
+<header>
+ <h1>Trillium Media Design</h1>
+</header>
+<nav>
+ <b>
+ <a href="index.html">Home</a>
+ <a href="services.html">Services</a>
+ <a href="contact.html">Contact</a>
+ </b>
+</nav>
+<main>
+ <h2>New Media and Web Design</h2>
+ <p>Trillium Media Design offers a comprehensive range of services to take your company's Web presence to the next level. </p>
+ <h2>Meeting Your Business Needs</h2>
+ <p>Our expert designers will listen to you as they create a website that helps to promote and grow your business.</p>
+</main>
+<footer>
+ <small><i>Copyleft 🄯 2022 msglm</i></small>
+</footer>
+</body>
+</html>
+
+
+
+
+
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.16/services.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.16/services.html new file mode 100644 index 0000000..68cc664 --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.16/services.html @@ -0,0 +1,38 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Trillium Media Design - Services</title>
+<meta charset="utf-8">
+</head>
+<body>
+<header>
+ <h1>Trillium Media Design</h1>
+</header>
+<nav>
+ <b>
+ <a href="index.html">Home</a>
+ <a href="services.html">Services</a>
+ <a href="contact.html">Contact</a>
+ </b>
+</nav>
+<main>
+ <h2>Our Services Meet Your Business Needs</h2>
+ <dl>
+ <dt><strong>Website Design</strong></dt>
+ <dd>Whether your needs are large or small, Trillium can get you on the Web!</dd>
+ <dt><strong>E-Commerce Solutions</strong></dt>
+ <dd>Trillium offers quick entry into the e-commerce marketplace.</dd>
+ <dt><strong>Search Engine Optimization</strong></dt>
+ <dd>Most people find new sites using search engines. Trillium can get your website noticed.</dd>
+</dl>
+</main>
+<footer>
+ <small><i>Copyleft 🄯 2022 msglm</i></small>
+</footer>
+</body>
+</html>
+
+
+
+
+
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.2.paragraph.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.2.paragraph.html new file mode 100644 index 0000000..60e1fd3 --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.2.paragraph.html @@ -0,0 +1,22 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Paragraph Example</title>
+<meta charset="utf-8">
+</head>
+<body>
+<h1>Test 1</h1>
+<p>Sample Test Paragraph. </p>
+<h2>Test 2</h2>
+<h3>Test 3</h3>
+<h4>Test 4</h4>
+<h5>Test 5</h5>
+<h6>Test 6</h6>
+</body>
+</html>
+
+
+
+
+
+
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.3.linebreak.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.3.linebreak.html new file mode 100644 index 0000000..c7098a7 --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.3.linebreak.html @@ -0,0 +1,23 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Line Break Example</title>
+<meta charset="utf-8">
+</head>
+<body>
+<h1>Test 1</h1>
+<p>This is a sample paragraph. <br /> This is a linebreak test.
+</p>
+<h2>Test 2</h2>
+<h3>Test 3</h3>
+<h4>Test 4</h4>
+<h5>Test 5</h5>
+<h6>Test 6</h6>
+</body>
+</html>
+
+
+
+
+
+
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.4.hr.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.4.hr.html new file mode 100644 index 0000000..8c95b56 --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.4.hr.html @@ -0,0 +1,24 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Horizontal Rule Example</title>
+<meta charset="utf-8">
+</head>
+<body>
+<h1>Heading Level 1</h1>
+<p>This is a sample paragraph. <br> Heading tags can help to make your pages more accessible and usable. It is good coding practice to use heading tags to outline the structure of your web page content.
+</p>
+<hr>
+<h2>Heading Level 2</h2>
+<h3>Heading Level 3</h3>
+<h4>Heading Level 4</h4>
+<h5>Heading Level 5</h5>
+<h6>Heading Level 6</h6>
+</body>
+</html>
+
+
+
+
+
+
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.5.blockquote.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.5.blockquote.html new file mode 100644 index 0000000..fa5ce63 --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.5.blockquote.html @@ -0,0 +1,15 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Blockquote Example</title>
+<meta charset="utf-8">
+</head>
+<body>
+<h1>The Power of the Web</h1>
+<p>According to Richard Stallman, the inventor of the GNU Operating system and founder of the Free Software Foundation, from the <a href=https://www.gnu.org/gnu/manifesto.en.html>GNU Manifesto</a>:
+</p>
+<blockquote>
+The idea of copyright did not exist in ancient times, when authors frequently copied other authors at length in works of non-fiction. This practice was useful, and is the only way many authors' works have survived even in part.
+</blockquote>
+</body>
+</html>
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.6.ol.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.6.ol.html new file mode 100644 index 0000000..541373b --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.6.ol.html @@ -0,0 +1,16 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Heading and List</title>
+<meta charset="utf-8">
+</head>
+<body>
+<h1>My Favorite Colors</h1>
+<ol>
+ <li>Blue</li>
+ <li>Green</li>
+ <li>Teal</li>
+
+</ol>
+</body>
+</html>
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.6.ola.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.6.ola.html new file mode 100644 index 0000000..e5eaead --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.6.ola.html @@ -0,0 +1,15 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Heading and List</title>
+<meta charset="utf-8">
+</head>
+<body>
+<h1>My Favorite Colors</h1>
+<ol type="A">
+ <li>Blue</li>
+ <li>Green</li>
+ <li>Teal</li>
+</ol>
+</body>
+</html>
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.7.ul.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.7.ul.html new file mode 100644 index 0000000..87004b2 --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.7.ul.html @@ -0,0 +1,15 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Heading and List</title>
+<meta charset="utf-8">
+</head>
+<body>
+<h1>My Favorite Colors</h1>
+<ul>
+ <li>Blue</li>
+ <li>Teal</li>
+ <li>Red</li>
+</ul>
+</body>
+</html>
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.8.description.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.8.description.html new file mode 100644 index 0000000..e0900e8 --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.8.description.html @@ -0,0 +1,21 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Description List</title>
+<meta charset="utf-8">
+</head>
+<body>
+<h1>Sample Description List</h1>
+<dl>
+ <dt>TCP</dt>
+ <dd>Transmission Control Protocol is a method (protocol) used along with the Internet Protocol (IP) to send data in the form of message units, called packets, between computers over the Internet.</dd>
+ <dt>IP</dt>
+ <dd>Internet Protocol is the method or protocol by which data is sent from one computer to another on the Internet. Each computer on the Internet is uniquely identified by an IP address.</dd>
+ <dt>FTP</dt>
+ <dd>File Transfer Protocol is a protocol used to exchange files between computers on the Internet. </dd>
+ <dt>HTTP</dt>
+ <dd>Hypertext Transfer Protocol is the protocol used for exchanging text, graphic images, sound, video, and other multimedia files on the Web.</dd>
+</dl>
+</body>
+</html>
+
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.9.design.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.9.design.html new file mode 100644 index 0000000..140d5cc --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/2.9.design.html @@ -0,0 +1,26 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Creative Commons</title>
+<meta charset="utf-8">
+</head>
+<body>
+<h1>Web Design Steps</h1>
+ <ul>
+ <li><strong>Determine the Intended Audience</strong><br>
+ The colors, images, fonts, and layout should be tailored to the
+ <em>preferences of your audience.</em> The type of site content (reading level, amount of animation, etc.) should be appropriate for your chosen audience.</li>
+ <li><strong>Determine the Goals of the Site</strong><br>
+ Some common goals of web sites are: to be informative, to create a personal home page, to establish a corporate web presence, and to do business in e-commerce.</li>
+ <li><strong>Determine the General Content and Create a Site Map</strong><br>
+ The site map is sometimes called a Storyboard. Common organizational structures for Web sites are: hierarchical, linear, and random.</li>
+ <li><strong>Sketch a Tentative Page Layout</strong><br>
+ <em>Be consistent</em> in your overall layout — color, typefaces, logo location,
+ navigation bar, etc. Plan your Home Page Layout to avoid scrolling.
+ Plan your Content Page Layout to be consistent, with easy navigation.</li>
+</ul>
+
+
+<p><small>Copyleft 🄯 2022 msglm. Licensed under the <a href=https://creativecommons.org/licenses/by-sa/4.0/>CC BY-SA 4.0</a>.</small></p>
+</body>
+</html>
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/block.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/block.html new file mode 100644 index 0000000..073816e --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/block.html @@ -0,0 +1,21 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Block Anchor</title>
+<meta charset="utf-8">
+</head>
+<body>
+<header>
+<a href="http://www.w3.org/TR/html-markup">
+<h1>HTML5 Reference</h1>
+<p>Bookmark this site for a handy HTML5 reference.</p>
+</a>
+</header>
+<main>
+<p>
+Website content goes here
+</p>
+</main>
+
+</body>
+</html>
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/em.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/em.html new file mode 100644 index 0000000..7213b6f --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/em.html @@ -0,0 +1,15 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Blockquote Example</title>
+<meta charset="utf-8">
+</head>
+<body>
+<h1>The Power of the Web</h1>
+<p>According to Tim Berners-Lee, the inventor of the World Wide Web, at https://www.w3.org/Press/IPO-announce:
+</p>
+<blockquote>
+The power of the Web is in its universality. <em>Access by everyone</em> regardless of disability is an essential aspect.
+</blockquote>
+</body>
+</html>
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/mypractice/contact.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/mypractice/contact.html new file mode 100644 index 0000000..a89283d --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/mypractice/contact.html @@ -0,0 +1,34 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Trillium Media Design - Contact</title>
+<meta charset="utf-8">
+</head>
+<body>
+<header>
+ <h1>Trillium Media Design</h1>
+</header>
+<nav>
+ <b>
+ <a href="index.html">Home</a>
+ <a href="services.html">Services</a>
+ <a href="contact.html">Contact</a>
+ </b>
+</nav>
+<main>
+ <h2>Contact Trillium Media Design Today</h2>
+ <ul>
+ <li>E-mail: contact@trilliummediadesign.com</li>
+ <li>Phone: 555-555-5555</li>
+ </ul>
+</main>
+<footer>
+ <small><i>Copyleft 🄯 2022 msglm</i></small>
+</footer>
+</body>
+</html>
+
+
+
+
+
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/mypractice/index.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/mypractice/index.html new file mode 100644 index 0000000..a933d75 --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/mypractice/index.html @@ -0,0 +1,33 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Trillium Media Design</title>
+<meta charset="utf-8">
+</head>
+<body>
+<header>
+ <h1>Trillium Media Design</h1>
+</header>
+<nav>
+ <b>
+ <a href="index.html">Home</a>
+ <a href="services.html">Services</a>
+ <a href="contact.html">Contact</a>
+ </b>
+</nav>
+<main>
+ <h2>New Media and Web Design</h2>
+ <p>Trillium Media Design offers a comprehensive range of services to take your company's Web presence to the next level. </p>
+ <h2>Meeting Your Business Needs</h2>
+ <p>Our expert designers will listen to you as they create a website that helps to promote and grow your business.</p>
+</main>
+<footer>
+ <small><i>Copyleft 🄯 2022 msglm</i></small>
+</footer>
+</body>
+</html>
+
+
+
+
+
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/mypractice/services.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/mypractice/services.html new file mode 100644 index 0000000..68cc664 --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/mypractice/services.html @@ -0,0 +1,38 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Trillium Media Design - Services</title>
+<meta charset="utf-8">
+</head>
+<body>
+<header>
+ <h1>Trillium Media Design</h1>
+</header>
+<nav>
+ <b>
+ <a href="index.html">Home</a>
+ <a href="services.html">Services</a>
+ <a href="contact.html">Contact</a>
+ </b>
+</nav>
+<main>
+ <h2>Our Services Meet Your Business Needs</h2>
+ <dl>
+ <dt><strong>Website Design</strong></dt>
+ <dd>Whether your needs are large or small, Trillium can get you on the Web!</dd>
+ <dt><strong>E-Commerce Solutions</strong></dt>
+ <dd>Trillium offers quick entry into the e-commerce marketplace.</dd>
+ <dt><strong>Search Engine Optimization</strong></dt>
+ <dd>Most people find new sites using search engines. Trillium can get your website noticed.</dd>
+</dl>
+</main>
+<footer>
+ <small><i>Copyleft 🄯 2022 msglm</i></small>
+</footer>
+</body>
+</html>
+
+
+
+
+
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/starter.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/starter.html new file mode 100644 index 0000000..9e7949d --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/starter.html @@ -0,0 +1,36 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Lighthouse Bistro</title>
+<meta charset="utf-8">
+</head>
+<body>
+ <header>
+ <h1>Lighthouse Bistro</h1>
+ </header>
+ <nav>
+ <b>
+ Home
+ Menu
+ Blog
+ Contact
+ </b>
+ </nav>
+ <main>
+ <h2>Locally Roasted Free-Trade Coffee</h2>
+ <p>Indulge in the aroma of freshly ground roast coffee. Specialty drinks are available hot or cold.</p>
+ <h2>Specialty Pastries</h2>
+ <p>Enjoy a selection of our fresh-baked, organic pastries, including
+ fresh-fruit muffins, scones, croissants, and cinnamon rolls.</p>
+ <h2>Lunchtime is Anytime</h2>
+ <p>Savor delicious wraps and sandwiches on hearty, whole-grain breads with locally-grown salad, fruit, and vegetables. </p>
+ <h2>Panoramic View</h2>
+ <p>Take in some scenery!</p>
+ <p>The top of our lighthouse offers a panoramic view of the countryside. Challenge your friends to climb our 100-stair tower.</p>
+ </main>
+ <footer>Copyright © 2022
+ </footer>
+</body>
+</html>
+
+
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/starter1.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/starter1.html new file mode 100644 index 0000000..1e45a3d --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/starter1.html @@ -0,0 +1,56 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Favorite Sites</title>
+<meta charset="utf-8">
+</head>
+<body>
+<h1>Favorite Sites</h1>
+<ul>
+ <li>Hobbies</li>
+ <li>HTML5</li>
+ <li>CSS</li>
+</ul>
+<h2>Hobbies</h2>
+ <dl>
+ <dt>Running</dt>
+ <dd><a href="http://www.runningnetwork.com">http://www.runningnetwork.com</a></dd>
+ <dt>Cooking</dt>
+ <dd><a href="http://www.cooking.com">http://www.cooking.com</a></dd>
+ </dl>
+<h2>HTML5</h2>
+ <dl>
+ <dt>Elements</dt>
+ <dd><a href="http://www.w3.org/TR/html5/">http://www.w3.org/TR/html5/</a></dd>
+ <dt>Tutorials</dt>
+ <dd><a href="http://www.w3schools.com/html5">http://www.w3schools.com/html5</a></dd>
+ </dl>
+<h2>CSS</h2>
+ <dl>
+ <dt>W3C Cascading Style Sheets</dt>
+ <dd><a href="http://www.w3.org/Style/CSS">http://www.w3.org/Style/CSS</a></dd>
+ <dt>Tutorials</dt>
+ <dd><a href="http://www.w3schools.com/css3">http://www.w3schools.com/css3</a></dd>
+ </dl>
+<br>
+<br>
+<br>
+<br>
+<br>
+<br>
+<br>
+<br>
+<br>
+<br>
+<br>
+<br>
+<br>
+<br>
+<br>
+<br>
+<br>
+<br>
+<br>
+<h2>Back to Top</h2>
+</body>
+</html>
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/target.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/target.html new file mode 100644 index 0000000..b91aef0 --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/target.html @@ -0,0 +1,10 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Anchor Example</title>
+<meta charset="utf-8">
+</head>
+<body>
+<a href="http://webdevbasics.net" target="_blank">Basics of Web Design Textbook Companion</a>
+</body>
+</html>
diff --git a/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/template.html b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/template.html new file mode 100644 index 0000000..6a48229 --- /dev/null +++ b/HTML/Chapter/Ch. 2 hands-on assignments/Ch2_msglm/template.html @@ -0,0 +1,9 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+<title>Page Title Goes Here</title>
+</head>
+<body>
+
+</body>
+</html>
\ No newline at end of file |