@@ -24,18 +24,24 @@ include ../_util-fns
24
24
as it has eleven letters, starts with an `a` and ends with a `y`, we shorten this word to `a11y`. We will
25
25
refer to `a11y` when we actually want to say `accessibility`.
26
26
27
- In short, `a11y` refers to creating web applications that everyone can use. Thus making it accessible to everyone.
27
+ .l-sub-section
28
+ :marked
29
+ In short, `a11y` refers to creating web applications that everyone can use. Thus making it accessible to everyone.
28
30
31
+ :marked
29
32
If you are totally new to the term you may want to have a look at what the folks at the `W3C` have to say about
30
33
[a11y](https://www.w3.org/WAI/intro/accessibility.php), to put the rest of the article into perspective.
31
34
32
35
But what is that other word?
33
36
34
- `ARIA`, or `Accessible Rich Internet Applications` refers to bringing `a11y` concepts into
35
- internet applications like those we are building with Angular 2. You can also see what they say about
36
- [ARIA](https://www.w3.org/WAI/intro/aria) at the `W3C`.
37
+ .l-sub-section
38
+ :marked
39
+ `ARIA`, or `Accessible Rich Internet Applications` refers to bringing `a11y` concepts into
40
+ internet applications like those we are building with Angular 2.
37
41
38
- We will be right here waiting for you when you come back.
42
+ :marked
43
+ You can also see what they say about [ARIA](https://www.w3.org/WAI/intro/aria) at the `W3C`. We will be right here
44
+ waiting for you when you come back.
39
45
40
46
.l-main-section
41
47
:marked
@@ -50,12 +56,21 @@ include ../_util-fns
50
56
51
57
We would like to suggest the following rule of thumb when building your applications:
52
58
53
- >If there is already a standard element inside `HTML` providing the function that you are trying to build, use
54
- that element instead of writing your own.
59
+ .l-sub-section
60
+ :marked
61
+ If there is already a standard element inside `HTML` providing the function that you need, use
62
+ that element instead of writing your own.
55
63
64
+ :marked
56
65
So, for example, if you want to accept user text input, use the `INPUT` element instead of contructing something new.
57
- And when you do write new components, use the standard `HTML` elements in your templates as often as possible.
58
66
67
+ And within component template the second rule of thumb is:
68
+
69
+ .l-sub-section
70
+ :marked
71
+ Use standard `HTML` elements to construct your component templates as far as possible.
72
+
73
+ :marked
59
74
This way you have to think less about things like focus management, tabindex, etc. and have more time to think about
60
75
your code.
61
76
0 commit comments