Hi everyone, new here. I will appreciate feedback on my Landing Page project https://codepen.io/tideh2021/pen/PoOjOJx . Thanks
First congrats for your third project! Second, my little analyse.
Without watch the code:
I constat that the video and the text before scroll and hover the next of your content:
The other thing I could say is about how your page looks. I am sure you spent a lot of time on the product part and I find it is good. About the color, not really what I prefer but it stays my personal point of view.
In watching the HTML code:
Most of the people have their way to do, especially that HTML allows you a lot of things. Now I saw some little things that should be updated.
<P id="videoP">You can watch the video of our exciting T-shirts line up below...</P>
It is not good to use uppercase your HTML tags. The format should be lower case:
<p id="videoP">You can watch the video of our exciting T-shirts line up below...</p>
After in your code, you didn’t do this mistake anymore, so it is just a mistake. I see also that you use sometimes the following syntax:
It works, this is sure, but it would be better to avoid to repeat this tag. I advice you to use CSS for these kind of purpose which makes the code cleaner.
Also, I see that you use the tag
<small>. They exist, they can be use, it works. But they make part of the first versions of HTML. Then you had CSS, which added more and more possibilities. For SEO purposes, I would suggest you to use tags that give important meaning such as
<em>. They don’t mean that the code between them should be bold or italic, it just says that it is very important or important. The browsers decide how the content will look inside those tags if there is no CSS apply to those tags. Then you can decide you want this or this content in italic, in giving importance to the part of your code and using a little bit of CSS.
In fact my advice is to keep the CSS to change your style, and HTML to define the content. Like this you will never have conflict between your HTML code and your CSS and it will be cleaner and better for SEO.
My message is a little bit long, so I stop haha! When you want feedbacks, there is a subform better for this: #project-feedback
You can have more people analysing what you did
Hi LuclH, thank you for your advice. I find your points valid and will update the project accordingly.
Welcome to the forums @tongm5. Your page looks good. Some things to revisit;
- Run your HTML code through the W3C validator.
There are HTML syntax/coding errors you should be aware of and address.
Since copy/paste from codepen you can ignore the first warning and first two errors.
- Codepen provides validators for HTML, CSS and JS. Click on the chevron in the upxper right of each section and then click on the respective ‘Analyze’ link.
The one for CSS is good. Use it and address the issue(s).
(The one for HTML misses things which is why I recommend W3C)
- Do not use the
<br>element to force line breaks or spacing. That’s what CSS is for.
Reference MDN Docs
- Check that the user has entered a valid email addr. Throw an HTML5 validation error if not.
You learned to do this when coding the survey form
- Keep all your styling external. Do not use in-line styling.
When requesting feedback on a project it’s best to open your topic in the #project-feedback subform.
I’ve taken the liberty of moving this for you.
Thank you Roma for taking the time to look at my work and the codepen tutorial. I am still learning how to use the codepen, I do most of my work on VS then copy /paste to codepen.
Thank you. Fixed https://codepen.io/tideh2021/pen/PoOjOJx
You’re welcome @tongm5, I checked your project again. You still have an issue with the video part. if you decrease the height of the screen, the video, will decrease its size too until a minimum height. Then it will appear in your email part.
Without decreasing the height:
in decreasing the height:
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.