198 private links
→ Remember: if your user is supposed to go somewhere, use an <a> element. If something with JavaScript needs to happen, use a <button> element.
I agree with that: link for navigation and button to trigger actions.
About the onclick attribute and the event variable: onclick="submit(event)" works. But why ?
The spec shows that the string passed to a handler is combined like this:
function $name (event) { $body }
I'm not sure what $name is but $body is the string passed to the handler attribute in HTML. event is an argument. This string becomes a function through the Function constructor I'm assuming.
enterkeyhintcite(reference an URL to an<q>,<blockquote>,<del>,<ins>) anddatetime- attributes for custom ordered lists: reversed, start, type, value
downloadattribute for<a>that has a value for the suggested file namedecodingattribute for the<img>element: sync or async the decoding of a picture.
- trigonometric functions
- new viewport unites
- :focus-visible
- scroll-behavior can be smooth :)
- lazyloading images by default with an attribute
array.prototype.atsupports negative integers
Putting ️ disable the previous emoji and render it as character
︎ renders it as an emoji
It is possible to activate/deactivate a class with node.classList.toggle('className', true/false)
The example provided about forms is impressive ! HTML and CSS are so much powerful ! I think I will use them more in vue and svelte :)
There is a <template> tag in HTML 5.
The componentization is still to be done though. I always forgot how HTML5 and CSS are powerful nowadays.
I bookmark this post especially for this code snippet:
body {
margin: 0 auto;
max-width: 40rem; // can be bigger but not too much ! (<= 80 I think)
font-size: 1.2rem;
}It makes a HTML website directly readable :)
THE HTML standard.
Reading it from time to time can only help to become a better web developer.
loading=lazyattribute to defer the loading of the image until the user scrolls to them<datalist>element to create native HTML autocomplete- Email, call and SMS links
- Ordered lists
startattribute to change the starting point of an ordered list. <input type="reset" />to get a clear button for the forms<meter>element to display quantitieswindow.openerreturns the original page of atarget="_blank". This can have security and performance implications. Includerel="noopener"orrel="noreferrer"to prevent this.<base target="_blank">in the<head>to open all links in the document in a new tab.- Favicon cache busting by adding a
?v=2to the link of the favicon <details><summary>Summary</summary><p>Details</p></details>downloadattribute to a link download the file instead of navigating to it- Use the
webpimage format to boost performance - Use the
posterattribute to specify an image to be shown while the video is downloading, or until the user hits the play button - Use the
spellcheckattribute to define whether the element may be checked for spelling errors.
👍
10 exemples de balises HTML sous-utilisées !
Comment créer un simple Web Component ?
HTML is too often forgotten in this case
❤️
About CSS
You are the visual translation of information. What good is all the information in the world if we can’t easily understand it? You hold the keys to hierarchy and contrast and layout, the keys to visual communication.
Underestimated tag !
It is easy to build on top of it to have a nice dropdown element, etc...
Oh shit ! Using HTML instead of a lot of Javascript. Need to be tested.
with Wkhtmltopdf : https://wkhtmltopdf.org/