最近、Codepenの作業セクションを更新しました。ほら、「ビュー」とラベル付けしたこのようなドロップダウンメニューがありました。
これにより、以下を見ていたペンをスコープダウンすることができました（グリッドまたはリストビュー）。シングル そのような要素は少し厄介に感じ始めました。特に、何かを追加した場合は、アルファテスターの一時的な「2.0ペン」オプションをご覧ください。フォークでもあるテンプレートペンを見たい場合はどうなりますか？またはあなたがプライベートにしたフォーク？またはあなたのプライベート2.0ペン？ 1回のドロップダウンではそれが不可能でした。
だから私たちはこれをしました：
これにより、見たいものについてのすべての選択肢が、独立して設定した個々のオプションになります。デフォルトのいずれも変更しませんでした。これで、任意のフィルターを組み合わせることができ、さらにはタグによるフィルタリングを組み合わせることができます。うまくいけば、これにより、自分の仕事にドリルダウンし、必要なものを簡単に見つけることができます。
私たちの観点からは、この種のことのために内部APIをクリーンアップするのに役立ちました。
私たちは覚えています（同様に使用します localStorage）最後に設定したフィルター。ただし、フィルターを選択するときにURLを更新するため、特定のフィルターとURLをブックマークまたは共有できます。例えば：
https://codepen.io/your-work?access=public&fork=true&template=trueしかし、 localStorage あなたがしないようにそれを作ります 持っている URLパラメーションを設定するために、覚えておくようにします。ここまでは順調ですね！
そこにURLパラメーターを選択したことに注意してください。それは常に、URLのパスの一部であるべきものと、クエリパラメーター（または時々ハッシュ）に追いやられるべきものの微細なラインです。これは（私はパーティーで楽しいです）私にとって際限なく魅力的です。
このような：
https://codepen.io/your-work?fork=trueできた なれ：
https://codepen.io/your-work/forks特定の素晴らしい特性があります。あなたはそれがきれいに見えると主張することができます。あなたはそれが意味を持つ階層を設定していると言うことができます、つまりあなたはあなたを意味します forks/private プライベートであるフォークされたペンを意味する可能性があります。しかし、階層がそこに重要です…実際には、それらがどの順序で入るかは重要ではありません。 private/forks 同じことを意味するので、それは実際には階層ではありません。 URLパラマ ?fork=true&access=private。
また、URLパラメーションは、新しいパスを作成する方法で、特定のURL形式に永久にロックしません。
私たちは、あなたのユーザープロファイルに至るまで、ずっと前に別の選択をしました。例えば：
https://codepen.io/chriscoyier/pens/publicそこに、「ペン」と「パブリック」はURLパラメーションだったかもしれませんが、どういうわけか、物事がパスの一部であることがより良いと感じました。 /pens/ そこにはまだ階層的な意味があります。私はそのようなパターンを促進するRuby on Railsアプリとしてのルーツのために、私はその決定を下したでしょうが。
私たちがURLデザインの賞を受賞することはわかりませんが、それが私たちの長年の存在に対して私たちにあまり悲しみを引き起こしていないという事実は、私たちが大丈夫だという証です。私たちがもっと良くすることができたかもしれないということを考えることができるいくつかのことがあります。時々、私はように使用するアプリに嫉妬しています /u/username パスの「ルート」を意味するプロファイルの場合、すべてのユーザー名ではなく、内部URLのユーザー名をブラックリストする必要はありませんが、最初に認めなければならないユーザー名でURLの外観が好きです。また、私たちのURLは持っています /pen/ それらでは本当に「編集者」を意味し、さまざまなビューがそれに取って代わります /full/ ページビューを意味します…しかし、それはまだペンなので、私は100％愛されたことがありません。そのペンのもののいくつかは、Codepenの新しいバージョンに向かって移動するとクリーンになります。
ジム・ニールセンと一緒に残します 優れたURLデザインの例、楽しみのために。
Be the first to comment
