01#Developmentブラウザーから理解する、ウェブ開発の参考書棚基礎、テーマ別の講座、互換性、アクセシビリティ。小さなプロジェクトでつなげる四つの資料。
フレームワークが便利でも、ページの動作を決めるのはブラウザーです。HTML、CSS、JavaScript、アクセシビリティの基礎があれば、初めての道具も理解しやすくなります。観察し、変更し、安全に壊せる小さなプロジェクトと一緒に使える資料を集めました。
まず試してみること
見出し、フォーム、リストのあるページを作ってみましょう。MDNで基本の動作を学び、web.devで必要なテーマを深め、新しい機能には互換性を確認します。装飾を増やす前にキーボードだけで操作してみてください。
覚えておきたいこと
問題を解いた文書の正確なURLと、何を変えたかを一緒に保存しましょう。いつか終えたい講座の一覧ではなく、役立つ作業ノートになります。4 linki12 wpisów
デジタルの仕事を、基礎から仕上げまで
ブラウザーとHTTPの基礎から、CSSとアクセシブルなデザインへ。集中、テキスト、画像、文書の仕上げを助ける道具まで順にたどります。
- 01#Developmentブラウザーから理解する、ウェブ開発の参考書棚基礎、テーマ別の講座、互換性、アクセシビリティ。小さなプロジェクトでつなげる四つの資料。
フレームワークが便利でも、ページの動作を決めるのはブラウザーです。HTML、CSS、JavaScript、アクセシビリティの基礎があれば、初めての道具も理解しやすくなります。観察し、変更し、安全に壊せる小さなプロジェクトと一緒に使える資料を集めました。
まず試してみること
見出し、フォーム、リストのあるページを作ってみましょう。MDNで基本の動作を学び、web.devで必要なテーマを深め、新しい機能には互換性を確認します。装飾を増やす前にキーボードだけで操作してみてください。
覚えておきたいこと
問題を解いた文書の正確なURLと、何を変えたかを一緒に保存しましょう。いつか終えたい講座の一覧ではなく、役立つ作業ノートになります。4 linki
02#Developmentフレームワークを疑う前に、HTTPのやり取りを一つ読むブラウザーが送りサーバーが返すものを、解説、参考資料、リクエスト確認サービスで調べる案内です。3 linki
03#Developmentきれいな見本の外でも崩れにくいCSSレイアウトレイアウトの制約、柔軟なサイズ、実際の内容で現れる問題を考えるための四つのCSS資料です。4 linki
04#Development遅いページを説明できるようにするデバッグ作業台「遅く感じる」を再現できる観察と次の行動に変える、ブラウザーの文書と性能の参考資料です。4 linki
05#Designデザインの判断に、説明できる理由を添える使いやすさの研究、アクセシビリティ、操作の原則、タイポグラフィ。見た目の参考から一歩進む四つの資料。
美しい画面は結果を見せてくれますが、なぜ機能するかまでは教えてくれません。レビューが好みの競争になったときには、判断を話し合える資料が役立ちます。利用者の行動から、アクセス、操作、読みやすさへと進む四つの入口を選びました。
まず試してみること
実際の画面を一つ選び、問いを一つ決めましょう。操作を見つけられるか、キーボードで使えるか、文章を楽に読めるか。資料から一つの変更を提案し、想定する人と端末で確かめてみてください。
覚えておきたいこと
原則は調べ始めるための手がかりです。名前のある法則が課題の理解を代わることはなく、チェックリストを満たすだけで全員が使える製品になるわけでもありません。4 linki
06#Designデザインシステムで、形より判断の理由を読む部品を美しい見本ではなく、内容、動作、アクセシビリティの判断として読むための四つの公開資料です。4 linki
07#Design書体名ではなく、実際の文章で組版を判断する実用的な指針、文字サイズの道具、画面向け書体、実例のアーカイブを行き来して読み心地を比べます。4 linki
08#Designパレットではなく、実際の画面で色の対比を確かめる文字と画面の色を、パレットの見本だけで判断しないためのコントラスト確認ツールです。3 linki
09#Productivity集中したい仕事のための、小さな道具箱タイマー、スケッチ、オフィス、ノート。役割の異なる四つの道具から、今必要な一つを選ぶ。
新しい生産性の仕組みを覚えることが、仕事以上に注意を奪うこともあります。このリストでは役割を分けました。時間を確保し、考えを描き、文書を作り、次に戻るためのメモを残す。四つすべてを取り入れる必要はありません。
まず試してみること
仕事が止まっている箇所を一つ選びましょう。始めにくければ短く時間を区切り、考えが絡まっていれば描いてみます。成果物が明確なら文書を開いて始めましょう。終わるときには、また見る場所に次の具体的な行動を書き残します。
覚えておきたいこと
まずは機密性のない資料で試してください。大切な作業に使う前に、保存場所、共有、書き出し、同期の設定を確認しましょう。画面の見た目だけではデータの保管場所は分かりません。4 linki
10#Productivity形の合わないテキストとJSONのための小さな作業台構造化された文章を調べ、繰り返せる変換を適用し、別の場所で使う前に結果を確認する三つの道具です。3 linki
11#Productivityウェブに載せる画像一枚を整える小さな作業台元画像の編集、圧縮の比較、SVGの整理、短いアニメーションの確認を役割別に分けた道具集です。4 linki
12#Productivity文書を送る直前に、もう一度確かめる小さな道具PDFの組み立て、文章の比較、推敲を通して、相手が実際に受け取るファイルを確認する作業案内です。4 linki
