Skip to content

Commit cc4b783

Browse files
correct formatting errors, missing link
1 parent 63297ac commit cc4b783

File tree

1 file changed

+13
-9
lines changed
  • content/blog/entries/2025-10-06-refactoring-the-cc-chooser-pt-2

1 file changed

+13
-9
lines changed

content/blog/entries/2025-10-06-refactoring-the-cc-chooser-pt-2/contents.lr

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -103,7 +103,8 @@ Everything else can be assumed to be unknown (non matching).
103103
This gives us a starting point to set up a simple state machine, and check
104104
against routinely at specific events and provide recommendations and/or update
105105
the interface.
106-
Reducing the JavaScript footprint and overhead
106+
107+
## Reducing the JavaScript footprint and overhead
107108

108109
Once we no longer needed a complex state management engine because we only have
109110
14 possible correct “states” we’d like to handle, we could move away from
@@ -139,7 +140,8 @@ The state paths and smaller footprint means that we are left with a minimal
139140
amount of logic required to alter the visual state of the UX, and to allow a
140141
user to move through the stepper, the attribution fields, and the various
141142
marking formats and their individual functionalities.
142-
Embrace native support and semantics
143+
144+
## Embrace native support and semantics
143145

144146
As the decision stepper is the main interaction element, the new markup was
145147
first built from there, setting up a semantic form, grouped into fieldsets, and
@@ -158,7 +160,7 @@ from which more robust Web Components could be utilized later if such a need
158160
arose, giving us a stable path of complexity to follow down the line.
159161

160162
We also opted to avoid the use of popup modals and tabs, and instead leaned on
161-
`<summary>/<details>` elements instead to accomplish similar behavior without
163+
`<summary>`/`<details>` elements instead to accomplish similar behavior without
162164
the
163165
need for JS based behavior. Once again keeping our JS footprint much smaller.
164166

@@ -182,13 +184,13 @@ recommendation much more quickly. This change also lets us remove the
182184
“Reset” button as well, since moving backwards through the fieldsets will
183185
reset lower fieldset values automatically. We also get a boost in accessibility
184186
with its removal, since it’s not advised as a solid use case within
185-
accessible interfaces, due to it being too easily clicked.
187+
accessible interfaces, [due to it being too easily clicked][reset-accessibility].
186188

187-
“The Web would be a happier place if virtually all Reset buttons were
188-
removed. This button almost never helps users, but often hurts them.” (Reset
189-
and Cancel Buttons - NN/G)
189+
> “The Web would be a happier place if virtually all Reset buttons were
190+
removed. This button almost never helps users, but often hurts them.” ([Reset
191+
and Cancel Buttons - NN/G][reset-accessibility])
190192

191-
We also removed the final Done button and its adjacent shaking behavior. The
193+
We also removed the final "Done" button and its adjacent shaking behavior. The
192194
“Done” button had an erroneous purpose, since the recommendation was
193195
already available on the right, and it was unclear why the “Done” button
194196
would be necessary to reach a final UX state.
@@ -227,7 +229,8 @@ We also leaned more on the “Need Help?” section to provide deeper
227229
explanations rather than adding more information in other areas. This
228230
section’s newer placement lets it serve as a way to drill down further,
229231
without having to increase the density of information in the fieldsets.
230-
Better related UX element binding and separation
232+
233+
### Better related UX element binding and separation
231234

232235
Despite being a rather simple interface the Chooser offers several overlapping
233236
use cases, and as such we tried to find subtle ways to bind distinct areas of
@@ -283,4 +286,5 @@ what directions we hope to grow it.
283286
[chooser-refactor-part1]: /blog/entries/2025-07-11-refactoring-the-cc-chooser-pt-1/
284287
[neptune-earth]: https://www.space.com/41-neptune-the-other-blue-planet-in-our-solar-system.html#:~:text=Neptune%20is%20the%20eighth%20and,Earth's%20volume%2C%20according%20to%20NASA.
285288
[open-verse]: https://openverse.org/
289+
[reset-accessibility]: https://www.nngroup.com/articles/reset-and-cancel-buttons/
286290
[scc-tool]: https://github.com/boyter/scc

0 commit comments

Comments
 (0)