-
Notifications
You must be signed in to change notification settings - Fork 0
/
blog.html
96 lines (92 loc) · 3.87 KB
/
blog.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>ALL ABOUT DUCKS!</title>
<meta name="viewport" content="width=90%, initial-scale=1, height=90%" />
<link rel="stylesheet" href="css/styles.css" />
<!-- Icon from https://iconduck.com/icons/115329/duck -->
<link rel="icon" type="image/x-icon" href="assets/duck.svg" />
</head>
<body>
<div class="containerBlog">
<!-- Navigation links -->
<nav class="nav">
<a class="lnk" href="index.html">Home</a> |
<a href="about.html">About</a> |
<a href="subscribedummy.html">Subscribe</a>
<input name="fsrch" id="fsrch" placeholder="Search" />
</nav>
<!-- Banner Image -->
<div class="banner"><h1>ALL ABOUT DUCKS!</h1></div>
<!-- main content / intro -->
<main class="main">
<h2>Rubber Ducks!</h2>
<img class="quack" src="assets/taxduck.png" alt="tax duck photo" />
<p class="articleText">
<!-- 800x533 image dimensions -->
<strong>There are various types of ducks in the world. </strong>In
programming, the rubber duck is very popular. Rubber ducking is the
act of debugging code out loud by explaining the code to a rubber
duck, line by line.
<br />
<br />
This method often allows a programmer to hit upon the solution to the
bug. One for my desk at home would be useful for the many times I get
confused by my own code. This duck is the one that sits on my desk at
work. It doesn't know anything about fighting the IRS, but it still
looks cute.
</p>
<p></p>
<blockquote>
By explaining your program to a duck, you often magically find the
flaw in your code. Because of the psychology of how we humans relate,
you’re forced to think fresh when you invoke your little rubber ducky,
and your problem may be quite simply solved.
<p>- David, Thoughtful Code</p>
</blockquote>
</main>
<!-- These divs will need to be flowed sidways and be positioned under the article for mobile screens -->
<!-- Author Info, pic, quickie bio, contact info? -->
<div class="authorInfo">
<div class="authorName">Author Info</div>
<!-- don't forget divs when trying to align things. like this one. this one will now be holder of all author info-->
<div class="photo">
<div class="social">
<a href="https://www.linkedin.com/in/omar-codes/">
<img src="assets/linkedin.png" alt="linkedin logo" /></a
><a href="https://github.com/aA-2023/UDACITY-FEND-allaboutducks">
<img src="assets/github.png" alt="github logo"
/></a>
</div>
<img
class="authorPhoto"
src="assets/authorPhoto.jpeg"
alt="author image"
/>
<div class="bio">
Omar's neighbor at work had a tradition of bringing and passing out
rubber ducks to the entire Tax Coordinator team. The tradition of
squeaking them throughout the day, and the local park with lake,
greenery and wildlife brought respite throughout the days working to
solve frazzled client's tax debt issues.
</div>
</div>
</div>
<!-- Footer -->
<footer class="footer">
<u> Made in 2024 with:</u>
<a href="http://www.udacity.com"
><img
src="assets/udacity.webp"
alt="udacity icon"
class="button" /></a
><a href="http://www.oneten.org"
><img src="assets/oneten.svg" alt="oneten icon" class="button" /></a
><a href="https://www.redbull.com/us-en"
><img src="assets/energy.png" alt="red bull icon" class="red button"
/></a>
</footer>
</div>
</body>
</html>