【Webデザイン入門】SVGって何？SVG画像の作成・読み込み・ダウンロード方法まで一気に解説【HTML・CSS コーディング】
Vložit
- čas přidán 8. 10. 2021
- SVGって聞いたことあるけど、よくわからない。使ったことがないという初心者の方へ！
Webデザイナーを目指すなら、SVGの正体を理解して、正しく適切に扱えるようになりましょう！
SVG画像の作成方法からダウンロード方法まで解説しています！
★動画内で使用している主なショートカットキーについて
下記動画で詳しく紹介していますので、効率的な模写コーディングのお供に是非ご覧ください。
【超入門】作業効率爆上がり！必ず覚えておきたい超絶便利ショートカット【HTML・CSS コーディング】
• 【超入門】作業効率爆上がり！必ず覚えておきた...
【初心者向け】Visual Studio Codeの使い方・便利機能解説！ショートカット/日本語化/Emmet【作業効率化】
• 【初心者向け】Visual Studio C...
【作業効率UP！】Web制作にマストのGoogle Chrome拡張機能10選！現役Webディレクターも愛用【HTML・CSS コーディング】
• 【作業効率UP！】Web制作にマストのGoo...
====== おすすめ関連動画 ======
【超入門】初心者向け 模写コーディング！オススメのやり方とポイント【HTML・CSS コーディング】
• 【超入門】初心者向け 模写コーディング！オス...
【超入門】初心者必見！模写コーディングをやってみた 実践編【HTML・CSS コーディング】
• 【超入門】初心者必見！模写コーディングをやっ...
-- Webの神様 --
未経験、初心者のみなさんのHTML・CSSの学習を応援していくチャンネルです！
【タグ】
#Webデザイン #コーディング
【SNS】
-- Twitter --
/ webgodweb
-- Facebook --
/ webgodweb
【運営会社】
株式会社カラフルクローバー
www.colorful-clover.co.jp/
★★★「Webの神様」メンタープランのご案内★★★
ナビゲーターの「なつこ」が講師となって、皆さんのWebデザイン・プログラミング学習をサポートする「メンタープラン」を実施中です！
【お知らせ動画】
「Webの神様」があなたのメンターになります
• 【お知らせ】「Webの神様」があなたのメンタ... プレビュー
【プランの詳細・お申し込み（MENTA）】
menta.work/plan/5148
未経験から学習中の方、Web・IT業界に就職・転職活動中の方、フリーランス独立を目指して活動中の方など、必要として頂いている皆さんのお役に立てるように精一杯サポートさせて頂きます！
是非ともご検討いただければ幸いです。
★★★★★★★★★★★★★★★★★★★★★★★ - Jak na to + styl
SVGって聞いたことあるけど、よくわからない。使ったことがないという初心者の方へ！
Webデザイナーを目指すなら、SVGの正体を理解して、正しく適切に扱えるようになりましょう！
SVG画像の作成方法からダウンロード方法まで解説しています！
★動画内で使用している主なショートカットキーについて
下記動画で詳しく紹介していますので、効率的な模写コーディングのお供に是非ご覧ください。
【超入門】作業効率爆上がり！必ず覚えておきたい超絶便利ショートカット【HTML・CSS コーディング】
czcams.com/video/2Egsijek-aM/video.html
【初心者向け】Visual Studio Codeの使い方・便利機能解説！ショートカット/日本語化/Emmet【作業効率化】
czcams.com/video/pQ7tmTx5Zbk/video.html
【作業効率UP！】Web制作にマストのGoogle Chrome拡張機能10選！現役Webディレクターも愛用【HTML・CSS コーディング】
czcams.com/video/mfc6iCcgMq0/video.html
とてもわかりやすかったです！
なんとなくしか理解してなかったので、すごく勉強になりました❗️
ありがとうございました😊
お役に立てて嬉しいです！☺️
こちらこそありがとうございます！！
どの動画も分かりやすくて本当に助かってます。優しい先生に教わってる感じで癒されるし楽しく学ばせてもらっております。今回のファッション好きです💜
コメントありがとうございます！とても励みになります🙇♀️わーっ嬉しいです！！💜
ほんとにわかりやすいチャンネルです！最高なので、もっと色々なことをたくさんアップして欲しい〜ーーーー
有り難いお言葉ありがとうございます😂 かしこまりました！！これからも幅広いテーマで発信していけるように頑張ります🙇♀️
勉強になりました！たすかります
ご視聴ありがとうございます🙇♀️
ちょうど調べてたのでとても助かります！
コメントありがとうございます！
タイミングが良くてこちらも嬉しい限りです✨
今までSVGは、ロゴとかアイコンに適しているものというくらいの認識しかなかったのですが、
動画を見てテキストデータになっていることに驚きました。
サイズ変更に対応しているという点は、レスポンシブデザインにおいても強みだと思うので使いこなしていきたいです。
コメントありがとうございます！
そうですね！スマホ用に別サイズの画像を用意したり、スマホでもPCと同じ画像を使って、余計な容量を読み込んだりする必要がないので、使い方によってはかなり便利で使える子だと思います🙇♀️✨
ありがとうございます✨✨
こちらこそありがとうございます🙇♀️✨
なんだ、ただの神か。
コメントありがとうございます😂
SVG．．．恥ずかしながら初めて聞きました。知るは一時の恥。知らぬは一生の恥。勉強になりました！
ご視聴ありがとうございます！おっしゃる通り、この機会に知っていただけて良かったです✨
最近のWebサイトのアイコンなどの要素に注目してみると、結構使われてるものも多いと思いますー！
ファビコンの作成方法もお願いしたいです！
リクエストありがとうございます！今後の動画テーマの参考にさせていただきます！🙇♀️🙇♀️
オープニングアイキャッチの太陽が登る動きはsvgアニメーション使ってます？
こちらは動画編集ソフトで作っているので、また違う仕組みのお話ですが、同じようなアニメーションをWebサイト上で表示したいなら、SVGアニメーションで実装できますね！☀️
SVGはWeb上で表示するコンテンツに活用すると、この動画で紹介したようなメリットが得られます！
なつこさん、見間違えてなければファイルの保存日時深夜なのでは……ご自愛ください🙏
ハッ、気づかれてしまいました😂
気にかけて頂きありがとうございます🙇♀️🙇♀️夜型なんです。。笑
今回のなつこさんアーティストのiriさんに似てる気がする