refactor-exercise/index.html at main · tannerkothlow/refactor-exercise · GitHub

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
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
<!DOCTYPE html>
<html lang="en-us">
  <head>
    <meta charset="UTF-8" />
    <meta name="description" content="Horiseon is a web developement company that specializes in search engine optimization,
    online reputation management, and social media marketing for businesses, big and small. Working with the Horiseon team will
    lead to stronger brand recognition for your business.">
    <title>Horiseon Social Solution Services, Inc.</title>
    <link rel="stylesheet" href="./assets/css/style.css" />
  </head>

  <body>
    <!--Part of the assignment is to make the HTML divs into semantic tags!!!-->
    <header>
      <h1>Hori<span class="seo">seo</span>n</h1>
      <div>
        <ul>
          <!--Placeeholder hyperlinks, do not change.-->
          <li>
            <a href="#search-engine-optimization">Search Engine Optimization</a>
          </li>
          <li>
            <a href="#online-reputation-management">Online Reputation Management</a>
          </li>
          <li>
            <a href="#social-media-marketing">Social Media Marketing</a>
          </li>
        </ul>
      </div>
    </header>

    <div class="hero"></div>

    <main>

      <article>
        <img
          src="./assets/images/search-engine-optimization.jpg"
          alt="A notebook on a desk illustrates the factors for search engine optimization."
          class="float-left"
        />
        <h2>Search Engine Optimization</h2>
        <p>
          The dominance of mobile internet use means that users are searching
          for the right business as they travel, shop, or sit on their couch at
          home. Search Engine Optimization (SEO) allows you to increase your
          visibility and find the right customers for your business.
        </p>
      </article>

      <article>
        <img
          src="./assets/images/online-reputation-management.jpg"
          alt="Laptop displaying a client's imrpoving reputation."
          class="float-right"
        />
        <h2>Online Reputation Management</h2>
        <p>
          The web is full of opinions, and some of these can be negative. Social
          media allows anyone with an internet connection to say whatever they
          want about your business. Online Reputation Management gives you the
          control over what potential customers see when they search for your
          business.
        </p>
      </article>

      <article>
        <img
          src="./assets/images/social-media-marketing.jpg"
          alt="Meeting of a social media management crew."
          class="float-left"
        />
        <h2>Social Media Marketing</h2>
        <p>
          Social media continues to have a sizable influence on buying habits.
          Social media marketing helps you determine which platforms are suited
          to your brand, using analytics to find the right markets and increase
          your lead generation.
        </p>
      </article>

    </main>

    <nav>

      <section>
        <h3>Lead Generation</h3>
        <img src="./assets/images/lead-generation.png" alt="Lead generation icon." />
        <p>
          Inbound strategies for lead generation require less work for your
          business, bringing customers directly to your website.
        </p>
      </seciton>

      <section>
        <h3>Brand Awareness</h3>
        <img src="./assets/images/brand-awareness.png" alt="Brand awareness icon." />
        <p>
          Users find your business through paid and organic searches, increasing
          the search ranking and visibility for your business.
        </p>
      </section>

      <seciton>
        <h3>Cost Management</h3>
        <img src="./assets/images/cost-management.png" alt="Cost management icon." />
        <p>
          As the search ranking for your business increases, your advertising
          costs decrease, and you no longer need to advertise your page.
        </p>
      </seciton>

    </nav>

    <footer>
      <h2>Made with ❤️️ by Horiseon</h2>
      <p>&copy; 2022 Horiseon Social Solution Services, Inc.</p>
    </footer>
  </body>
</html>