CSSレイアウトテクニック SVGArtistaの使い方
SVGデータでパスのアニメーションを実装しよう！このサイトでパスアニメーションが作成できます。やってみましょう！SVGデータを作るまずはSVGデータを作る必要があります。イラストレーターで作成してください。データの注意点として パスファイン...
2024-11
CSSレイアウトテクニック 
CSSレイアウトテクニック youtubeとgooglemap埋め込みのレスポンシブ化
youtubeとgooglemapのスマホ対応しようスマホでうまく埋め込みの「iframe」のサイズ指定がうまくできないのはあるある！対象方法を学ぼう！なんでうまく制御できないのかな？iframeは外部サイトの埋め込みです。CSSで制御でき...
WEB制作基礎知識 PHP超入門 （さわりだけ）
Web制作でよく使われるPHPについて知っておこう！サーバーサイドのプログラミング言語として「PHP」があります。こちらについて学んで、Web制作についてより深く理解しましょう！PHP（Hypertext Preprocessor）は、サー...
WEB制作基礎知識 GitとGitHub超入門 （さわりだけ）
Web制作でも使うよ、GitとGitHubを知っておこうバージョン管理ツールとして「Git」があります。概念が理解しにくいものなのですが、使えると大変便利なので把握してみましょう！Gitは、プログラミングやWeb制作で使用されるバージョン管...
プログラムを作ってみよう 【やってみよう】ページ遷移アニメーション
作ったサイトにページ遷移アニメーションを追加しよう！ページ遷移のアニメーションをちょっと追加するだけでサイトがリッチになります。チャレンジしてみましょう！今回はCSSのみで実装してみます。デモページhtmlはbodyにclassをつけるだけ...
プログラムを作ってみよう 【やってみよう】JavaScriptでTODOリストを作る
「TODOリスト」プログラムを作る！腕試しとして、jQueryとJavaScriptでシンプルなプログラムを作ってみましょう初心者向けのプログラムで「TODOリスト」をよく作るらしいので、やってみましょう！どう実装するか考えてみましょう。ま...
プログラムを作ってみよう 【やってみよう】JavaScriptでおみくじを作る
「おみくじ」プログラムを作る！腕試しとして、jQueryとJavaScriptでシンプルなプログラムを作ってみましょう初心者向けのプログラムで「おみくじ」をよく作るらしいので、やってみましょう！どう実装するか考えてみましょう。まずは要件と実...
プログラムを作ってみよう 【やってみよう】AOSプラグインでスクロールアニメーション
作ったサイトにスクロールアニメーションを追加しよう！サイトにスクロールアニメーションをちょっとつけるだけでもとてもリッチに見えます。ぜひ実装していきましょう！今回使用するのは「AOSプラグイン」です。このサイトで説明しなくてもいいくらいに実...
プログラムを作ってみよう 【やってみよう】JavaScriptで消費税計算機を作る
「商品の税金を計算する」プログラムを作る！腕試しとして、jQueryとJavaScriptでシンプルなプログラムを作ってみましょう税抜金額を入力したら、税込金額のアラートができるサイトを作ってくださいこのような依頼があったら、作れるでしょう...
プログラムを作ってみよう slackのスタンプジェネレータを作った
オリジナルプログラムを作るには考え方が大事jQueryとJavaScriptの基本をおぼえたら、プログラムを作ってみましょう。ここで難しいのが、オリジナルプログラム作成は「サンプルコードを写して動かす」先にはないということです。まず「これを...
プログラムを作ってみよう 【やってみよう】授業用チャイムを鳴らすWEBアプリを作る
オリジナルプログラムを作るには考え方が大事jQueryとJavaScriptの基本をおぼえたら、プログラムを作ってみましょう。ここで難しいのが、オリジナルプログラム作成は「サンプルコードを写して動かす」先にはないということです。まず「これを...
プログラムを作ってみよう 【やってみよう】ドット絵作成のプログラムを作る
オリジナルプログラムを作るには考え方が大事jQueryとJavaScriptの基本をおぼえたら、プログラムを作ってみましょう。ここで難しいのが、オリジナルプログラム作成は「サンプルコードを写して動かす」先にはないということです。まず「これを...