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

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

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

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

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

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

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

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

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

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

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