CreateaFreeWebsite  with Responsive Web Design

General

 

9 Step Tutor

Article Element in HTML5

The article element was introduced in HTML5 to help produce better page structure in HTML documents for those authors who require heavy editing features.

The code: <article></article>

Represents an independent piece of content of a document, such as a blog entry ,newspaper article, forum post, a magazine article, a user-submitted comment, an interactive widget or gadget, or any other independent item of content.

The article element can enclose headers, sections, footers and other document structure tags, as well as other articles.

Example of code:

<body>
<article>
<style>
Define style for enclosed elements
</style>
<header>
<hgroup>
<h1>Article Title</h1>
</hgroup>
<p>A slogan or something related</p>
</header>
<section class="general">
<h2>Title of Section</h2>
<p>related information about section.</p>
</section>
<section class="appendix">
<h2>Title of Appendix</h2>
<p>Appendix information.</p>
</section>
<footer>
footer information
</footer>
</article>
</body>

 

*Use of the new elements article, section, header, footer, hgroup, nav and aside is a matter of the taste or the need of the author.

 

The article element accepts Global Attributes.

Note: Some of these new elements overlap in purpose.

For a complete list of New HTML5 Elements visit W3schools

 

Free Tools and Resources We Recommend

Free Responsive Web Design Certification freeCodeCamp
freeCodeCamp is a proven path to your first software developer job.
More than 40,000 people have gotten developer jobs after completing this – including at big companies like Google and Microsoft.
Finally, you'll learn how to make webpages that respond to different screen sizes by building a Twitter card with Flexbox, and a complex blog layout with CSS Grid.
FREE Certification Courses!!
Free Ebook How to Code in HTML5 and CSS3
"How to Code in HTML5 and CSS3" is a free e-book about making websites in HTML5 and CSS for absolute beginners. It doesn't require any experience in IT to start....
FREE HTML Editor (Windows): NoteTab Light
All the features of a commercial HTML editor.
FREE Apache Server (Windows): IndigoAmpp
Set up a real time server environment right on your PC. Test forms and scripts before uploading to your web space.
Linux Users
If like us, you've left the insane world of Microsoft Windows for the even worse experience of Linux, we recommend the BlueFish HTML editor. You'll find it in your software repository. It does have some QUIRKS, but it's FREE.
For image resizing we've found the easiest Linux tool to be Krita.

Have you tried our FREE RWD template kit? Download Template #402 - 6 Page Kit