html css js レスポンシブナビゲーションバーの作り方と実装ポイントを徹底解説
スマートフォンやタブレット、パソコンなど、あらゆるデバイスで快適に見られるWebサイトを作るには「レスポンシブデザイン」が欠かせません。特にナビゲーションバー（メニュー）はユーザー体験を大きく左右する
動画・Web制作
html css js 
html css js フレックスボックスレイアウトの基本と実用デザイン例｜HTML&CSSで学ぶレイアウト術
Webページのレイアウトを整えるうえで、CSSのFlexbox（フレックスボックス）は欠かせない存在となっています。従来のfloatやinline-blockに比べて、柔軟で直感的な配置が可能なFle
html css js CSS Gridレイアウトの基本とおしゃれなデザイン例【HTML＆CSS付き解説】
Webデザインの自由度を大きく広げてくれる「CSS Grid」。従来のFlexboxでは実現しにくかった複雑なレイアウトも、Gridを使えばシンプルなコードで実装できます。この記事では、CSS Gri
html css js 3カラムレイアウトの基本とデザイン例｜HTML＆CSSでの実装方法をわかりやすく解説
Webページのレイアウトで定番の一つが「3カラムレイアウト」です。左右にナビゲーションや広告、中央にコンテンツを配置することで、情報を整理して伝えることができるため、ブログやニュースサイト、企業ホーム
html css js 初心者でもできる！2カラムレイアウトの基本と実用デザイン例｜HTML＆CSSで簡単コーディング解説
Webサイトを作るときによく使われるレイアウトの1つに「2カラムレイアウト」があります。左右に分かれたシンプルな構成ながら、情報を整理しやすく、ブログや企業サイトなど幅広く活用されています。この記事で
html css js フッターの基本と美しいデザイン例：HTML＆CSSで作る実用サンプル付き解説
Webサイトの下部に表示される「フッター」は、サイト全体の印象を引き締める大切なパーツです。企業サイトや個人ブログ、ECサイトなど、どのようなジャンルのサイトでもフッターは必ずと言っていいほど設置され
html css js スクロールしても消えない！固定ヘッダーをHTML・CSS・JavaScriptで実装する方法
Webページを閲覧していると、上部にあるナビゲーションバーやロゴなどの「ヘッダー」が、スクロールしても常に画面上部に表示されているサイトをよく見かけます。これは「固定ヘッダー（Sticky Heade
html css js ナビゲーションメニュー（グローバルナビ）の基本とデザイン例・HTML&CSSコード解説
Webページを訪れたユーザーが「どこに何があるのか」を直感的に理解するために欠かせないのが、ナビゲーションメニュー、いわゆる「グローバルナビ」です。サイト全体の構造を示すこのメニューは、使いやすさやデ
photoshop Photoshopの便利な使い方｜知っておくと作業がはかどる小技10選
Photoshopはプロのデザイナーから初心者まで、多くの人が利用する画像編集ソフトです。しかし、多機能なだけに「基本的な操作はできるけど、もっと効率的に使いたい」と感じることも多いのではないでしょう
動画・Web制作 無料 Clipchampでyoutube動画作成
本日は、Microsoftが提供する無料の動画編集ソフト「Clipchamp」を使って動画を作成する方法を紹介します。Clipchampの基本的な使い方Clipchampの使い方は、以下の手順で行いま
illustrator Illustrator 超基礎 パス（ペジェ曲線）の作り方
本日は、Illustratorの超基礎としてパス（ペジェ曲線）の作り方について解説します。私自身もパスについて得意ではなく、自分自身のために記事を作成しています。わからなくなった時に見返して、パスが作
php Laravel3回目 シーダーファイルの作成 多対多,１対多を使用し社員管理システムを作る
本日は、Laravel２回目として、データベースにデータをインポートするために、シーダーファイルを作成します。シーダーとはデータベースにテストデータを一斉に挿入する処理を指します。シーダーファイルを実
動画・Web制作 (フリーソフト) Shotcutの使い方 テキスト（字幕）の追加
前回に引き続き、今回は、Shotcutにテキスト（字幕）の入れ方について説明します。これまで説明した「カット、音の追加、トランジション」と今回のテキストの追加までできれば、簡単なyoutubeの動画は
動画・Web制作 (フリーソフト) Shotcutの使い方 トランジションの追加
前回からの続きで、今回は、「トランジションの追加」を行います。トランジションとは、カット（トラック）とカット（トラック）の間を繋ぐために挟まれる効果（エフェクト）です。 (adsbygoogle =
動画・Web制作 (フリーソフト) Shotcutの使い方 音の追加
前回からの続きで今回は、BGMを追加します。基本的には、タイムラインにドラッグドロップするだけですので、むずかしくないです。 (adsbygoogle = window.adsbygoogle ||
動画・Web制作 (フリーソフト) Shotcutの使い方 映像のカット編集
では、前回の続きからで今回は、Shotcutで映像をカット編集します。前回は、タイムライン上に映像をインポートしたところまでです。今回お伝えするカット方法は、まず映像トラックを分割し、分割されたトラッ
動画・Web制作 (フリーソフト) Shotcutの使い方 起動と映像の取り込み
本日は、Shotcutの起動し、「プロジェクトの作成」、「映像素材の取り込み」、「映像素材をタイムラインに追加」までを解説します。 (adsbygoogle = window.adsbygoogle
動画・Web制作 (フリーソフト) Shotcutの使い方 Shotcutのインストール方法
本日は、オープンソースで無料の動画編集ソフトの「Shotcut」のインストール方法について説明します。youtubeやtiktokなどの利用者が増えたことで動画ソフトを使う機会が増えました。Adobe
php Laravel2回目 テーブルの作成、マイグレーションー多対多,１対多を使用し社員管理システムを作る
本日は、Laravel２回目として、データベースまわりとしてlaravelを使用して、「テーブルの作成」を行います。Laravelの機能としては、マイグレーションという機能になります。テーブルの作成の
php Laravel１回目 多対多,１対多を使用し社員管理システムを作る
こんばんは。本日からLaravelを使用し、簡易的な社員管理システムを作成します。今回作成するシステムを作る目的は、Laravelを速習するためです。あまり細かいことにこだわらず、記事上の通り行えば、