携帯・スマートフォンサイト作成入門

(注)本記事の解説は、ガラケーサイトの作成方法です。本記事は、ガラケー(フィーチャーフォン)端末向けのウェブサイトを作成する方法の解説です。スマートフォン端末向けのウェブサイトの作成方法ではありませんのでご注意下さい。スマートフォン向けモバイルサイトの作成方法に関しては、下記の記事などをご参照下さい...続きを読む

携帯電話などから閲覧できる「携帯サイト」を作る記事の第2弾です。前回の記事「携帯サイトの作り方第1回作成方法の基礎」では、携帯サイトとして機能する基礎（XHTMLの書き方・各社端末共通の装飾方法・基本的な記述方法）をご紹介いたしました。今回は、携帯端末ならではのリンクの作り方と、リンクの装飾方法につ...続きを読む

▲携帯電話の絵文字の例（ｉモード）携帯電話などから閲覧できる「携帯サイト」を作る記事の第3弾です。今回は、絵文字の表示（入力）方法をご紹介致します。最初の記事「携帯サイトの作り方第1回作成方法の基礎」では、携帯サイトとして機能する基礎的な記述方法をご紹介いたしました。前回の記事「携帯サイトの作り方第...続きを読む

携帯端末のエミュレータを使って表示確認携帯端末向けのウェブサイトを作成した場合、実際の携帯端末でどう見えるのかのチェックが必要ですね。表示確認には実機（本物の携帯電話など）を使うのが確実ですが、あらゆるキャリアの実機を用意するのは費用がかかりますし、1台だけを使うにしても通信費が必要です。そこで、実...続きを読む

ホームページのスマホ対応は、もはや必須画面の幅が狭くても閲覧でき、リンクをタップしやすいスマホ用サイトの作成例スマホやタブレットなどのモバイル端末は、PCを追い越す勢いでどんどん普及しています(※1)。そろそろ自身のWebサイトもスマホ対応にしなければ……と考えている方々も多いでしょう。もはやWeb...続きを読む

スマートフォンエミュレータAndroidスマートフォンのエミュレータを使うためには、「AndroidSDKTools」をインストールする必要があります。その「AndroidSDKTools」を動かすためには、「JDK(JavaDevelopmentKit)」が必要です。ここでは、それらのダウンロード...続きを読む

スマートフォンでも表示確認がしたいAndroidエミュレータ上のブラウザで閲覧した、スマートフォン版AllAbout最近はスマートフォンを使ってウェブサイトを閲覧するユーザも増えてきました。自分の運営しているウェブサイトが、スマートフォンでもうまく表示されるのかどうかを確認したいと思う方々も多いこと...続きを読む

リンクをCSSで「ボタン型」に装飾スマートフォンは、主に指で画面に触れて操作します。リンクを大きめの「ボタン型」に装飾しておくと、指で押しやすいリンクになるでしょう。例えば、右図のようにです。これは、「ボタンに見える」よう装飾しただけで、リンクそのものは（普通のリンクと同様に）HTMLの「a要素」で...続きを読む

入力フォームのあるウェブページが、スマートフォンやタブレット端末で閲覧される場合も考慮して、それらの端末でも使いやすいテキスト入力欄を作ってみましょう。大きく改修しなくても、ほんの少しの記述で使いやすい入力欄になります。type属性値でテキスト入力内容の種類を限定するスマートフォンでは、画面上に表示...続きを読む

ウェブサイトのスマートフォン対応方法をどうするかPCとスマートフォンでは画面サイズが大きく異なるスマートフォンは、PC用に作られたウェブサイトでも表示できます。しかし画面サイズが小さいため、そのままの状態では読みにくい可能性があります。その場合の対策としては、レスポンシブWebデザインを採用するスマ...続きを読む