【作業効率UP！】Web制作にマストのGoogle Chrome拡張機能10選！現役Webディレクターも愛用【HTML・CSS コーディング】

Рет қаралды 35,294

Күн бұрын

現役Webディレクターも現場で愛用！作業効率が格段にアップする、おすすめのGoogle Chrome拡張機能10選の紹介です！
全て無料でとっても便利な機能なので、是非インストールして今日から使ってみてください。
＜目次＞
・オープニング 0:00
・クロームとは？拡張機能の使い方 0:42
① Picture-in-Picture Extension　1:52
chrome.google.com/webstore/de...
② Pasty　3:18
chrome.google.com/webstore/de...
③ Linkclump　4:05
chrome.google.com/webstore/de...
④ OneTab　5:05
chrome.google.com/webstore/de...
⑤ Wappalyzer　6:02
chrome.google.com/webstore/de...
⑥ WPSNIFFER　7:05
chrome.google.com/webstore/de...
⑦ WhatFont　8:27
chrome.google.com/webstore/de...
⑧ ColorZilla　9:20
chrome.google.com/webstore/de...
⑨ 簡単！タイトル表示＋　10:21
chrome.google.com/webstore/de...
⑩ Tag Assistant Legacy　11:28
chrome.google.com/webstore/de...
====================================
【超入門】作業効率爆上がり！必ず覚えておきたい超絶便利ショートカット【HTML・CSS コーディング】
• 【超入門】作業効率爆上がり！必ず覚えておきた...
【超入門】未経験からWebデザイナーを目指す方必見！現役採用担当者がポートフォリオで見ているポイントについて【Webデザイナー就活応援】
• 【超入門】未経験からWebデザイナーを目指す...
【超入門】知らなきゃマズイ！HTML・CSS 基本の「き」【HTML・CSS コーディング】
• 【超入門】知らなきゃマズイ！HTML・CSS...
-- Webの神様 --
未経験、初心者のみなさんのHTML・CSSの学習を応援していくチャンネルです！
【タグ】
#Webデザイナー #コーディング #プログラミング #拡張機能 #Chrome
【SNS】
-- Twitter --
/ webgodweb
-- Facebook --
/ webgodweb
【運営会社】
株式会社カラフルクローバー
www.colorful-clover.co.jp/
★★★「Webの神様」メンタープランのご案内★★★
ナビゲーターの「なつこ」が講師となって、皆さんのWebデザイン・プログラミング学習をサポートする「メンタープラン」を実施中です！
【お知らせ動画】
「Webの神様」があなたのメンターになります
• 【お知らせ】「Webの神様」があなたのメンタ... プレビュー
【プランの詳細・お申し込み（MENTA）】
menta.work/plan/5148
未経験から学習中の方、Web・IT業界に就職・転職活動中の方、フリーランス独立を目指して活動中の方など、必要として頂いている皆さんのお役に立てるように精一杯サポートさせて頂きます！
是非ともご検討いただければ幸いです。
★★★★★★★★★★★★★★★★★★★★★★★

Пікірлер: 21

@webgodweb 3 жыл бұрын

====== 動画内で紹介している拡張機能一覧 ====== ① Picture-in-Picture Extension chrome.google.com/webstore/detail/picture-in-picture-extens/hkgfoiooedgoejojocmhlaklaeopbecg ② Pasty chrome.google.com/webstore/detail/pasty/hdjihnnclpjhfdbbinmgoiehhoehhlgf/related?hl=ja ③ Linkclump chrome.google.com/webstore/detail/linkclump/lfpjkncokllnfokkgpkobnkbkmelfefj/related?hl=ja ④ OneTab chrome.google.com/webstore/detail/onetab/chphlpgkkbolifaimnlloiipkdnihall/related?hl=ja ⑤ Wappalyzer chrome.google.com/webstore/detail/wappalyzer/gppongmhjkpfnbhagpmjfkannfbllamg/related?hl=ja ⑥ WPSNIFFER chrome.google.com/webstore/detail/wpsniffer-wordpress-theme/kihhefcbenhkjgjhchanjfhhflaojldn/related ⑦ WhatFont chrome.google.com/webstore/detail/whatfont/jabopobgcpjmedljpbcaablpmlmfcogm?hl=ja ⑧ ColorZilla chrome.google.com/webstore/detail/colorzilla/bhlhnicpbhignbdhedgjhgdocnmhomnp?hl=ja ⑨ 簡単！タイトル表示＋ chrome.google.com/webstore/detail/easy-show-title-plus/gdpfgejmikpgbnbhbhjegjfglhodfloa/related?hl=ja ⑩ Tag Assistant Legacy chrome.google.com/webstore/detail/tag-assistant-legacy-by-g/kejbdjndbnbjgmefkgdddjlbokphdefk?hl=ja ====================================

