サイトについて
「うぇぶ、ひゃっくり」のコンセプト
「うぇぶ、ひゃっくり」は、「わかりやすく伝える」ことを、Webデザインと子ども向けプログラミングの両方から考えるサイトです。画面で伝える工夫は、実在するWebサイトを1つずつ分析する「Webサイト100選」で、教える場で伝える工夫は、子ども向けプログラミング教室で教えて気づいたことからまとめています。
このサイトの内容
このサイトでは、Webサイトを「なんとなく見る」のではなく、
「なぜ伝わるのか」「なぜ使いやすいのか」「どう作られているのか」を分析しながら記録しています。
気づいたことを言葉にし、実際に作って試しながら理解を深めることを大切にしています。
こんな人に読んでほしい
- Webデザインを学び始めて、「いいデザイン」を言葉にできるようになりたい人
- 参考にしたいサイトの、どこをまねすればいいか知りたい人
- 子どもにプログラミングを教えている人、これから習わせたい保護者の人
サイト名「うぇぶ、ひゃっくり」に込めた意味
ひゃっくり(しゃっくり)
一度気になると止まらない探究心を表しています。
良いデザインを見ると、「なぜこうなっているんだろう?」と分析したくなる感覚を表現しています。
ひゃく(百)
「100事例分析」を目標に、学びを積み重ねていく姿勢を意味しています。
くり(栗)
栗はこのサイトのモチーフです。小さな積み重ねを大切にしながら成長していく姿勢を表しています。

このサイトで発信している内容
このサイトの柱は2つです。
柱1 Webデザイン(画面で伝える工夫)
- Webデザイン分析(Webサイト100選)…実在するサイトの色・余白・情報の並べ方を分析
- 学習ログ・参考書…Webデザインやプログラミングの勉強の記録
- 制作記録…Web制作やWordPressテーマ(サイトの見た目を決めるひな形)づくり
- AI活用…AIを使って作業を早くする工夫
柱2 子ども向けプログラミング(教える場で伝える工夫)
- Scratch(スクラッチ)やマイクラなどを使った、子どもへの教え方
- プログラミング教室で見た子どもの変化
- 心理学や歴史をもとに、子どもの学び方を考えたこと
サイト制作へのこだわり
このサイトは、配布されているテーマ(見た目のひな形)を使わず、WordPressのテーマを自分で作りながら運営しています。
デザインだけでなく、情報の伝わりやすさ・使いやすさ・更新しやすさも意識しながら改善しています。
カテゴリ紹介
「うぇぶ、ひゃっくり」では、Web制作や学習の過程をカテゴリごとに整理して発信しています。
Webデザイン分析

実際のWebサイトを見ながら「なぜ伝わるのか」「なぜ使いやすいのか」を分析しています。
使いやすさ・色・余白・配置・動きなどを観察し、
“なんとなく良い”を言葉にして学ぶカテゴリです。
学習ログ(過程・試行錯誤の記録)

学んでいる最中の気づきやつまずき、試行錯誤の過程をリアルタイムで記録するカテゴリです。
Web制作やコーディング学習の進捗をまとめています。中は「Webデザイン」「プログラミング」「参考書」の3つに分かれています。
参考書(学習ログの中)
Webデザインやプログラミングを学ぶときに読んだ本や、自分に合う本の選び方をまとめる、学習ログの中のカテゴリです。
図解の多い本が合った経験や、図書館で読み切れる本を見つけるコツなどを紹介しています。
AI活用ログ

AIを使ったWeb制作や、勉強を早く進める工夫、コード(サイトを作るための命令文)の直し方などを、実際に試したうえで記録しています。
制作記録

Webサイト制作やWordPressテーマづくり、画面の使いやすさの改善、作るときのメモなどを記録しています。 「作る過程」も含めて共有することで、実践的な学びにつながる内容を目指しています。
学んだこと(体験を通した気づき)

学習ログが「過程」の記録であるのに対し、こちらは実際にやってみて得た気づきや体験を、自分の言葉でまとめるカテゴリです。
成功したことだけでなく、つまずいた経験も含めて、初心者にも伝わりやすい形で整理しています。プログラミング教室で子どもに教えたときや、Webデザインの勉強で、「伝わった」「伝わらなかった」と感じた体験を中心にまとめています。
考えごと

「どうしたら子どもに伝わるか」「どうしたら学びが続くか」を、プログラミング教室で教える経験や毎日の体験から考えたことをまとめています。心理学の考え方や歴史を手がかりにした記事もあります。
運営者について