Column
コラム
ホームページ制作・運用・地方 Web マーケティングについて、現場の経験から発信しています。
全 66 件中 12 件を表示
-
CSS設計【CSS】iPhoneのノッチやセーフエリアに対応するenv()関数の使い方
モバイルで下のボタンがホームインジケーターに重なって押しにくいことはありませんか。 端末が変わるとドロワーやトーストの位置が少しずれて見えることもあります。 その数ピクセルが使いやすさに直結します。 この記事では env(safe-area…
2026.04.11
- ツール・環境
Gulpの導入方法と基本的な使い方
Gulpは、フロントエンド開発においてタスクの自動化を助けるツールです。 例えば、JavaScriptやCSSの圧縮、Sassのコンパイル、ファイルの監視など、面倒な作業を自動化できます。 これにより、開発の効率が大幅に向上します。Gulp…
2026.04.11
- ツール・環境
Gulpのおすすめプラグイン一覧
フロントエンド開発の効率を飛躍的に高めるために、多くの開発者が利用しているGulp。 タスクの自動化を通じて、コーディング作業を楽にするこのツールは、初心者にも非常に有用です。 しかし、Gulpの本当の力を引き出すためには、どのプラグインを…
2026.04.11
- ツール・環境
VSCodeの拡張機能をやめるべき理由と代替手段
VSCode（Visual Studio Code）は、多くの開発者に愛用されている軽量かつ強力なエディタです。 その魅力の一つは、豊富な拡張機能を簡単に追加できる点にあります。 しかし、拡張機能に過度に依存することには、いくつかの重要な問…
2026.04.11
- ツール・環境
XServer Static × GitHub Actions で静的サイトを自動デプロイする方法
今回、 XServer Static を契約して静的サイトを公開し、 GitHub Actions を利用して自動デプロイの環境を構築しました。 もともと、静的サイトのホスティングにはさまざまな選択肢がありますが、 XServer Stat…
2026.04.11
- WordPress
WordPressのオリジナルテーマをやめた話
WordPressでのサイト制作といえば、「オリジナルテーマを1から作る」がずっと自分の定番でした。 自由度も高く、要望にも柔軟に対応できる…と思っていたのですが、ここ最近はそのスタイルをやめることにしました。 今は既存テーマをベースに、必…
2026.04.11
- CSS設計
CSS 長さ単位の使い分けメモ
CSS には多くの長さ単位がありますが、実際の実装で「どこで何を使うべきか」迷うことも多いです。 このメモは、長さ単位の使い分けルールを整理しておくためのものです。 目的は デザインの一貫性 と ユーザー操作（文字サイズ変更など）による崩れ…
2026.04.11
- WordPress
【2025年版】Broken Link Checkerの設定と使い方解説
リンク切れを放置するとSEOや信頼に影響しますが、サーバーに負荷はかけたくないですよね。 この記事は、Broken Link Checker 設定方法や使い方をまとめました。 ローカル版 Broken Link Checker を週1（16…
2026.04.11
- UI実装
【簡単】CSSのみでページトップボタンを実装する方法
※当サイトはアフィリエイト広告を使用しています。 ページの一番下まで読み進めた後、「上に戻る」までが遠い。 そんな小さなストレスを一発で解消するのがページトップボタンです。 実装はシンプル。 <body> にアンカーを置き、そこへ内部リンク…
2026.04.11
- UI実装
共通パーツをインクルード化！効率よくコーディングする方法
HTMLの共通パーツのインクルード方法がわからない方 インクルードのメリットとデメリットを知りたい方 JavaScriptを使ったインクルード方法を学びたい方 このような悩みを持つ方にオススメです。 この記事では、HTMLの共通パーツをイン…
2026.04.11
- UI実装
【初心者向け】ハンバーガーメニューの作り方【コピペOK】
ハンバーガーメニューは、スマホサイトではもう定番のナビゲーションです。 でも、実装となると案外やっかいなことが多くて、 ネットで拾ったコードが微妙に動かない 開閉アニメーションがぎこちない キーボード操作やスクリーンリーダーに対応していない…
2026.04.11
- UI実装
【ScrollHint】スクロール可能な要素にヒントを表示するプラグインと使い方を紹介
横スクロールできることをユーザーに伝える方法がわからない ScrollHintの使い方がわからない スクロールヒントの細かな設定方法を知りたい この記事では、スクロール可能な要素にヒントを表示するプラグイン「 ScrollHint 」につい…
2026.04.11