ホームページ作成 人気記事ランキング

Microsoft製のホームページ作成ソフト「Microsoft Expression Web 4」が開発終了に伴って無料公開されています。HTMLやCSSだけでなくJavaScriptやPHPも含めたソース補完機能、入力支援機能、文法チェック機能などを備えた、統合ホームページ作成フリーソフトです。この機会に使ってみてはいかがでしょうか。Windows10でも動作し、HTML5で記述することもできます。日本語版のインストール方法と各種機能をご紹介いたします。

HTML＋CSSだけで、表示領域の横幅に合わせて画像サイズを変化させる方法を解説。レスポンシブWebデザインを採用したページや、画面サイズに合わせて自動で画像を(縦横比を維持したまま)拡大縮小させたい場合に活用できます。HTMLのimg要素で画像を掲載し、CSSを使って画像サイズが自動で画面サイズに合うようにするだけの簡単な書き方をご紹介。

HTMLにスタイルシート(CSS)を適用する方法には、class属性を使う方法と、id属性を使う方法があります。この「class」と「id」は明確に役割が異なります。全部にclass属性を使っている場合は問題ありませんが、全部にid属性を使っている場合は問題がある可能性があります。classとidの違いと、使い分け方法をご紹介いたします。

ホームページを別のURLへ移転した際に便利な、指定したページへ自動的に移動(リダイレクト)させる方法を解説。すぐに自動転送するほか、旧サイトの全ページに同じ「新しいホームページへの引っ越し案内」を一括表示する方法も説明。.htaccess・HTML・JavaScriptの3通りでリダイレクトする書き方を紹介しています。

メインメニュー項目の上にマウスポインタを載せると、下方向にサブメニューが展開するドロップダウンメニューの作り方をご紹介。JavaScriptは不要です。HTML＋CSSだけでドロップダウン機能を作る方法を解説。サブメニュー項目からさらに孫メニューを右側に出すなど、3段階以上のドロップダウンメニューも簡単に作れます。

ブックマークのアイコンやタブのアイコンとして、ウェブサイト独自の画像を設定・表示する方法を解説。PC用ブラウザのタブやアドレスバー、スマホ用ブラウザのブックマークやホーム画面などに自作のアイコン画像を表示させてみましょう。favicon.icoやapple-touch-icon.pngなどのファイルを作成し、短いHTMLを書くだけの簡単な手順で独自アイコンを設定できます。

ウェブサイト上に「.htaccess」という特殊な設定ファイルを設置すると、アクセス制限・ユーザー認証・リダイレクト(自動転送)・エラーページのカスタマイズ・デフォルトファイル名の変更など、特殊な設定が実現できます。「.htaccess」の書き方(作り方)と設置方法をご紹介。テキストエディタで簡単に作成できます。設置した結果としてInternal Server Errorが出てしまう場合の対処方法なども解説。

複数の画像が数秒間隔でフェイドアウト・フェイドインを繰り返す「ふわっと表示が切り替わる」効果のあるスライドショーをWeb上で作る方法を解説。画像を掲載する短いHTMLに、配置と重なり順序を調整するCSSを加え、jQueryでスライドショーを制御することで簡単に作れます。画像はリンクにもできるため、クリックすると詳細ページへ飛ぶスライドショーを作ることもでき、シンプルながら活用範囲の広いスライドショーになります。

PC用サイトにアクセスしてきたスマートフォン利用者を自動的にスマホ用サイトへ誘導できるように、アクセス者の端末(PC/SP)に応じて閲覧先を自動で切り替える機能の作り方をご紹介。閲覧者のユーザエージェント名(ブラウザや機種名)を判別し、「.htaccess」のmod_rewriteを使ってアクセス先を自動振り分けすることで、スマートフォンユーザだけをリダイレクトする方法を解説。

HTMLに数行のJavaScriptを加えるだけでパスワードによる認証機能を作る方法を解説。「ウェブサイト上でパスワード付きのアクセス制限を設定したい、でもBasic認証やCGIを使う複雑なことはしたくない」という場合には、JavaScriptを使った手軽なログイン認証機能を使ってはいかがでしょうか。完全な制限にはならない分、とても簡単にホームページの閲覧制限ができます。