This is the same snippet of code directly from Apple's site.
<divid="hero-headline-zoom"data-component-list="HeroTextZoom"><h1id="hero-headline"data-component-list="HeroHeadline"data-focus-expression="{"expression": "t - 100vh"}"class="hero-headline typography-experience-hero-headline">iPad Pro</h1><divid="hero-headline-gradient"></div><h2id="hero-subhead"class=" typography-experience-hero-subhead"data-focus-expression="{"expression": "t - 100vh"}"data-component-list="HeroSubHeadline">Supercharged by the Apple M1 chip.</h2></div>
Here is the snippet from the homepage, which the h2 is correct in.
<divclass="unit-copy-wrapper"><h2class="headline">iPad Pro</h2><h3class="subhead"role="presentation">Supercharged by the Apple M1 chip.</h3><divclass="cta-links"><aclass="icon icon-after icon-chevronright"href="/ipad-pro/"target="_self"rel="follow"data-analytics-region="learn more"data-analytics-title="Learn more about iPad Pro"aria-label="Learn more about iPad Pro">Learn more</a><aclass="icon icon-after icon-chevronright"href="/us/shop/goto/ipad_pro/select"target="_self"rel="follow"data-analytics-region="buy"data-analytics-title="Buy iPad Pro"aria-label="Buy iPad Pro">Buy</a></div></div>
This is semantically correct, so while your example is technically correct for a page with multiple headings, it does not appear that way in your image. It seems that this is the page view, where there should be an h1 at that level. Your post isn't incorrect, it's just most of it was based on the circumstance you use it in.
I told about approach that will help people to improve interfaces. Yes, if we consider snippet from Apple website role="presentation" helps. But it's a hack.
True, it's probably not bad practice after you explained it's from the home page. The other problem I saw was saying don't use grid with space between. Like I said before that is completely situational and using that is completely fine. I think it's more the wording and how the first example is taken out of context.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
This is the same snippet of code directly from Apple's site.
Here is the snippet from the homepage, which the h2 is correct in.
This is semantically correct, so while your example is technically correct for a page with multiple headings, it does not appear that way in your image. It seems that this is the page view, where there should be an h1 at that level. Your post isn't incorrect, it's just most of it was based on the circumstance you use it in.
I told about approach that will help people to improve interfaces. Yes, if we consider snippet from Apple website role="presentation" helps. But it's a hack.
ARIA in HTML spec tells "Don't override default roles" w3.org/TR/html-aria/#don-t-overrid...
You told I wrote a bad practice but I don't understand where you found that.
True, it's probably not bad practice after you explained it's from the home page. The other problem I saw was saying don't use grid with space between. Like I said before that is completely situational and using that is completely fine. I think it's more the wording and how the first example is taken out of context.