入社2年目マークアップエンジニアの情報の集め方
DESCRIPTION
今年入った新人さんに向けて私がやっている情報収集の方法をまとめました。TRANSCRIPT
![Page 1: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/1.jpg)
マークアップエンジニアの情報の集め方
有限会社アップルップル 森田 かすみ
@KasumiMorita
アップルップル公開社内勉強会 Vol.5
入社2年目
![Page 2: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/2.jpg)
1. 情報収集の大切さ
2. 新しい情報を収集する
3. すでに浸透している情報を収集する
4. 情報を発信する
5. 英語の記事も読む
6. 情報収集する時間
今日のお話
![Page 3: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/3.jpg)
情報収集の大切さ
![Page 4: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/4.jpg)
技術の改変が多いWeb業界では追いついていくのが大変だと
いうところに目を付ける
入社1年目情報収集の大切さ
![Page 5: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/5.jpg)
技術の改変が多いWeb業界では追いついていくのが大変だと
いうところに目を付ける
新人が入る隙は最新情報の収集だと思
い力を入れはじめる
入社1年目入社1年目情報収集の大切さ
![Page 6: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/6.jpg)
情報収集の大切さ
しかし、先輩がいなくなるというまさかの展開
入社2年目
![Page 7: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/7.jpg)
情報収集の大切さ
しかし、先輩がいなくなるというまさかの展開
私が知らなきゃ誰がマークアップのこと
知ってるの?
入社2年目
っていう状態になる
![Page 8: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/8.jpg)
どの立場にしろ、情報収集は大切
情報収集の大切さ 結論
![Page 9: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/9.jpg)
新しい情報を収集する
![Page 10: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/10.jpg)
もしかしたらいまの制作方法より、より良い方法があるかもしれ
ない
新しい情報を収集する理由
![Page 11: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/11.jpg)
もしかしたらいまの制作方法より、より良い方法があるかもしれ
ない
よりよく制作するためにも新しい情報を収集する
必要がある
新しい情報を収集する理由
![Page 12: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/12.jpg)
とくにアップルップルではWeb制作者のお客さんもいっぱいいる
新しい情報を収集する理由
a-blog cmshttp://www.a-blogcms.jp/
WCANhttp://wcan.jp/
![Page 13: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/13.jpg)
● RSS● SNS● メールマガジン
● ニュースアプリ
新しい情報を収集する
主な方法
![Page 14: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/14.jpg)
新しい情報を収集する
RSS
● 有益なブログを見つけたらすぐ登録
● マークアップだけじゃなくてデザイン系のブログもチェック
する
● まとめサイトを登録すると情報も多くて効率よくなる
![Page 15: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/15.jpg)
Designer News Feedhttps://news.layervault.com/
![Page 18: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/18.jpg)
SNS
● 収集はFacebook、Twitterが主
○ はじめのうちは、目安として比較的意識が高い人が多
い有名な方々をチェック
● 社内共有兼ブックマーク用にはてブを活用
新しい情報を収集する
![Page 19: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/19.jpg)
メールマガジン
● 週1で配信してくれる
● 「 ◯◯ Weekly」で検索すると案外あったりする
新しい情報を収集する
![Page 22: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/22.jpg)
Responsive Web Designhttp://responsivedesign.is
![Page 23: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/23.jpg)
ニュースアプリ
● SNSやRSSで見逃したいまの流行がわかる
● 個人的にはチェックの優先度は低い
○ Gunosy
○ Zite
新しい情報を収集する
![Page 24: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/24.jpg)
すでに浸透している情報を収集する
![Page 25: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/25.jpg)
● 検索
● 人に聞く
すでに浸透している情報を収集する
主な方法
![Page 26: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/26.jpg)
検索
すでに浸透している情報を収集する
検索ができると先輩がいなくなっても不安はあんまりない
検索はWeb制作者にとっては大事なスキルの1つ
![Page 27: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/27.jpg)
検索のコツ
● 最短で検索するにはボキャブラリーをストックしておくこと
● 英語も検索範囲にいれること
すでに浸透している情報を収集する
![Page 28: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/28.jpg)
人に聞く
すでに浸透している情報を収集する
● どうしてもわからないことは詳しい人に聞くほうが早い
● ネットではなく、直接でしか言えない話もある
![Page 29: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/29.jpg)
人に聞く
すでに浸透している情報を収集する
● どうしてもわからないことは詳しい人に聞くほうが早い
● ネットではなく、直接でしか言えない話もある
勉強会とか、懇親会で聞いちゃえばいい
![Page 30: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/30.jpg)
情報を発信する
![Page 31: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/31.jpg)
● 発信するその内容に興味のある人があつまる
● 発信した内容の間違えているところを指摘してくれたり、
補足してくれたりして勉強になることもある
情報を発信する
![Page 32: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/32.jpg)
● 発信するその内容に興味のある人があつまる
● 発信した内容の間違えているところを指摘してくれたり、
補足してくれたりして勉強になることもある
発信することも情報収集の1つ
情報を発信する
![Page 33: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/33.jpg)
● SNSで興味のあることについて書く
● ブログに書いてSNSにURLを流して発信
● 勉強会で発表する
情報を発信する
情報発信のしかた
![Page 34: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/34.jpg)
情報収集じゃないけど、発信することで社内共有もできるので
積極的に発信していったほうが良いと思ってる
余談 )情報発信することで社内共有にもなる
![Page 35: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/35.jpg)
余談 )情報発信することで社内共有にもなる
● SVGの記事をはてブにしたことがきっかけで、実際に制
作でSVGを使うことになった
例えば
自分のできることを知ってもらうことで仕
事に繋がる
![Page 36: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/36.jpg)
英語の記事も読む
![Page 37: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/37.jpg)
英語の記事も読む
英語 が読める って大事!
![Page 38: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/38.jpg)
英語の記事も読む
英語 が読める って大事!
に抵抗感がない
![Page 39: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/39.jpg)
英語に抵抗感がないだけで十分
● 英語が読めなくても単語が分かれば大体なんの内容か
わかる
● 英語が読めなくてもコードは読める
英語の記事も読む
ソースコードは共通言語!(だと思ってる)
![Page 40: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/40.jpg)
自信がなくても読もうとすることが重要
英語の記事も読む
読もうとしないとそもそも記事にたどり着けない可
能性がある
![Page 41: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/41.jpg)
英語が読めるのと抵抗感がないのは違う
読むしかないので読みましょう!
抵抗感を無くすには
● 英語がわからなくてもコードは理解できる記事
● 挫折を味わう暇もないくらいすぐに実装できる内容の記事
おすすめ
![Page 42: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/42.jpg)
英語が読めるのと抵抗感がないのは違う
例えば
● Bootstrapの公式サイトをみながらサイトをつくってみる
● 英語の記事をみながらSublimeTextの設定をしてみる
![Page 43: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/43.jpg)
英語の記事も読むことはお得!
英語の記事も読む本題に戻ります
![Page 44: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/44.jpg)
一般的には
● 翻訳する時間を待たないので早い
● 翻訳されていないので、誤訳の心配がない
なぜ英語がお得なのか
などの理由がメリットにあげられます
![Page 45: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/45.jpg)
一般的には
● 翻訳する時間を待たないので早い
● 翻訳されていないので、誤訳の心配がない
なぜ英語がお得なのか
などの理由がメリットにあげられますが、
![Page 46: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/46.jpg)
個人的には
● 単純に考えて英語のほうが日本語よりも記事が多い
● 英語で検索したほうが答えにたどり着くことが早いことも
ある(=時間短縮できる)
なぜ英語がお得なのか
がお得だと思う
![Page 47: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/47.jpg)
ちなみに私は翻訳されてる記事も読みます
● POSTD
● コリス
もちろん翻訳されてる記事も読む
![Page 48: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/48.jpg)
● 長い記事は読むのが大変になってくる
● 見逃した英語の記事を拾うという意味でチェックする
もちろん翻訳されてる記事も読む
翻訳されている記事も読む理由
![Page 49: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/49.jpg)
● 長い記事は読むのが大変になってくる
● 見逃した英語の記事を拾うという意味でチェックする
もちろん翻訳されてる記事も読む
翻訳されるくらいなので良記事の確率は高い
翻訳されている記事も読む理由
![Page 50: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/50.jpg)
情報収集する時間
![Page 51: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/51.jpg)
● 通勤時間
● お昼休み
情報を発収集する時間
![Page 52: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/52.jpg)
● 通勤時間
● お昼休み
電車片道45 ~ 50分、お昼休みは実質30分くらい
情報を発収集する時間
![Page 53: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/53.jpg)
● 通勤時間
● お昼休み
電車片道45 ~ 50分、お昼休みは実質30分くらい
1日につき、2時間10分くらい情報を追える
情報を発収集する時間
![Page 54: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/54.jpg)
とは言っても、疲れてたりしたら電車で寝るし、本読んだりもす
る
嫌にならない程度にするのがポイント
情報を発収集する時間
![Page 55: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/55.jpg)
まとめ
![Page 56: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/56.jpg)
● どんな立場でもWeb制作者に情報収集は大事なスキル
● 情報を集めるためにも情報を発信しよう
● 自信がなくてもまずは英語の記事を読む
● すきま時間をつかうと結構な時間を使える
まとめ
![Page 57: 入社2年目マークアップエンジニアの情報の集め方](https://reader033.vdocuments.mx/reader033/viewer/2022060111/556a492ed8b42a4a1e8b4fac/html5/thumbnails/57.jpg)
ありがとうございました!
有限会社アップルップル 森田 かすみ
@KasumiMorita