いいウェブサイト

産業的、工業製品な意味で「いい」

これらが満たされていれば完成度が高いと感じられるが、本やチュートリアルにはやり方が載っていない

環境の変化によって動かなくなったり、ベストプラクティスでなかったりする

粒度が細か過ぎて言及しにくい

しかしもうほぼ答えは出ているのだから簡単に実装可能になって欲しい

うまく再利用可能な形にもっていきたい

自分用のsnippetやlibraryを作る

メンテナンスが重要

今ならReactのコンポーネント?

いい開発者はやってる

これらが最初から設定されている環境を作りたい

アクセシビリティが高い

正しく構造化されマークアップされている

キーボードで操作できる

余白に一貫性がある

文字サイズに一貫性がある

読み込み時にちらつかない(Flash of Unstyled Content = FOUC)

表示されるまで描画を待つ

フェードインアウトを入れる

ページ切り替えに唐突感がない

外部サービスを埋め込んだ時にいかにうまく制御するか

読み込み時にフィードバックがある

インタラクションにフィードバックがある

余計なスクロールバーが出ない

モーダルウィンドウが出た時に下のレイヤーを止める

URLなどの文字がはみ出さない

faviconがある

apple touch icon、Androidのカラー

OGPが設定されている

スマートフォンのポートレイトでもランドスケープでも問題ない

ウィンドウサイズを変えても変な崩れ方をしない

文字サイズ(ズーム)を変えても崩れない

画像を幅100%にした場合、max-widthをつけておかないとズームアウトしても小さくならない

やりすぎ

やりすぎはやりすぎの面白さがあるのは前提として、基本的にはアーキテクチャやブラウザの実装に沿うのが美と考える

毎回アニメーションする

ポインタが独自で動きが遅い

クリック判定する位置が気持ち悪い

スクロールジャックなどユーザーの操作を制限する

ブラウザネイティブの機能を再実装するようなこと

別の視点

いわゆるウェブサイトを想定すると上記のような考えになるが、ブラウザといういろんなものが実行できる環境と考えると、また面白さや良さは変わってくる