Hello guys. I am new on this forum and have just completed the project tribute page in the responsive web design certification. Here is the link for the project https://codepen.io/Aruthran/pen/wvWadjJ. Please don’t criticize me too much because I just started learning html. Feel free to give your suggestions.
All in all, it looks pretty good.
If I were being nitpicky - I prefer to put a little rounding on the corners of images - not much, just a little so it isn’t such a sharp corner.
And I don’t like messing with the styling on links like you did with the hover events. Number one, anchor links like this - people expect them to behave in a certain way. And your hover event causes the text to jump. I always say that if you don’t want the standard link, make it a button. But there are those that disagree.
and the image link:
<img id= "image" src= https://cms.qz.com/wp-content/uploads/2018/10/india-gandhi-jayanti.jpg?quality=75&strip=all&w=1200&h=900&crop=1 >
should have quotes around the url for the src
. I think it figures it out, but it should have quotes.
But still, it looks good. Have fun on the next project.
Welcome to the forums @arunakiri2016. Your page looks good. Some things to revisit;
- Codepen provides the boilerplate for you. It only expects the code you’d put within the
body
element in HTML. (No need to include thebody
tags). For anything you want to add to the<head>
element click on the ‘Settings’ button, then HTML and add it into the ‘Stuff for <head>’ box. - Run your HTML code through the W3C validator.
- There are HTML coding errors you should be aware of and address.
- HINT: Take a look at the
src
attribute
- HINT: Take a look at the
- There are HTML coding errors you should be aware of and address.
- Do not use the
<br>
element to force line breaks or spacing. That’s what CSS is for. - Review the lesson about giving meaningful text to links.
- Web Accessibility in Mind has a more thorough explanation.
- “wikipedia” is not accessible
Thanks. I am glad to see your positive feedback. I have already improved the code as much as I can, following your comments.
Thanks. It’s great that I have people giving me positive feedback. It makes sense that the link was not that meaningful since I haven’t completed the lesson you referred me to. I just wanted to get an overview of the projects.