「わかばちゃんと学ぶWebサイト制作の基本」をリアルわかばちゃん（初心者）が実践してみた
-
_kiwinote_
- 4493
- 28
- 3
- 1
-
- いいね！1
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
kiwinote.hateblo.jp/entry/beginner… 今日から「わかばちゃんと学ぶWebサイト制作の基本」のコーディング部分を リアルわかばちゃん（初心者）が実践し進捗をツイートしていく企画 #わかばちゃん実践日記 はじめます！ pic.twitter.com/qtTEdIqmlT
2016-07-13 17:53:40
拡大
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
#わかばちゃん実践日記 1日目、p64~67。HTMLちゃんをお迎えするための儀式（環境設定）各種。 pic.twitter.com/IOcztsVKAR
2016-07-13 18:56:45
拡大
拡大
拡大
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
#わかばちゃん実践日記 2日目、p71~80。表示確認と商品名「ストロングTシャツ」＋商品説明文を追加。画像はまだないけど、どうやらレディビアードのストロングTシャツじゃなさそうです！ pic.twitter.com/kn0k1gZEni
2016-07-14 15:58:01
拡大
拡大
拡大
拡大
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
画像は ・サンプルファイルの中身をテキストエディタで確認 ・サンプルファイルの中身をブラウザで確認 ・サンプルファイルの商品名と商品説明欄にテキストとタグを追加 ・追加したものをブラウザで確認 の様子です！
2016-07-14 16:02:02
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
#わかばちゃん実践日記 3日目、p84~95。 ・リストでナビゲーションを作り、 ・そのナビゲーションにリンクを追加。 ・リンク移動確認もOK！TOPページにいけた！ pic.twitter.com/iTzeRYlOn2
2016-07-16 23:31:14
拡大
拡大
拡大
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
#わかばちゃん実践日記 やったところまで付箋貼るのたのしいฅฅฅ pic.twitter.com/Q6VFQPTefs
2016-07-16 23:39:02
拡大
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
#わかばちゃん実践日記 4日目、p96~103。 Tシャツ画像が入ってぐっといい感じになった！ ＋まだページの見た目に変化はないけど、header等のエリア分けしました！ pic.twitter.com/kJlMLWsLQO
2016-07-19 00:40:28
拡大
拡大
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
#わかばちゃん実践日記 5日目、p106~113。 ・CSSちゃんお迎えじゅんび（idやclassの追加） ・表の作り方をaboutページのソースコードを見て学ぶ。この辺今までよくわかんなかったけど、わかばちゃん達の会話でわかった！ pic.twitter.com/P4KRq2ayNb
2016-07-20 01:08:05
拡大
拡大
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
#わかばちゃん実践日記 6日目、p114~120。 ・お問い合わせページの確認（スクショしたとき消えちゃったけどバリデーション機能も確認） ・ページのソースコードの確認（form要素・textarea要素） pic.twitter.com/0TEz4tjYqq
2016-07-23 16:59:49
拡大
拡大
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
わかばちゃんずいぶんやってなくてだいぶ忘れてたので最初から復習して🐱📑貼りなおした。 pic.twitter.com/9v4HtKAj3H
2016-08-12 06:40:13
拡大
拡大
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
#わかばちゃん実践日記 7日目、p142~147。 ・HTMLちゃんとCSSちゃんが繋がってページが一気におしゃれに！ ・さらにWebフォントでメニューのフォントをおしゃれにしました！ pic.twitter.com/dBnIazJKoj
2016-08-14 19:42:50
拡大
拡大
拡大
拡大
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
見た目が変わってくのめっちゃ楽しくて終始テンション上がってました…！CSSちゃんすごい！（もちろんHTMLちゃんもすごい！）
2016-08-14 19:45:13
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
#わかばちゃん実践日記 8日目、p150~155。 ・値段の2980円の文字サイズが大きくなって ・赤くなりました！ pxは知ってたけどemは知らなかったし、RGBは知ってたけど省略できるのは知らなかった。いろんな書き方あるんだな～ pic.twitter.com/k7Xr7PC3Rm
2016-08-17 19:40:58
拡大
拡大
拡大
拡大
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
昨日の #わかばちゃん実践日記 で「pxは知ってたけどemは知らなかった」と書いたところ、他にも色々な単位があると教えていただきました！すごい便利そう！ twitter.com/kaho2063/statu…
2016-08-18 20:00:32
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
PC買い替えてデータを失ったせっかくの機会なのでわかばちゃん最初からやり直してるんだけど、「Webページを作るのって楽しい、HTMLっておもしろい！」って文章をもう一回打った瞬間、また最初の頃のわくわくを思い出せたのでよかった。 pic.twitter.com/U3EQ34UUFQ
2016-09-21 19:48:08
拡大
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
#わかばちゃん実践日記 9日目、p170~183。 ・パディングとマージンをデベロッパーツールで確認 ・フロートがどうなってるか確認 ・フロートを解除しました！ pic.twitter.com/zFtvypKbN1
2016-09-21 23:27:26
拡大
拡大
拡大
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
#わかばちゃん実践日記 10日目、p198~203。 ちょっと短いですが次のジェイクエリーさんが長くなりそうなので。 ・JavaScriptをHTMLに書き込んで ・魔法（アラート）を発動させました！ pic.twitter.com/JJueO3Q8hd
2016-09-22 22:16:13
拡大
拡大
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
#わかばちゃん実践日記 11日目、p207~215。 ・jQuery召喚の準備 ・魔導書（プラグイン）から使う呪文（css、js、image）を取り込む ・HTMLファイルに呪文を書き込む ・拡大画像表示魔法発動！ pic.twitter.com/6wCncgDNvr
2016-09-24 17:00:19
拡大
拡大
拡大
拡大
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
「わかばちゃんと学ぶWebサイト制作の基本」のコーディング部分を実践していく #わかばちゃん実践日記 ですが、コーディング部分のすべての実践が終わったので、今回で終了になります。
2016-09-24 17:12:05
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
ただ、「わかばちゃんと学ぶWebサイト制作の基本」の魅力はコーディング部分だけでなく、「企画から運用まで一連の流れが載っているので、初心者でもサイトを公開するところまでできる」ところだと思ってるので、いつか作りたいサイトがはっきり決まったら、残りの部分も実践していきたいです。
2016-09-24 17:20:04
✂ｷｳｲﾉｰﾄ✂
@_kiwinote_
かなりゆっくりペースでやってきましたが、ずっと楽しく学んでいくことができました！ #わかばちゃん実践日記 ツイートを見てくださった皆様、RTや♥くださった皆様、本当にありがとうございました！ pic.twitter.com/UY2WWTFBog
2016-09-24 17:35:13
拡大