Recently, I created a complex liquid slider that serves as the header for my website. This slider contains various important content elements like heading tags (h-tags), paragraph tags (p-tags), and images. I found myself pondering whether each individual slide within the slider could be considered an article on its own. Unsure of the correct answer, I turned to seek assistance from others. My main concern is whether my code is properly nested and adheres to the use of Semantic Elements.
<header id="masthead" class="site-header" role="banner">
<div id="main-slider" class="liquid-slider">
<article id="slider-1" class="liquid-slide-wrapper" style="background: url(images/back-99.jpg) 50% 50% /cover; repeat:no-repeat; min-height:450px;">
<section class="section-text-left">
<header>
<h1 class="title" style=" color:#f7740a; display:none;">Do You Need a Professional, Affordable Website?</h2>
<h2 style=" color:#fff; display:none;">Want to Customize Your Website Yourself?</h3>
</header>
<p style="display:none; color:#fff;">Our unique websites come with a Wordpress CMS system which allows you to make changes easily! Take control and contact us for more information today!
</p>
<p style="display:none;"><button type="button" class="btn btn-primary btn-lg">Email Us</button> <button type="button" class="btn btn-transparent btn-lg">0494 / 77 22 61</button></p>
</section>
<section class="section-img-right clearfix">
<img class="slider-img-right fadeInRight animated" style="display:none; width:100%; max-width:692px; height:auto;" src="images/imac.png" />
<img class="slider-img-right fadeIn animated-slow" style="display:none; width:100%; max-width:692px; height:auto;" src="images/straf-webdesign.png" />
<img class="slider-img-right fadeIn animated-slow" style="display:none; width:100%; max-width:692px; height:auto;" src="images/responsive-webdesign.png" />
</section>
</article>
<article id="slider-2" style="background: url(images/background-7.png) 50% 50% /cover; repeat:no-repeat; min-height:450px;">
<section class="section-text-left">
<header>
<h1 class="title" style=" color:#f7740a; display:none;">JustOnWeb Becomes Kudu Concepts!</h2>
<h2 style="display:none; color:#000;">A Fresh Start with a More Professional Approach!</h3>
<header>
<p style="display:none; color:#fff;">Building a website involves more than just design. With Kudu Concepts, we take it further by creating a complete philosophy for your website and combining it with our expertise in Online Marketing!
</p>
</section>
</article>
</div>
</header>