HTML5 semantic elements

HTML5 offers some new elements, primarily for semantic purposes. The elements include: section, article, aside, header, footer, nav, figure, figcaption, time, mark & main.

Spec https://html.spec.whatwg.org/multipage/semantics.html#sections
Status WHATWG Living Standard
IE Edge Firefox Chrome Safari Opera
      98    
    95 97    
    94 96 TP  
11 (2) 95 93 95 15 80
10 (2) 94 92 94 14.1 79
9 (2) 93 91 93 14 78
8 92 90 92 13.1 77
Show all
7 91 89 91 13 76
6 90 88 90 12.1 75
5.5 89 87 89 12 74
  88 86 88 11.1 73
  87 85 87 11 72
  86 84 86 10.1 71
  85 83 85 10 70
  84 82 84 9.1 69
  83 81 83 9 68
  81 80 81 8 67
  80 79 80 7.1 66
  79 78 79 7 65
  18 77 78 6.1 64
  17 76 77 6 (2) 63
  16 75 76 5.1 (2) 62
  15 74 75 5 (2) 60
  14 73 74 4 (1) 58
  13 72 73 3.2 (1) 57
  12 71 72 3.1 (1) 56
    70 71   55
    69 70   54
    68 69   53
    67 68   52
    66 67   51
    65 66   50
    64 65   49
    63 64   48
    62 63   47
    61 62   46
    60 61   45
    59 60   44
    58 59   43
    57 58   42
    56 57   41
    55 56   40
    54 55   39
    53 54   38
    52 53   37
    51 52   36
    50 51   35
    49 50   34
    48 49   33
    47 48   32
    46 47   31
    45 46   30
    44 45   29
    43 44   28
    42 43   27
    41 42   26
    40 41   25
    39 40   24
    38 39   23
    37 38   22
    36 37   21
    35 36   20
    34 35   19
    33 34   18
    32 33   17
    31 32   16
    30 31   15
    29 30   12.1 (2)
    28 29   12 (2)
    27 28   11.6 (2)
    26 27   11.5 (2)
    25 26   11.1 (2)
    24 25 (2)   11 (1)
    23 24 (2)   10.6 (1)
    22 23 (2)   10.5 (1)
    21 22 (2)   10.0-10.1 (1)
    20 (2) 21 (2)   9.5-9.6 (1)
    19 (2) 20 (2)   9 (1)
    18 (2) 19 (2)    
    17 (2) 18 (2)    
    16 (2) 17 (2)    
    15 (2) 16 (2)    
    14 (2) 15 (2)    
    13 (2) 14 (2)    
    12 (2) 13 (2)    
    11 (2) 12 (2)    
    10 (2) 11 (2)    
    9 (2) 10 (2)    
    8 (2) 9 (2)    
    7 (2) 8 (2)    
    6 (2) 7 (2)    
    5 (2) 6 (2)    
    4 (2) 5 (1)    
    3.6 (1) 4 (1)    
    3.5 (1)      
    3 (1)      
    2      
Safari on iOS Opera Mini Android Browser Blackberry Browser Opera Mobile Android Chrome Android Firefox IE Mobile Android UC Browser Samsung Internet QQ Browser Baidu Browser KaiOS Browser
15 all (1) 94 10 (2) 64 94 92 11 (2) 12.12 15.0 10.4 7.12 2.5
14.5-14.8   4.4.3-4.4.4 7 (2) 12.1 (2)     10 (2)   14.0      
14.0-14.4   4.4   12 (2)         13.0      
13.4-13.7   4.2-4.3 (2)   11.5 (2)         12.0      
Show all
13.3   4.1 (2)   11.1 (2)         11.1-11.2      
13.2   4 (2)   11 (2)         10.1      
13.0-13.1   3 (2)   10 (1)         9.2      
12.2-12.5   2.3 (2)             8.2      
12.0-12.1   2.2 (2)             7.2-7.4      
11.3-11.4   2.1 (1)             6.2-6.4      
11.0-11.2                 5.0-5.4      
10.3                 4      
10.0-10.2                        
9.3                        
9.0-9.2                        
8.1-8.4                        
8                        
7.0-7.1                        
6.0-6.1 (2)                        
5.0-5.1 (2)                        
4.2-4.3 (2)                        
4.0-4.1 (2)                        
3.2 (1)                        

Notes

  1. Partial support refers to missing the default styling, as technically the elements are considered "unknown". This is easily taken care of by manually setting the default display value for each tag.

  2. Partial support refers to only the <main> element (added later to the spec) being "unknown", though it can still be used and styled.

Bugs

  • While the time and data elements can be used and work fine in all browsers, currently only Firefox and Edge 14+ recognize them officially as HTMLTimeElement and HTMLDataElement objects.

Resources

Data by caniuse.com
Licensed under the Creative Commons Attribution License v4.0.
https://caniuse.com/html5semantic