@okaki8491 3 жыл бұрын

知らなかったものたくさんありました！ありがとうございます😊

@webgodweb 3 жыл бұрын

ご視聴ありがとうございます😊これからも色々発信していきますので、よろしくお願いします🙇‍♀️

@user-yw8sj8bv3r 3 жыл бұрын

神動画です....！こうゆうのあったらいいなって思ってたのが実際にあったんですね....！！！作業効率上がるわこれ！！

@webgodweb 3 жыл бұрын

ご視聴ありがとうございます！☺️ はい、知っていると知らないとでは全然違うので、是非活用してみてください！！

@YK-yf6il 3 жыл бұрын

知らないものばかりでした！ありがとうございます！！

@webgodweb 3 жыл бұрын

ご視聴ありがとうございます😊これからもよろしくお願いします🍀

@user-gp4fl2ic9i 3 жыл бұрын

いつも参考にさせてもらっています！

@webgodweb 3 жыл бұрын

いつもご視聴ありがとうございます☺️

@KR-wy8ve Ай бұрын

ディレクターが知らないとマズイ知識や上手くディレクションをするコツ、裏技など、WEBディレクション編の動画も是非観てみたいです！

@user-wo6oz4rm3w Жыл бұрын

ありがとうございます。😍

@shika-bf 3 жыл бұрын

Page Monitorは便利でした。

@webgodweb 3 жыл бұрын

ありがとうございます！参考にさせていただきます🙇‍♀️

@user-oe4ru5or9m 2 жыл бұрын

Exit WhatFont が表示されないページがあるのですが原因はなんでしょうか？もちろん文字情報も出ません！

@itoyo6460 Жыл бұрын

こんばんは。ためになる情報をありがとうございます。１つ質問なのですが、① Picture-in-Picture Extension　でキャプチャーで再生している動画をキャプチャー画面で時間を進めたり、戻したりすることは可能でしょうか。つい聞きそびれてしまった内容があったときに１０秒前に戻したいと思っても、再生を止めるボタンか元の動画のページに戻る機能しかなさそうで、少し不便だなと感じてしまいました。。。

@webgodweb Жыл бұрын

コメントありがとうございます！！今のところ、時間を進めたり戻したりすることはできない拡張機能です🙇‍♀️その点では確かに不便なのですが、キャプチャー画面をクリックすれば動画を再生しているタブに戻れるのでそこで操作するか、きちんと追わずに流し見したいだけの動画を見るときには便利かなと思っています。。私も、そう言う意味では使い勝手の良さそうな時にだけこの拡張機能を使っています！

@TV-vh5ji Жыл бұрын

以前、ＡTOMを使ってHTML,CSS,JSを書く動画があったかと思います。久々に学習しようとしているのですが、どの動画でしょうか。（その時の動画を使って、ATOMはインストール済です）

@webgodweb Жыл бұрын

申し訳ありません、Atomを使って解説していた動画は、本当に最初の数本のみなので、現在はVisual Studio Code（VS Code）というエディタを使っての解説がほとんどとなります。コードを書く、という点においては、アプリがAtomであってもVS Codeであっても出来ることに大差はありません。むしろ、VS Codeの方が高機能で変わらず無料なので、私もVS Codeに乗り換えました。下記の動画でVS Codeを使ったHTML/CSS学習の始め方や、Visual Studio Code自体のインストール、設定方法なども解説しておりますので、是非ご参考いただけますと幸いです。【超入門】HTML・CSSってなに？学習の始め方解説 2021年最新版【未経験・初心者向け】 kzfaq.info/get/bejne/o5pxgsmpp5y8gmQ.html 【初心者向け】Visual Studio Codeの使い方・便利機能解説！ショートカット/日本語化/Emmet【作業効率化】 kzfaq.info/get/bejne/prdnp9CF3Zu-kp8.html どうしてもAtomを使いたいということでしたら、自分が使っているエディタと違う点だけ無視していただければ、HTMLやCSS、JavaScriptなどの解説動画の内容自体は参考にしていただけるかと思います。