diff options
Diffstat (limited to 'docs')
-rw-r--r-- | docs/index.html | 46 |
1 files changed, 46 insertions, 0 deletions
diff --git a/docs/index.html b/docs/index.html index f0282e1..cc69cbf 100644 --- a/docs/index.html +++ b/docs/index.html | |||
@@ -23,6 +23,52 @@ | |||
23 | 23 | ||
24 | <details class="post"> | 24 | <details class="post"> |
25 | <summary> | 25 | <summary> |
26 | <div class="date">30/12 2019</div> | ||
27 | <span class="post-link">Color Conundrum</span> | ||
28 | </summary> | ||
29 | <div class="post-text"> | ||
30 | <p>This piece aims to highlight (pun intended) some of the | ||
31 | reasons behind my <a href="https://files.nerdypepper.tech/bF.png">color | ||
32 | free</a> editor setup.</p> | ||
33 | |||
34 | <p>Imagine highlighting an entire book because <em>all</em> of it is | ||
35 | important. That is exactly what (most) syntax highlighting | ||
36 | does. It is difficult for the human eye to filter out noise | ||
37 | in rainbow barf. Use color to draw attention, not diverge | ||
38 | it.</p> | ||
39 | |||
40 | <p>At the same time, a book devoid of color is <em>boring!</em>. What | ||
41 | is the takeaway from this 10 line paragraph? What are the | ||
42 | technical terms used?</p> | ||
43 | |||
44 | <p>Prose and code are certainly different, but the fickle | ||
45 | minded human eye is the same. The eye constantly looks for a | ||
46 | frame of reference, a focal point. It grows tired when it | ||
47 | can’t find one.</p> | ||
48 | |||
49 | <p>The following comparison does a better job of explaining | ||
50 | (none, ample and over-the-top highlighting, from left to | ||
51 | right):</p> | ||
52 | |||
53 | <p><img src="https://files.nerdypepper.tech/lt.png" alt="hi.png" /></p> | ||
54 | |||
55 | <p>Without highlighting (far left), it is hard to differentiate | ||
56 | between comments and code! The florid color scheme (far | ||
57 | right) is no good either, it contains too many attention | ||
58 | grabbers. The center sample is a healthy balance of both. | ||
59 | Function calls and constants stand out, and repetitive | ||
60 | keywords and other noise (<code>let</code>, <code>as</code>) are mildly dimmed | ||
61 | out. Comments and non-code text (sign column, status text) | ||
62 | are dimmed further.</p> | ||
63 | |||
64 | <p>I’ll stop myself before I rant about color contrast and | ||
65 | combinations.</p> | ||
66 | <div class=separator></div> | ||
67 | </div> | ||
68 | </details> | ||
69 | |||
70 | <details class="post"> | ||
71 | <summary> | ||
26 | <div class="date">23/11 2019</div> | 72 | <div class="date">23/11 2019</div> |
27 | <span class="post-link">Static Sites With Bash</span> | 73 | <span class="post-link">Static Sites With Bash</span> |
28 | </summary> | 74 | </summary> |