Best HTML5 markup for sidebar

First of all ASIDE is to be used only to denote related content to main content, not for a generic sidebar. Second, one aside for each sidebar only

You will have only one aside for each sidebar. Elements of a sidebar are divs or sections inside a aside.

I would go with Option 1: Aside with sections

<aside id="sidebar">
    <section id="widget_1"></section>
    <section id="widget_2"></section>
    <section id="widget_3"></section>
</aside>

Here is the spec https://developer.mozilla.org/en-US/docs/Web/HTML/Element/aside

Again use section only if they have a header or footer in them, otherwise use a plain div.

Related Posts:

  1. Should I use tag for icons instead of ? [closed]
  2. How to make a monopoly board using css grid?
  3. Redirect from an HTML page
  4. How to horizontally center an element
  5. Android WebView err_unknown_url_scheme
  6. How to create an HTML button that acts like a link
  7. What is the main difference of
    and
  8. Why does z-index not work?
  9. Is it possible to write data to file using only JavaScript?
  10. Image is not showing in browser?
  11. Is it possible to write data to file using only JavaScript?
  12. Is “ ” a replacement of ” “?
  13. HTML Button : Navigate to Other Page – Different Approaches
  14. Which is better: or
  15. Adding attribute in jQuery
  16. Is element block level or inline level?
  17. XPath //div[contains(text(), ‘string’)] fails to select divs containing ‘string’
  18. Two divs side by side – Fluid display
  19. Proper way to make HTML nested list?
  20. FontAwesome icons are not showing, Why?
  21. Remove border from IFrame
  22. CSS horizontal scroll
  23. mailto using javascript
  24. Mailto using Javascript?
  25. Can I set subject/content of email using mailto:?
  26. How do I set a background-color for the width of text, not the width of the entire element, using CSS?
  27. text-overflow: ellipsis not working
  28. How to reference nested classes with css?
  29. How to save user input into a variable in HTML and JavaScript
  30. Why is there an unexplainable gap between these inline-block div elements?
  31. How to make JavaScript execute after page load?
  32. Hide element by class in pure Javascript
  33. How to align content of a div to the bottom
  34. How to draw a dotted line with css?
  35. Function not defined javascript
  36. Navigate to an anchor on another page
  37. What is gZip compression?
  38. How to stick text to the bottom of the page?
  39. How to make blinking/flashing text with CSS 3
  40. Why doesn’t height: 100% work to expand divs to the screen height?
  41. How can I position my div at the bottom of its container?
  42. AppendChild() is not a function javascript
  43. How to overlay one div over another div
  44. How can I change an element’s class with JavaScript?
  45. difference between iframe, embed and object elements
  46. Input Type URL – Says “Please enter a URL” if HTTP is not included
  47. Place input box at the center of div
  48. Can HTML checkboxes be set to readonly?
  49. Set cellpadding and cellspacing in CSS?
  50. CSS content property: is it possible to insert HTML instead of Text?
  51. How to increase height of textarea using bootstrap rows and columns
  52. Indent List in HTML and CSS
  53. What’s the difference between using NAV and DIV around Bootstrap 3 navbars?
  54. Absolute position is not working
  55. Position absolute but relative to parent
  56. How do you specify table padding in CSS? ( table, not cell padding )
  57. Two Divs next to each other, that then stack with responsive change
  58. link not working
  59. Generating a Random Number for HTML
  60. HTML Links are not working
  61. How to extract svg as file from web page
  62. Making an image act like a button
  63. Is it possible to use css to shrink text to automatically fit the size of the div
  64. HTML5 Canvas Rotate Image
  65. How can I align text directly beneath an image?
  66. HTML vs SHTML vs PHTML
  67. Change background color of iframe issue
  68. jQuery find element by data attribute value
  69. WordPress footer menu floating with height of footer
  70. Keep HTML format when switching from Visual to HTML editor
  71. Get entire page content (generated HTML in browser)
  72. Can I force WordPress to use instead of ?
  73. Will my WordPress site become vulnerable to Cross-Site Scripting (XSS) if I allow img tags in the comments area?
  74. Add HTML to single post tag
  75. WordPress “Page not found error” when I edit a page
  76. How do I put a wordpress blog into my html site?
  77. New to CMS – WP functionality. overkill or just right?
  78. how add custom tag/tool in classic editor?
  79. Attribute Quote Style in WordPress HTML
  80. Allow HTML in Settings API input field
  81. Create custom markup to use in posts?
  82. Widget Text Needs to be White [closed]
  83. Why can’t I edit HTML in WordPress even with the administrator role?
  84. Adding HTML to posts with certain tags?
  85. Adding to the WYSIWYG
  86. Redirect WP 404 to html
  87. How to remove auto generated markup? [closed]
  88. Is there a common structure for a wordpress formular?
  89. a generated wordpress page from a form that is inputted by user [closed]
  90. creates an unnecessary space in content?
  91. WordPress is replacing code with   when I add to posts
  92. Echo outside HTML
  93. Add html plugin into wordpress
  94. WBR tag breaking hyperlinks
  95. allow html characters on eshop data entry boxes
  96. Query WordPress Database and Post HTML Table
  97. theme or plugin or server is outputting html before the init hook fires, how is it possible to prevent this
  98. How to Know If I’ve Correctly Inserted Alt Attributes Into HTML
  99. WordPress HTML editor panel is not showing HTML elements
  100. HTML code not working in WordPress

Leave a Comment

© 2024 Read For Learn