commit 1008fc2a801d8654064e48470b3c1fb73dc724f4
parent 53212266cbe4e2266216b7aa9f5ddc6c64b7c818
Author: Hiltjo Posthuma <hiltjo@codemadness.org>
Date: Sun, 21 Jan 2018 20:21:06 +0100
improvements to RANTS with input from others
Diffstat:
| M | RANT_WEBTIPS | | | 53 | +++++++++++++++++++++++++++++++++-------------------- |
1 file changed, 33 insertions(+), 20 deletions(-)
diff --git a/RANT_WEBTIPS b/RANT_WEBTIPS
@@ -5,9 +5,9 @@ Below are some tips to make your site more pleasant to use, it covers only
common issues with the "front-end" of sites such as:
- Accessibility
-- Speed / bandwidth use.
- Privacy
- Security
+- Speed / bandwidth use.
Webdesign:
@@ -15,15 +15,16 @@ Webdesign:
- Use good contrast on your site.
(Light) Grey text on a white background IS NOT COOL! Most people don't have
100% correct calibrated monitors or 20/20 vision.
- - Fonts:
- - Don't use tiny or weird fonts, make sure to atleast specify default
- fallback fonts, don't force people to use your fonts!
- - Don't use external custom fonts.
- - Preferably don't use icon fonts, if you do don't overdo it and also add a
- text description if possible.
- - Don't overuse pagination on your site especially if you have not much content.
- - Make sure your navigation links are easy to find, as a good test use lynx(1)
- and try to navigate your site using the keyboard only.
+- Fonts:
+ - Don't use tiny or weird fonts, make sure to atleast specify default
+ fallback fonts, don't force people to use your fonts!
+ - Don't use external custom fonts.
+ - Preferably don't use icon fonts, if you do don't overdo it and also add a
+ text description if possible.
+- Don't overuse pagination on your site especially if you have not much content.
+- Always think of the blind. Try your site with a screenreader.
+- Make sure your navigation links are easy to find, as a good test use lynx(1)
+ and try to navigate your site using the keyboard only.
To check accessibility errors the useful site http://wave.webaim.org/ can be used.
@@ -40,6 +41,11 @@ CSS:
Javascript:
- jslint: http://www.jslint.com/
- uglifyjs: http://lisperator.net/uglifyjs/ check "Scope warnings" options.
+Browsers:
+- Test it in all common browsers (Firefox, Firefox ESR, Chrome) and some older
+ versions.
+User-Agent checking:
+- NEVER DO THIS.
Content filesize:
@@ -59,15 +65,15 @@ Content filesize:
file. This reduces the amount of requests and speeds up your page.
- Try to reduce the size of your CSS and Javascript files: don't depend on
jQuery or other bloated frameworks.
-- Don't obscure / minify your Javascript or CSS content, GZIPping text content
- is fine though. Parsing speed of Javascript and CSS is reduced by simplifying
- the content, not be minifying it!
+- Don't obscure and don't minify your Javascript or CSS content. Using GZIP
+ compression for your _textual_ content is fine though. Parsing speed of
+ Javascript and CSS is reduced by simplifying the content, not be minifying it!
Javascript use:
- Make sure your site is visible without Javascript, if you serve simple static
content site there is generally NO reason to use Javascript. As a good test
- make sure it is usable in for example lynx(1).
+ make sure it is usable in for example lynx(1) or links(1).
- Use as little Javascript as possible, preferably none.
- If Javascript is absolutely needed notify the user using the <noscript> tag
and make sure your web page "fallback gracefully".
@@ -90,7 +96,7 @@ Mobile:
mobile-friendly site via a separate space for example a subdomain such as
m.yourdomain or mobile.yourdomain.
- Don't use "hamburger" menus: try to have a functional navigation directly
- visible on your web page..
+ visible on your web page.
CSS:
@@ -101,16 +107,17 @@ CSS:
Video / audio:
- Never use DRM.
- Preferably use open (container) formats such as webm, oggv.
+- Show the link to the file for viewing it in an external viewer.
- Do not autoplay video and audio, this includes background video/audio:
extremely invasive to the user.
Flash or other proprietary plugins:
-- DON'T USE THEM!
+- NEVER USE THEM!
Websockets:
-- DON'T USE THEM!
+- NEVER USE THEM!
Cookies / localStorage:
@@ -135,6 +142,11 @@ TLS (HTTPS):
Letsencrypt: https://letsencrypt.org/
+Privacy:
+- If you are publishing for Europeans, always consider that you have to make all
+ stored data about a user available.
+ GDPR: https://en.wikipedia.org/wiki/General_Data_Protection_Regulation
+
Advertisements:
- Preferably don't use advertisements, at the very least don't serve it from an
external ad-network. Serve the ads from an url that the user can block easily
@@ -154,6 +166,7 @@ Tracking:
Maps:
- Instead of Google Maps you can use OpenStreetMap or simply a static image.
Google uses tracking in many of their applications.
+- Consider making a donation or contribution to the openstreetmap.org project.
Use of content-delivery networks (CDNs):
@@ -161,6 +174,6 @@ Use of content-delivery networks (CDNs):
Javascript from them. Cloudflare is also known to block Tor traffic. Tor is
obviously very useful for many things.
When you use a third-party CDN you effectively give away the control of
- your site and make it untrusted for all clients. Some sites use socalled
- Subresource Integrity headers, but these are just another ugly standard/hack
- in the ugly web.
+ your site and make it untrusted for all clients. Some sites use so-called
+ "Subresource Integrity headers", but these are just another ugly standard/hack
+ for the ugly web.
