L.• 110
@seilreven
Submitted
Please let me know how I can improve my JS code in this project, many thanks!
Abdur Rahaman
@arbaiv
All comments
- Abdur Rahaman• 350
@arbaiv
Posted
Hi, there👋. Amazing project, nice work with the JS.
Once you submit the form with the input fields empty, it shows an error as expected 👍 Then when you enter text into the input field and focus out from it, the error message still shows. And it doesn't go away until you hit the submit button again. It's okay, not a big deal, but it's not good for the UX.
You can improve that by adding a blur event to the input element that will check: if the input value is available then remove the error message.
1 - Vishrut Aggarwal• 40
@BookGlutton
Submitted
My first try at adding JavaScript functionality in a front-end project. I would appreciate feedback on how to improve my code.
Abdur Rahaman• 350@arbaiv
Posted
Hi, 👍. Nice project. Love the animation that you have added 🔥
0 @aku1310
Submitted
This was my first project where I had to implement JavaScript and it was definitely fun. Any feedback on how I can improve my skills would be appreciated!
Abdur Rahaman• 350@arbaiv
Posted
Hi, Akanksha 👋. Nice project. Love the simple JS. You should always add an alt attribute in your img elements. It's really important for accessibility.
Also as you are improving your JS. You can also learn to add animation to this article preview component. Like in this project ⬇️ https://focused-mccarthy-4f8978.netlify.app/ It's simple to do, reply back or feel free to contact me in Linkedin to learn about it.
Marked as helpful
1- Romário J. Santos• 270
@romariojs94
Submitted
Abdur Rahaman• 350@arbaiv
Posted
Hi, Romario 👍nicely done. To improve your accessibilities in HTML, you can read this article below: https://developer.mozilla.org/en-US/docs/Learn/Accessibility I also had accessibility issues in my project. But I learned from this article.
You also should add keyboard functionality by adding role="button" tabindex="0" in the <dt> elements. Then the user would be able to tab through the faq accordion cards.
Marked as helpful
1 - kelvin• 160
@devenyam
Submitted
All feedback is kindly welcomed. .😊
Abdur Rahaman• 350@arbaiv
Posted
Hi, nice work. When the form is submitted with empty fields there should be an error text. The custom button isn't working for the mouse interaction, so it needs a little bit of JS work.
For accessibility issues: Add an alt attribute to your images, it's really important. Also, wrap the content inside of the <main> element.
You can learn more about accessibilities from this link below: https://developer.mozilla.org/en-US/docs/Learn/Accessibility Accessibilities in HTML5 are super important.
Marked as helpful
1 Hello~! (●ˇ∀ˇ●)
This project further helps me understand about JS and forms, which is really awesome! But JS still confuses me, so if you have any tips please let me know!
Please do check this one out! If you have any feedback or suggestions, please do let me know! Thank you so much.
Abdur Rahaman• 350@arbaiv
Posted
Hi, there👋. Clean project, nice work with the JS.
Once you submit the form with the input fields empty, it shows an error as expected 👍. Then when you enter text into the input field and focus out from it, the error message still shows. And it doesn't go away until you hit the submit button again. It's okay, not a big deal, but it's not good for the UX.
You can improve that by adding a blur event to the input element that will check: if the input value is available then remove the error message.
Marked as helpful
1- Aniket• 170
@NinjaAniket
Submitted
Abdur Rahaman• 350@arbaiv
Posted
Hi Aniket 👋. Good work with the project. The article should appear when clicked on the share button. Because in your project, the article appears when you hover over it, which makes it difficult to click on the social media icon. The article just disappears before the cursor reaches the social media buttons. It's okay but not really good for the UX.
1 - Flaviane• 30
@Flaviane-Brum
Submitted
Please provide feedback, so I can do better in the future, thank you.
Abdur Rahaman• 350@arbaiv
Posted
Hi, Flaviane 👋. Nice project, love the work. The responsiveness could be improved by making the content vertically centered for larger device sizes.
Once you submit the form with the input fields empty, it shows an error as expected 👍. Then when you enter text into the input field and focus out from it, the error message still shows. And it doesn't go away until you hit the submit button again. It's okay, not a big deal, but it's not good for the UX.
You can improve that by adding a blur event to the input element that will check: if the input value is available then remove the error message.
Marked as helpful
0 - Ariane Brum• 30
@Ariane-Brum
Submitted
Please provide feedback, so i can do better in the future, thank you.
Abdur Rahaman• 350@arbaiv
Posted
Hi, Ariane 👋. Amazing work. Once you submit the form with the input fields empty, it shows an error as expected 👍. Then when you enter text into the input field and focus out from it, the error message still shows. And it doesn't go away until you hit the submit button again. It's okay, not a big deal, but it's not good for the UX.
You can improve that by adding a blur event to the input element that will check: if the input value is available then remove the error message.
Marked as helpful
1 - Mart• 60
@Olu-martins
Submitted
Please what do I need to improve on?
Abdur Rahaman• 350@arbaiv
Posted
Hi Mart 👋. Amazing project. If you want to improve your accessibility issues you can check out this article: https://developer.mozilla.org/en-US/docs/Learn/Accessibility
Marked as helpful
0 - santhi• 300
@sansanthi
Submitted
Any feedback and suggestions would be appreciated. It takes me a lot of time to do positioning shadow background image in desktop view.
Abdur Rahaman• 350@arbaiv
Posted
Hi there 👋, amazing project, clean JS. You can add the click event on the question itself and not just only on the icon. It's better for the UX. Also, you should add Keyboard functionality by adding role="button" tabindex="0" on the div.question element.
Marked as helpful
0 - Daniel Gonzalez• 10
@danproducer
Submitted
How can i put in the center the image when its in mobile size? and i dont know what happened but the background image dissapeared when I upgrade the HTML and CSS. Could you help to know what could happened? Thank you!
Abdur Rahaman• 350@arbaiv
Posted
Hi, nice project.
- To fix the image problem just add width: 100% to the img.
- You can also fix your background-image. You have to add background-image: url(../images/pattern-background-desktop.svg); To get to the parent directory you have to add double dot ../
Also, you can learn about web accessibilities from here: https://developer.mozilla.org/en-US/docs/Learn/Accessibility
I also had accessibility issues in my previous projects. So, recently, I learned about web accessibility from there. I hope that it will help you in your future projects.
0
