Project Landing Page Feedback Please!

Would love some feedback. Let me know what you think can be improved upon.

Overall, the site looks great. I love that the menu scrolls with you, but the links aren’t anchored to the correct sections. The layout is beautiful. If this were a real site, I may make an aesthetic suggestion to make the background a bit transparent so it doesn’t distract from the important information. Very nicely done.

Thanks! Great feedback. I’m having a pretty hard time anchoring the links correctly. They don’t behave the way I expect them too and haven’t had much luck with research. Any suggestions?

Sure. Here’s what freeCodeCamp has to [say]:

"To create an internal link, you assign a link’s href attribute to a hash symbol # plus the value of the id attribute for the element that you want to internally link to, usually further down the page. You then need to add the same id attribute to the element you are linking to. An id is an attribute that uniquely describes an element.

Below is an example of an internal anchor link and its target element: (I purposefully left out the beginning and ending < > so that the code wouldn’t be rendered)

-a href="#contacts-header">Contacts</a;

h2 id=“contacts-header”>Contacts</h2;

When users click the Contacts link, they’ll be taken to the section of the webpage with the Contacts header element."

So for your sit, if you wanted the “Subscribe” menu element to take you to the email address submission, you’d need something like this (I purposefully left out the beginning and ending < > so that the code wouldn’t be rendered):
a href="#subscribe">Subscribe</a
h2 id=“subscribe”>Get The Daily Teacup in your Inbox!</h2

Got it. I was doing that, but it was a bit messy. I started cleaning it up and then realized that the problem was that the anchors were behind the floating navbar. I was able to fix it with some javascript that I found here: https://github.com/twbs/bootstrap/issues/1768

Anchoring to the footer was still awkward so I decided to change the Contact link to support and have it open an email box.

I took your advice on adding some opacity to the background-image as well. Also tricky. Found a simple solution here: https://stackoverflow.com/questions/4183948/css-set-background-image-with-opacity

Thanks again! Let me know if you have any further suggestions.

Justin