ホームページ作成　ガイド 西村 文宏

Android SDKをインストールしてエミュレータを準備

Androidスマートフォンのエミュレータを使うためには、「Android SDK Tools」のインストールが必要です。そのためには、事前に「JDK」のインストールも必要です。「Android SDK Tools」を使うための準備から、セットアップ完了までの手順を、豊富な画面イメージと共に解説しています。

画像にマウスを載せた際に、半透明の説明を重ねる方法

画像の上にマウスを載せたときにだけ、半透明の説明文(キャプション)が、アニメーション効果と共に下方からスライドして表示される、という表示効果の作り方をご紹介。jQueryを使って簡単に作れます。写真をたくさん並べて掲載するようなページで、デザイン面でちょっと凝ったことをしてみたい場合にお勧めです。

表の特定の列だけを抜粋して表示できるようにする方法

ウェブ上に掲載している表組み(テーブル)でも、閲覧者が列の「表示・非表示」を切り替えられるようにしてみましょう。不要な列を非表示にできると、列数の多い表でも列幅が狭くなりすぎるのを防げ、見やすさを維持できます。

幅が狭い画面では表を展開！ stacktable.jsの使い方

横長のtableを、狭い画面でも見やすく自動展開してくれる「stacktable.js」の使い方を解説。ページを様々な画面サイズに対応させたい際に困るのが「横長の表」の扱いです。狭い画面だと、列幅が極端に狭くなって読みにくくなります。そこで便利なのが「stacktable.js」スクリプト。指定サイズより狭い画面では、表を行単位で展開(分解)してくれます。

ログインページに他人がアクセスするのを拒否する方法

CMSツールなどのログインページには、通常は誰でもアクセスできます。ウェブサーバのアクセス制限機能を使って「自分や関係者以外からのアクセスを拒否する」方法をご紹介。不正ログインの可能性を減らす方策の1つになります。

SNSでの言及時に望みの情報や画像を出すOGPの記述方法

FacebookなどのSNSで、投稿欄にURLを記述すると、当該サイトの情報(ページタイトル・概要文・サムネイル画像など)が読み込まれて表示されます。これらの情報はページ内から自動的に抜き出されますが、「OGP (Open Graph Protocol)」という記述をHTMLに含めておくと、それらの内容を自分で指定できます。OGPの簡単な書き方をご紹介。

IE6～8でも一部のCSS3が使える！「CSS3 PIE」の使い方

IE6～8でも一部のCSS3プロパティが表示可能になる「CSS3 PIE」をご紹介。この「CSS3 PIE」を使えば、すべてのIE6～8ユーザに対して（一部の）CSS3プロパティを使ったデザインを見せることができます。ボックスの角を丸くしたり、ボックスに影を付けたり、背景色に透明度を付加したりするなど、CSS3で実現できるデザインを活用しているなら、それらを古いIEでも表示可能にしてみましょう。

SigilでウェブサイトをEPUB化して電子書籍にする方法

電子書籍のフォーマットとして広く利用されている「EPUB」ファイルを作成できるフリーソフト「Sigil」を使って、自身のウェブサイトをEPUB形式にまとめて電子書籍化する方法を解説。

SyntaxHighlighterでソースを読みやすく掲載する方法

HTML、CSS、JavaScript、PHPなど様々な言語のソースをウェブ上に掲載する際、綺麗に読みやすく表示してくれる「SyntaxHighlighter」の設置方法・使い方をご紹介。ソース部分だけを一括コピーしやすくする機能もあり、便利です。

CSSの「疑似要素」の書き方 再入門（CSS3対応版）

スタイルの適用先を指定する「セレクタ」には、「疑似要素」という特殊な書き方も用意されています。要素名やclass名を指定するだけでは実現できない「特殊な箇所」に限定して、スタイルを適用できます。