As a beginner in web development, it's easy to make mistakes when working with HTML, CSS, and JavaScript. Here are ten of the most common mistakes ...
For further actions, you may consider blocking this person and/or reporting abuse
Hi Lars, nice catch up!
Just pointing out an issue in the text:
The recommendation though, would be to use
webpformat on both cases.Best regards 😁
I would also suggest that SVGs have a specific role (diagrams, animation etc.) but I am no expert. "I just love SVGs".
Hahaha indeed they do!
SVGs have it's pros and cons, dealing with them is somewhat more difficult than images, just to clarify, SVGs are not images (representation of things through pixels) but Scalable Vector Graphics, which is super nice for logos and different stuff you need to scale depending on the client's device but annoying in certain situations (e.g. catalogs/product pictures)😁
Best regards!
Hi Joel,
I am not sure I agree with the statement "SVGs are not images". I think that requires a very specific definition of the word 'image'. Possibly you mean they are not raster but vector graphics, in that you would be absolutely correct.
SVG files can be loaded and presented in the browser using an
<img>element, so I do not really see much of a difference. For some graphical representations they are superior to PNG but they are not a panacea (one-stop shop) for all graphics. As you say, they have pros and cons.Absolutely Tracy, I've failed to use the correct wording (e.g. digital image file, bitmap/rasterized or any other), thanks for pointing it out! 😄
Hi Joel,
thanks for your feedback, i have added your suggestion as well as left you credits for it in the article 😉
Anytime! 😁
Thank you for the attribution as well 😃
Hi Lars, All good point but I would like to discuss a couple.
8, Commenting has become a slightly contentious point. "To comment or not to comment..." following Uncle Bob's (Robert Martin) advice on Clean Code. Commenting is not a bad thing but it should be applied with care and describe what the code does not. For example:
const MONTHS_IN_A_YEAR = 12;does not need a comment. That said, if you need a comment because what the code is doing is not obvious, it could be an indication the code needs to be refactored/simplified.10, Your point is correct, of course Accessibility (A11y) is important. In fact it gets more important as you get older, believe me! But IMO it is a mistake to apply a blanket mandate on the level of accessibility to be applied. I am speaking as an application developer rather than web site (content) creator but WCAG is still an essential set of rules to go by. However, we should not state "All applications need to be AA conformant", and we should definitely not mandate AAA conformance. Instead, I suggest the end-user needs should be assessed and targeted. There is no point in making an application (such as an image editor tool) screen-reader friendly if it is reasonable (supported by evidence) to assume there is little to no demand for it; it is just extract cost and complexity. I have not seen figures to support my assumption but, I think it is fair to assume (especially as each conformance level of WCAG builds on the previous) that each A of conformance is something in the order of a magnitude (x10) greater in cost, which is just one of the reasons AAA should off the table and AA+ should be managed with care.
Finally on the topic of "semantic HTML elements", don't forget other elements like:
and others. Check out MDN. Using semantic (HTML) markup goes a long way to aiding A11y.
Regards, Tracy
Hey Trancy,
thanks for your comment 🙏
your mentioned points are correct. However, there is one crucial thing in which we should expand our awareness. Yes mostly the acceptance criteria say there will be no users with restrictions (business or personal). However, this is also because from the beginning these groups of people are excluded. If I do not consider you as a person for my app from the beginning, you also never have the possibility to be a user or may be.
Can we as developers prevent this all? No, but we can do some things to create a more accessible web and consider or implement small things, even if it is not required.
Peace ✌️
Hey, the post is really great and up to the mark for modern web development.
Also, in the first point u mentioned using
But, align attribute is also deprecated, it's better to use CSS property
text-align: centerHi,
sorry for this. You are completely right 🫶
That's awesome
"our 🏳️🌈 web"