ほりうち

スポンサーリンク
WEB制作

Astroの使いやすいアートディレクションコンポーネントを考える

Astroの画像の扱いについてv3.0で組み込まれたastro:assetsにはImageコンポーネントがあり、srcディレクトリ内の画像であれば最適化して表示してくれる仕組みがあります。最適化する場合、画像はそのままコンポーネントにパスを...
WEB制作

【フレームワーク】何やら便利そうなのでAstroを触ってみた

静的サイトのコーディングはWebpack+Gulpでビルドして納品していて、EJSで必要に応じてコンポーネントを分けたりしていたんですが、基本的にはHTML直書きとそんなに変わりません。ただ最近は画像周りのタスク処理が増えてきてビルドに時間...
その他豆知識

【Googleカレンダーで簡単】オンライン商談向け、面談予約フォームを作る

Googleカレンダーで予約画面を作成できるのを知っていますか?最近無料でも使えるようになったようなので、早速試してみました。早速やってみる①Googleカレンダーを開く予約画面はGoo...
WEB制作

スクロールイベントの処理ならIntersectionObserver(交差オブザーバー)を使おう(コピペコード付)

数年前のブログで、アニメーションの制御にはjQueryのスクロールイベントを使用していましたが、この方法はスクロール中に連続してイベントが処理されるため、パフォーマンスの観点からはイベントの間引き処理などの工夫が必要です。Chromeのデベ...
WEB制作

【CSS】こんなの待ってた!コンテナ単位でブレイクポイントを決められる「コンテナクエリ」

メディアクエリに変わるコンテナクエリまずは以下の例をご覧ください。ボックスが2列で並んだ赤枠のボックスコンテンツ部分、右側にサイドバーがあるレイアウトになっています。PCの場合はリサイズできるようにしていますので試してみてください。Seet...
WEB制作

【HTML&CSS】画像を簡単にトリミングできるobject-fitを使う

昨年6月にIEが完全にサポートされなくなり、モダンブラウザに実装されている便利なプロパティが多数使えるようになりました。このため、コーディングもかなりやりやすくになったように思います。今回は画像のトリミングをシンプルに扱ってくれるプロパティ...
WEB制作

プログラミングの基礎理解①(変数と定数編)

WEB制作に関係するプログラミングの基礎について書いてみました。今回はプログラミングで不可欠な変数と定数の話です。変数は数値や文字列といったデータを格納する記憶領域、いわゆる箱のようなものと言ったらよいでしょうか。一度データを代入(格納)すると、何度でも変数を通してそのデータを利用することができます。
WEB制作

WEBサイトを制作するときに知っておきたいオープンソースの話

WEBサイトを制作する時に今は0からソースコードを組むことはほぼないと言ってもいいくらい、様々なフレームワークと呼ばれるアプリやライブラリが使われています。それらはオープンソースとして公開されているため、フレームワークは自由に利用ができる仕組みになっています。 オープンソースとは何か?
その他豆知識

【小技】エディターソフトの基本、置換機能をOCRと組み合わせて使う

(今回の内容はPC慣れしてない人向けです) みなさん、置換って使ってますか? パソコンで文字打ちする時にまとめて文字を変更したいとき、ほとんどのテキストエディターには置換という機能があります。プログラミングやコーディングをやるような人であれば知らない人はいないかもしれません。私もコーディングをやるようになって知って使うようになりました。
WEB制作

WEB担当者がオススメするWordPressプラグイン10選

カスタムフィールドを使う場合はみなさん、ほぼこちらのAdvanced Custom Fieldsを使っているのではないのでしょうか?当社では PRO版の開発者ライセンスを購入し使用していますが、リピーターフィールドを始め、オリジナルの入力項目を設定するのに便利な機能が充実しています。
スポンサーリンク