携帯アフィリエイトサイト作成

携帯サイト作成基礎講座

レンタルサーバー

お気に入りに追加

携帯サイト作成基礎講座

当サイトについて

携帯サイト作成基礎講座

当サイトは、携帯サイトの作り方や携帯電話を使って稼ぐ方法を説明しております。

2005年より運営。おかげ様で5周年を迎えることができました。

無断転用・転載、二次使用などは固く禁止します

サイト内容

最新記事

全記事表示リンク

スポンサーサイト

--年--月--日(--)

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

これが私のネット収入です。

2006年05月17日(水)

アフィリエイトって稼げるって聞いたのに

全然稼げないじゃん!



アフィリエイトを始めてから

半年ぐらいの私の感想でした。


好きなものを買うのも我慢して、

情報商材を買い漁っても、

まったく成果が挙がりませんでした。


実際、自暴自棄になって、アフィリエイトを

やめていた時期もあります。


ところが、あるときからゆっくりとですが、

アフィリエイトで稼げるようになってきました。

初売上



これが初めてアフィリエイトで成果が挙がった瞬間です(笑


それからというもの、アフィリエイト報酬が、

月に一万円以下ということはありません。


インフォカート(3月分)


3月のアフィリエイト報酬、16890円!


インフォカート(4月分)


4月のアフィリエイト報酬、24668円!


インフォカート(5月分)


5月のアフィリエイト報酬、26903円!(5月17日現在)






一番最初に成果が挙がったとき、私がやったのは、

とても簡単なことです。


鹿島潤さんのメルマガに書かれていることを

実践しただけのことです。


嘘に決まっている! と言われるかもしれませんが、

事実です。


これを実践し、成果が挙がったことによって、

鹿島さんにメールをするきっかけが作れました。


○インフォカートに登録していない人はこちら
  http://www.infocart.jp/

スポンサーサイト

タグ :

未分類 | PAGE TOP↑

スクロールエリアに背景色をつける

2006年05月12日(金)

スクロールエリアに背景色をつけるには、

<MARQUEE BGCOLOR="色">文字列</MARQUEE>と記述します。

なお、色は「色・配置の変更」を参照してください。

"blue"と記述しました。

"red"と記述しました。

"yellow"と記述しました。






携帯サイト作成~中級編~

タグ :

未分類 | PAGE TOP↑

スクロールの繰り返し回数を指定する

2006年05月12日(金)

スクロールを繰り返し行う場合は、

<MARQUEE LOOP="回数">文字列</MARQUEE>と記述します。

例えば<MARQUEE LOOP="10">文字列</MARQUEE>と記述すれば
文字列が10回スクロールします。


・見本


↓5と記述してあるものが流れています。
(表示されていない場合、すでにスクロール回数を終えています。
お手数ですが、再度このページを開きなおしてください)
"3"と記述しています。

↓10と記述してあるものが流れています。
(表示されていない場合、すでにスクロール回数を終えています。
お手数ですが、再度このページを開きなおしてください)
"10"と記述しています。






携帯サイト作成~中級編~

タグ :

未分類 | PAGE TOP↑

文字をスクロールさせる

2006年05月12日(金)

文字を右から左にスクロールさせるには、

<MARQUEE DIRECTION="RIGHT">文字列</MARQUEE>
と記述します。

ちなみに左から右にスクロールさせるには"RIGHT"を"LEFT"と変更します。
下から上は"UP"、上から下は"DOWN"と記述します。

・見本

"right"と記述しています。右に流れます

"left"と記述しています。左に流れます






携帯サイト作成~中級編~

タグ :

未分類 | PAGE TOP↑

2006年05月03日(水)

よくある質問疑問



Q1. 携帯サイトって、パソコンで作れないの?

A1. 携帯サイトはパソコンでも作ることができます。

    なので、移動中は携帯電話で、家ではパソコンで作業することができます。




Q2. 私はパソコンでブログすらも作ったことがありません。
      そんな私でも携帯サイトを作ることができるでしょうか?

A2. できます。というのも、携帯サイトは非常にシンプルだからです。

    大抵の無料レンタルスペースでは、作成の手引きが
    ありますので、今までブログとかやったことがない
    人でも、すぐに作れるようになると思います。

    それでも不安という場合は、こちらを使うのを
    オススメします。




 「こんな質問があるんだけど」という人は、気軽にメールしてください。
 お答えできる範囲でお答えします。

 ※回答はサイト上に掲載させていただきます。
  あらかじめご了承ください。

















































































タグ :

未分類 | PAGE TOP↑

初心者がゼロから学んで1日で作れる! 【完全図解】携帯サイト開設マニュアル(18種類のテンプレート付)

2006年05月02日(火)

携帯サイトは誰でも簡単に作れます。


慣れれば一時間程度で一つのサイトを作ることが出来ます。


ブログだと、二日三日かかってようやく形になります。

そのことを考えると、いかに携帯サイトが簡単に作れるか分かると思います。


しかし、作り方が分かっていても多少時間がかかるのは事実です。

とくに、慣れないうちは2,3時間かけても完成しないときもあります(場合によっては、途中で断念してしまうことも…)


初心者がゼロから学んで1日で作れる!【完全図解】携帯サイト開設マニュアル(18種類のテンプレート付) を使えば、そういった問題はなくなります。


このノウハウには、すぐに使える18種類のテンプレートがついています。

さらに、サポートもバッチリですから、初心者でも携帯サイトを簡単に作ることが出来ます。


このノウハウの肝は、すでに稼いでいるアフィリエイターも参加しているサポートフォーラムです。


ここでは、ノウハウを得られることはもちろんのこと、自分と同じ初心者の人も大勢いるので、励みになります。

基本的にネットは孤独です。


このフォーラムを使えば、その不安から解消されると思います。


初心者がゼロから学んで1日で作れる!
【完全図解】携帯サイト開設マニュアル(18種類のテンプレート付)

(無料レポート有り/~モバイルの時代はもう来ている・PCより簡単~
「携帯サイト スタートマニュアル(初級編)」)


ノウハウ内容

1.はじめに
● これからあなたがやることは


2. 携帯サイトの基礎知識
● 携帯サイトは携帯でみよう
 ▽ 携帯用検索エンジン
 ▽ ランキングサイト
● 3キャリアについて


3.サイトの開設準備
● 準備するもの
 1【図解】ドメインの取得
 2【図解】レンタルサーバーの準備
 3【図解】○○フォルダの準備
● FTPソフトの準備
 1【図解】FTPソフトのダウンロード
 2【図解】ソフトのインストール
 3【図解】FTPソフトの初期設定
● アフィリエイト登録
 1【図解】アフィリエイト登録


4.サイト作成の準備と基礎知識
● サイト作成での注意点
● 基本はHTML
● パソコンの設定


5.サイトの作成
● テンプレートの確認
●【図解】○○サイトの作成


6.サイトの開設
●【図解】ファイルのアップロード
● 携帯電話で見てみる


7.アクセスアップ
● 検索エンジンへの登録
● ランキングサイトへの登録


8.活用編
●【図解】アクセス解析の設定
● ○○○プログラムの活用
●【図解】○○○の設置
● ちゃんと動くか確認してみましょう。
● 携帯用○○○○
● ○○のサイトを運営する


9.最後に


10.おまけ


特典

特典1.18種類のテンプレート付き
特典2.安心のサポートフォーラム付き
特典3.パソコン基礎小冊子4点
特典4.今後の追加情報・追加ノウハウ提供

http://www.1ibp.com/

タグ :

未分類 | PAGE TOP↑

携帯ノウハウの現状

2006年05月02日(火)

に去年の半ば頃から、携帯は稼げる! と騒がれるようになりました。


そのブームに乗って、携帯で稼ぐためのノウハウ、つまり情報商材を出す人が急増しました。


しかし、それらのほとんどは稼げない、あるいは完全な嘘情報がほとんどでした。


何も知らない人からお金をせしめようと考える輩が多数表れたというわけです。


それらは、値段に見合わないものばかりで、到底売り文句から見られる成果は挙げられるものではありませんでした。



拡声器,携帯ウソ,携帯


しかし、現在では少しずつですが、本物のノウハウが登場するようになってきました。


パソコンスクールの講師を務める羽根田さんの初心者がゼロから学んで1日で作れる!
【完全図解】携帯サイト開設マニュアル(18種類のテンプレート付)
やモバイル広告会社代表である鬼塚さんのアムゼ携帯アフィリエイター育成講座 などその代表格といえます。


これらは、実践すれば相応の成果が挙げられます。


現に、これらノウハウを購入、実践した人の中から月に10万円、100万円と、携帯だけで稼ぐようになりました。



このサイトで紹介しているものは、基本的に実際に成果が挙がるものを紹介しています。



ただし、以下の方は購入をご遠慮ください。

注意





チェックマーク買うだけで稼げると思っている人。

チェックマーク分からないことがあったからといってすぐにあきらめる人。

チェックマーク買って稼げるかどうか不安に思っている人。

チェックマーク根本的に、稼げるかどうか疑っている人。

チェックマーク時間がない! 自分は初心者だからできない! と、とにかく言い訳を並べる人。

チェックマークこのサイトで紹介されているから購入したが、結局稼げなかった! とクレームをつける人。

チェックマーク実践しないで、自分に合わなかった! という人。

チェックマーク買ったのはいいが、自分が知っている内容だったと文句を言う人。




クレームなどは一切受け付けません。


ご購入の最終判断はご自身でお願いします。



※サイトで紹介している情報商材の詳細は、順次アップしていきます。

携帯,Eブック

携帯サイト作成
 | 
 |_初心者がゼロから学んで1日で作れる!
【完全図解】携帯サイト開設マニュアル(18種類のテンプレート付)

詳しくはこちら





携帯アフィリエイト
 | 
 |_アムゼ携帯アフィリエイター育成講座 NEW 1
 | 
 |_危険物に付き取り扱い注意!! ランキング上位にはいらなくても爆発的な集客を実現!
詳しくはこちらNEW 1




携帯オークション
 |
 |_無限に広がる携帯市場の先駆者に送る 携帯オークションパーフェクトマニュアル
 |
 |_1週間で元が取れて、あとは稼ぎ放題!月に127万円稼いだ携帯オークション必勝攻略方法!!

タグ :

未分類 | PAGE TOP↑

携帯関連ノウハウ

無料ホームページレンタルスペース

2006年05月02日(火)


レンタルサーバー

ポケットストリート

誰でも簡単に作れ、掲示板、チャット、日記など機能も充実しています。




ふりーぺ

初心者でも安心して使えるサイトです。自動的に挿入される宣伝が少なく使い方も簡単です。




ハムスター島

こちらもかなり使い易いです。ただし、imode/jskyのみ対応。




@peps!

写メール対応掲示板、チャット、日記など機能も充実。




FC2

無料のカウンター、アクセス解析など色々と機能が充実。




KTNET

100MBと大容量のホームページスペース。広告は上部と下部の2ヶ所に入る。CGI不可。FTP使用可。




ポケットスペース

カメラ付携帯の画像をアップできる。ひとつのメールアドレスでいくつでもホームページを作成できる。

タグ :

未分類 | PAGE TOP↑

携帯サイト作成~中級編~

優良携帯ASP モビル

2006年05月02日(火)

携帯アフィリエイト「モビル」
モビル


●振込み日

毎月末締めで計算し、翌々月末までに指定の口座に支払い。


●最低支払額

5,000円。
報酬額が5,000円に達しない場合は次月へ持ち越し。




◆特徴1


高単価の成果報酬型広告がそろっています。

同じ広告を載せるなら、こちらのASPを利用するほうが絶対にいいです。



◆特徴2

「もびぶろ」にてあなたのサイトを紹介してくれます。

「アクセス数がなかなか上がらない!」という悩みを解決してくれるはず。

また、「サイトの作り方がわからない!!」という初心者の方にも他のアフィリエイターがどのようにサイトを作っているかを知ることができて効果的です。


◆特徴3

登録してすぐに広告を貼ることができるようになります。


◆特徴4

複数サイト登録ができます。


◆欠点

若干サイトが表示されるのが遅いです。

広告の表示などに時間がかかります。


●モビルの登録はこちらからすることができます。

携帯アフィリエイト「モビル」
モビル





その他のASP

モバハチnet














タグ :

未分類 | PAGE TOP↑

優良携帯ASP モバハチネット

2006年05月02日(火)

Moba8.net


●振込み日

成功報酬の振込予定日は毎月15日。
(金融機関が休日の場合は翌営業日)

●最低支払額

5,000円。
報酬額が5,000円に達しない場合は次月へ持ち越し。




◆特徴

日本最大手のASP、A8netの携帯版。

A8net同様、かなりのパフォーマンスが期待できる。


◆欠点

開設してまだ数ヶ月しか経っていないため、広告数が他のASPと比べると圧倒的に少ない。

しかし、A8netや急速に広告数が増えていることを考えると、今から登録しておいて損はないと思います。


●モバハチネットの登録はこちらからすることができます。

Moba8.net
モバハチ





その他のオススメASP

モビル

文字の位置を変える

2006年05月02日(火)

<div align=center>、<div align=center>タグを使います。

もしくは<center>センタータグ、<right>ライトタグ(このタグはiモードとEz-Webのみ対応。vodafoneは未対応)


文字は通常は左に揃っているのですが、位置を変えるときにこのタグを使います。


たとえば、中央に揃えたいときは、


<div align=center>中央ぞろえ</div>
or
<center>中央ぞろえ</center>


このように書けば中央に表示されます。


こんな感じ



右寄せの場合、

<div align=right>右寄せ</div>
<right>右寄せ</right>

このように表記すると、右寄りに表示されます。

こんな感じ


タグは必ず</div>(<center>を使用した場合は</center>、
<right>を使用した場合、</right>)で閉じてください。


携帯サイト作成~初級編~TOP






携帯サイトの超基本的なHTML


タイトルを書き込む


タイトルの表示


色・配置の変更


内容の記述


文字の位置を変える

 
リンクの貼り方


よく使うタグ集

タグ :

未分類 | PAGE TOP↑

内容の記述

2006年05月02日(火)

では、いよいよホームページの内容を記述です。





まず、本文は<body><div id="sh_fc2blogheadbar"> <div class="sh_fc2blogheadbar_body"> <div id="sh_fc2blogheadbar_menu"> <a href="https://blog.fc2.com/" rel="nofollow"> <img src="//static.fc2.com/image/headbar/sh_fc2blogheadbar_logo.png" alt="FC2ブログ" /> </a> </div> <div id="sh_fc2blogheadbar_search"> <form name="barForm" method="get" action="" target="blank"> <input class="sh_fc2blogheadbar_searchform" type="text" name="q" value="" maxlength="30" onclick="this.style.color='#000000';" onfocus="this.select();" onblur="this.style.color='#999999'" /> <input type="hidden" name="charset" value="utf-8" /> <input class="sh_fc2blogheadbar_searchbtn" type="submit" value="ブログ内検索" /> </form> </div> <div id="sh_fc2blogheadbar_link_box" class="sh_fc2blogheadbar_link" style="visibility: hidden;"></div> </div> </div> と <!-- passive:ad:171 --> <div id="fc2_bottom_bnr" style="position:fixed;z-index:10000;left:0;bottom:0;width:100%;display:block;filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#70000000,EndColorStr=#70000000);background:rgba(0,0,0,0.7);"><div id="fc2_bottom_bnr_img" style="display:block;width:728px;height:94px;margin:0px auto;padding:10px 0px 14px;"><iframe src='//assys01.fc2.com/1346' style='width:728px;height:90px;border:none;' scrolling='no'></iframe><!-- FC2管理用 --><img src="//media.fc2.com/counter_img.php?id=1505" width="1" height="1"><!-- FC2管理用 --><div style="color:#C0C0C0;text-align:center;font-size:9px;margin:0px;padding:2px 0px 0px;">上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。</div></div><span id="fc2_bottom_bnr_close" style="cursor:pointer;display:block;position:absolute;padding:5px;top:0;right:0;width:20px;height:20px;opacity:0.8;max-width:100%;max-height:100%;"><img src="//blog-imgs-61.fc2.com/t/e/s/test0006/fc2_bottom_bnr_close.png" width="20" height="20" style="border:none;width:20px;height:20px;max-width: 100%;" /></span></div> <script type="text/javascript">(function(w, d) {var area = d.getElementById('fc2_bottom_bnr'),areaStyle = area.style;var getScrollMax = function() { return d.documentElement.getBoundingClientRect().height - w.innerHeight; };var getScrollCurrent = function() { return d.documentElement.scrollTop || d.body.scrollTop; };var overlayPosition = function() {if (getScrollMax() > getScrollCurrent()) {areaStyle.bottom = 0;areaStyle.top = 'auto';} else {areaStyle.bottom = 'auto';areaStyle.top = 0;}};var closeBtn = d.getElementById('fc2_bottom_bnr_close'),close = function() { area.style.display = 'none'; };if (w.addEventListener) {w.addEventListener('resize', overlayPosition, false);w.addEventListener('scroll', overlayPosition, false);closeBtn.addEventListener('click', close, false);} else {w.attachEvent('onresize', overlayPosition);w.attachEvent('onscroll', overlayPosition);closeBtn.attachEvent('onclick', close);}})(window, document);</script> </body>の間に記述します。

ここに記述された内容がそのままWebブラウザに表示されます。

上の例ではホームページタイトルの
「携帯サイト作成基礎マニュアル」の記述が
<body><div id="sh_fc2blogheadbar"> <div class="sh_fc2blogheadbar_body"> <div id="sh_fc2blogheadbar_menu"> <a href="https://blog.fc2.com/" rel="nofollow"> <img src="//static.fc2.com/image/headbar/sh_fc2blogheadbar_logo.png" alt="FC2ブログ" /> </a> </div> <div id="sh_fc2blogheadbar_search"> <form name="barForm" method="get" action="" target="blank"> <input class="sh_fc2blogheadbar_searchform" type="text" name="q" value="" maxlength="30" onclick="this.style.color='#000000';" onfocus="this.select();" onblur="this.style.color='#999999'" /> <input type="hidden" name="charset" value="utf-8" /> <input class="sh_fc2blogheadbar_searchbtn" type="submit" value="ブログ内検索" /> </form> </div> <div id="sh_fc2blogheadbar_link_box" class="sh_fc2blogheadbar_link" style="visibility: hidden;"></div> </div> </div> の直後にあるのでその次に(</p>の直後)記述されている
「<B>この内容が本文として表示されます。</B><BR>」からが本文の記述になります。
本文は<body><div id="sh_fc2blogheadbar"> <div class="sh_fc2blogheadbar_body"> <div id="sh_fc2blogheadbar_menu"> <a href="https://blog.fc2.com/" rel="nofollow"> <img src="//static.fc2.com/image/headbar/sh_fc2blogheadbar_logo.png" alt="FC2ブログ" /> </a> </div> <div id="sh_fc2blogheadbar_search"> <form name="barForm" method="get" action="" target="blank"> <input class="sh_fc2blogheadbar_searchform" type="text" name="q" value="" maxlength="30" onclick="this.style.color='#000000';" onfocus="this.select();" onblur="this.style.color='#999999'" /> <input type="hidden" name="charset" value="utf-8" /> <input class="sh_fc2blogheadbar_searchbtn" type="submit" value="ブログ内検索" /> </form> </div> <div id="sh_fc2blogheadbar_link_box" class="sh_fc2blogheadbar_link" style="visibility: hidden;"></div> </div> </div> と <!-- passive:ad:171 --> <div id="fc2_bottom_bnr" style="position:fixed;z-index:10000;left:0;bottom:0;width:100%;display:block;filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#70000000,EndColorStr=#70000000);background:rgba(0,0,0,0.7);"><div id="fc2_bottom_bnr_img" style="display:block;width:728px;height:94px;margin:0px auto;padding:10px 0px 14px;"><iframe src='//assys01.fc2.com/1346' style='width:728px;height:90px;border:none;' scrolling='no'></iframe><!-- FC2管理用 --><img src="//media.fc2.com/counter_img.php?id=1505" width="1" height="1"><!-- FC2管理用 --><div style="color:#C0C0C0;text-align:center;font-size:9px;margin:0px;padding:2px 0px 0px;">上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。</div></div><span id="fc2_bottom_bnr_close" style="cursor:pointer;display:block;position:absolute;padding:5px;top:0;right:0;width:20px;height:20px;opacity:0.8;max-width:100%;max-height:100%;"><img src="//blog-imgs-61.fc2.com/t/e/s/test0006/fc2_bottom_bnr_close.png" width="20" height="20" style="border:none;width:20px;height:20px;max-width: 100%;" /></span></div> <script type="text/javascript">(function(w, d) {var area = d.getElementById('fc2_bottom_bnr'),areaStyle = area.style;var getScrollMax = function() { return d.documentElement.getBoundingClientRect().height - w.innerHeight; };var getScrollCurrent = function() { return d.documentElement.scrollTop || d.body.scrollTop; };var overlayPosition = function() {if (getScrollMax() > getScrollCurrent()) {areaStyle.bottom = 0;areaStyle.top = 'auto';} else {areaStyle.bottom = 'auto';areaStyle.top = 0;}};var closeBtn = d.getElementById('fc2_bottom_bnr_close'),close = function() { area.style.display = 'none'; };if (w.addEventListener) {w.addEventListener('resize', overlayPosition, false);w.addEventListener('scroll', overlayPosition, false);closeBtn.addEventListener('click', close, false);} else {w.attachEvent('onresize', overlayPosition);w.attachEvent('onscroll', overlayPosition);closeBtn.attachEvent('onclick', close);}})(window, document);</script> </body>の間に記述すればいいだけですから
特に難しくはないと思います。

なお、上の記述には<B>~</B>と<BR>という二つのタグが
新たに出て来ていますが、これは前者が太字、後者が改行のタグです。

詳しくは次のセクションで説明します。


携帯サイト作成~初級編~TOP






携帯サイトの超基本的なHTML


タイトルを書き込む


タイトルの表示


色・配置の変更


内容の記述


文字の位置を変える

 
リンクの貼り方


よく使うタグ集

タグ :

未分類 | PAGE TOP↑

色・配置の変更

2006年05月02日(火)

いよいよ本格的にホームページを装飾していきます。

ここでは文字(テーブル)の中央揃え、背景色の設定と文字色の設定の仕方を説明します。






まず、文字(テーブル)の中央揃えですが、これは
中央揃えにしたい部分を<P align="Center">と</P>で挟みます。

ここではホームページタイトルを中央揃えにしたいので
<TABLE BORDER="1">~</TABLE>までを<P align="Center">と</P>で挟んでいます。

次に背景色の設定ですが、これは<TDの後ろに「BGCOLOR="色"」を入力し、>で閉じます。上の例では色を"yellow"="黄色"にしています。

最後に文字色の設定ですが、上の例では「携帯サイト作成基礎マニュアル」を青色にしています。

文字色を変えたい場合には、色を変えたい文字を<FONT COLOR="色">と</FONT>で挟みます。

上の例の場合、<FONT COLOR="blue">携帯サイト作成基礎マニュアル</FONT>としています。

文字は

携帯サイト作成基礎マニュアル

こんな感じになります。



参考として、代表的な色をいくつかあげときます
白色="white" 銀色="silver" 茶色="maroon" 緑色="green"
黄色="yellow" 灰色="gray" 水色="aqua" 青色="blue"
ピンク="fuchsia" オリーブ"olive" 黄緑="lime" 深い青="navy"
赤色="red" 紫色="purple" 薄い青="teal" 黒色="black"



携帯サイト作成~初級編~TOP






携帯サイトの超基本的なHTML


タイトルを書き込む


タイトルの表示


色・配置の変更


内容の記述


文字の位置を変える

 
リンクの貼り方


よく使うタグ集

タグ :

未分類 | PAGE TOP↑

携帯ならではのアクセスキー

2006年05月02日(火)

携帯電話でのサイト・ホームページ観覧にアクセスキーというものがあります。


これは携帯サイト観覧限定なのですが、メニュー部分などに使うと、訪問者が各ページアクセスしやすいという利点があります。


使い方はいたって簡単。


例えば、<A href="~/uranai.html">コンテンツ</A> という
HTMLがあるとします。


これを、

<A href="~/uranai.html" ACCESSKEY="1">コンテンツ</A>

という風に数字で指定します。

この場合は1で指定しました。


これは、携帯サイトを観覧しているときに『コンテンツ』をクリックしても『数字の1』を携帯のボタンで押してもリンクにアクセスできるというものです。


携帯サイトをよく閲覧する人はこれをよく使う人もいるので、利用するのもいいかもしれません。

リンクの左に数字を付けてHTMLで上記のように記述すれば設定できます。


携帯サイト作成~中級編~/TOP

タグ :

未分類 | PAGE TOP↑

携帯サイトの超基本的なHTML

2006年05月02日(火)

HTMLの大まかな構造は以下のようになっています。








まず、HTMLタグは<HTML>から始まって<script type="text/javascript" src="https://static.fc2.com/js/blog/headbar_ad_load.js?genre=44&20141111" charset="utf-8"></script> <script type="text/javascript" src="https://static.fc2.com/js/blog/ad_ref.js?20121115"></script> </html>で終わります。

<HTML><script type="text/javascript" src="https://static.fc2.com/js/blog/headbar_ad_load.js?genre=44&20141111" charset="utf-8"></script> <script type="text/javascript" src="https://static.fc2.com/js/blog/ad_ref.js?20121115"></script> </html>の間に記述した内容がWebブラウザ
(インターネットをみる画面)に表示されます。
<HEAD>と<link href="https://static.fc2.com/css_cn/common/headbar/120710style.css" rel="stylesheet" type="text/css" media="all" /> </head>の間にはページタイトルなどの
情報を入力します。

<body><div id="sh_fc2blogheadbar"> <div class="sh_fc2blogheadbar_body"> <div id="sh_fc2blogheadbar_menu"> <a href="https://blog.fc2.com/" rel="nofollow"> <img src="//static.fc2.com/image/headbar/sh_fc2blogheadbar_logo.png" alt="FC2ブログ" /> </a> </div> <div id="sh_fc2blogheadbar_search"> <form name="barForm" method="get" action="" target="blank"> <input class="sh_fc2blogheadbar_searchform" type="text" name="q" value="" maxlength="30" onclick="this.style.color='#000000';" onfocus="this.select();" onblur="this.style.color='#999999'" /> <input type="hidden" name="charset" value="utf-8" /> <input class="sh_fc2blogheadbar_searchbtn" type="submit" value="ブログ内検索" /> </form> </div> <div id="sh_fc2blogheadbar_link_box" class="sh_fc2blogheadbar_link" style="visibility: hidden;"></div> </div> </div> と <!-- passive:ad:171 --> <div id="fc2_bottom_bnr" style="position:fixed;z-index:10000;left:0;bottom:0;width:100%;display:block;filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#70000000,EndColorStr=#70000000);background:rgba(0,0,0,0.7);"><div id="fc2_bottom_bnr_img" style="display:block;width:728px;height:94px;margin:0px auto;padding:10px 0px 14px;"><iframe src='//assys01.fc2.com/1346' style='width:728px;height:90px;border:none;' scrolling='no'></iframe><!-- FC2管理用 --><img src="//media.fc2.com/counter_img.php?id=1505" width="1" height="1"><!-- FC2管理用 --><div style="color:#C0C0C0;text-align:center;font-size:9px;margin:0px;padding:2px 0px 0px;">上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。</div></div><span id="fc2_bottom_bnr_close" style="cursor:pointer;display:block;position:absolute;padding:5px;top:0;right:0;width:20px;height:20px;opacity:0.8;max-width:100%;max-height:100%;"><img src="//blog-imgs-61.fc2.com/t/e/s/test0006/fc2_bottom_bnr_close.png" width="20" height="20" style="border:none;width:20px;height:20px;max-width: 100%;" /></span></div> <script type="text/javascript">(function(w, d) {var area = d.getElementById('fc2_bottom_bnr'),areaStyle = area.style;var getScrollMax = function() { return d.documentElement.getBoundingClientRect().height - w.innerHeight; };var getScrollCurrent = function() { return d.documentElement.scrollTop || d.body.scrollTop; };var overlayPosition = function() {if (getScrollMax() > getScrollCurrent()) {areaStyle.bottom = 0;areaStyle.top = 'auto';} else {areaStyle.bottom = 'auto';areaStyle.top = 0;}};var closeBtn = d.getElementById('fc2_bottom_bnr_close'),close = function() { area.style.display = 'none'; };if (w.addEventListener) {w.addEventListener('resize', overlayPosition, false);w.addEventListener('scroll', overlayPosition, false);closeBtn.addEventListener('click', close, false);} else {w.attachEvent('onresize', overlayPosition);w.attachEvent('onscroll', overlayPosition);closeBtn.attachEvent('onclick', close);}})(window, document);</script> </body>の間には文字や画像などの
内容を記述します。

どのホームページも基本的にこのような
構造になっています。


携帯サイト作成~初級編~TOP






携帯サイトの超基本的なHTML


タイトルを書き込む


タイトルの表示


色・配置の変更


内容の記述


文字の位置を変える

 
リンクの貼り方


よく使うタグ集

タグ :

未分類 | PAGE TOP↑

リンクの貼り方

2006年05月02日(火)

リンクとはページとページを繋げるものです。


タグの書き方

<a href="http://www.******.co.jp">ここに文字を入力</a>
上記のhttp://www.******.co.jpがURLになります。

URLとはアドレスのことです。

必ず半角英数で入力のこと。

「ここに文字を入力」のところに入力した文字が、リンクとして表示されます。


こんな感じになります。

ここに文字を入力



また上の場合を絶対パスといいます。

絶対パスとはhttp://ではじまるURLのことです。

かならず最後はで閉じること。


それに対し相対パスというものがあります。

これは自分のページ内でのみ使えるものでURLを簡単に省略できます。


携帯サイト作成~初級編~TOP






携帯サイトの超基本的なHTML


タイトルを書き込む


タイトルの表示


色・配置の変更


内容の記述


文字の位置を変える

 
リンクの貼り方


よく使うタグ集

タグ :

未分類 | PAGE TOP↑

よく使うタグ集

2006年05月02日(火)

ここでは携帯サイトを作る際によく使うタグを説明します。

中にはあまり使わないものもありますが、知ってて損はありませんので参考までに覚えておいてください。



1.フォントサイズの指定


フォントサイズの指定はフォントの大きさを変えたい部分を

<FONT SIZE="大きさ">と</FONT>ではさみます。

フォントサイズは1~7まであり、通常のサイズは3です。







2.文字色の変更



文字色の変更は「色・配置の変更」でも触れましたが、変更したい文字を<FONT COLOR="色">と</FONT>で挟みます。

色の種類についても「色・配置の変更」を参照してください。







3.太字の設定



太字の設定は太字にしたい文字列を<B>と</B>ではさみます。

・見本

こんな風になります。







4.斜体の設定



斜体は斜体にしたい文字列を<I>と</I>ではさみます。

・見本

こんな風になります。







5.下線の設定



下線は下線をひきたい文字列を<U>と</U>ではさみます。

・見本

こんな風になります。








6.取消し線の設定



文字列に取消し線をひきたい場合は、文字列を<S>と</S>
で挟みます。

・見本

こんな風になります。







7.段落の設定



文字列に段落を設定するには、文字列を<P>と</P>ではさみます。
段落を設定した文字列の前後には1行分のスペースが入ります。







8.改行の設定



改行の設定は文字列の間に<BR>を挿入します。
<BR>の挿入されたところで改行されます。







9.背景色の変更



ページの背景色を変更するには<body><div id="sh_fc2blogheadbar"> <div class="sh_fc2blogheadbar_body"> <div id="sh_fc2blogheadbar_menu"> <a href="https://blog.fc2.com/" rel="nofollow"> <img src="//static.fc2.com/image/headbar/sh_fc2blogheadbar_logo.png" alt="FC2ブログ" /> </a> </div> <div id="sh_fc2blogheadbar_search"> <form name="barForm" method="get" action="" target="blank"> <input class="sh_fc2blogheadbar_searchform" type="text" name="q" value="" maxlength="30" onclick="this.style.color='#000000';" onfocus="this.select();" onblur="this.style.color='#999999'" /> <input type="hidden" name="charset" value="utf-8" /> <input class="sh_fc2blogheadbar_searchbtn" type="submit" value="ブログ内検索" /> </form> </div> <div id="sh_fc2blogheadbar_link_box" class="sh_fc2blogheadbar_link" style="visibility: hidden;"></div> </div> </div> ~ <!-- passive:ad:171 --> <div id="fc2_bottom_bnr" style="position:fixed;z-index:10000;left:0;bottom:0;width:100%;display:block;filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#70000000,EndColorStr=#70000000);background:rgba(0,0,0,0.7);"><div id="fc2_bottom_bnr_img" style="display:block;width:728px;height:94px;margin:0px auto;padding:10px 0px 14px;"><iframe src='//assys01.fc2.com/1346' style='width:728px;height:90px;border:none;' scrolling='no'></iframe><!-- FC2管理用 --><img src="//media.fc2.com/counter_img.php?id=1505" width="1" height="1"><!-- FC2管理用 --><div style="color:#C0C0C0;text-align:center;font-size:9px;margin:0px;padding:2px 0px 0px;">上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。</div></div><span id="fc2_bottom_bnr_close" style="cursor:pointer;display:block;position:absolute;padding:5px;top:0;right:0;width:20px;height:20px;opacity:0.8;max-width:100%;max-height:100%;"><img src="//blog-imgs-61.fc2.com/t/e/s/test0006/fc2_bottom_bnr_close.png" width="20" height="20" style="border:none;width:20px;height:20px;max-width: 100%;" /></span></div> <script type="text/javascript">(function(w, d) {var area = d.getElementById('fc2_bottom_bnr'),areaStyle = area.style;var getScrollMax = function() { return d.documentElement.getBoundingClientRect().height - w.innerHeight; };var getScrollCurrent = function() { return d.documentElement.scrollTop || d.body.scrollTop; };var overlayPosition = function() {if (getScrollMax() > getScrollCurrent()) {areaStyle.bottom = 0;areaStyle.top = 'auto';} else {areaStyle.bottom = 'auto';areaStyle.top = 0;}};var closeBtn = d.getElementById('fc2_bottom_bnr_close'),close = function() { area.style.display = 'none'; };if (w.addEventListener) {w.addEventListener('resize', overlayPosition, false);w.addEventListener('scroll', overlayPosition, false);closeBtn.addEventListener('click', close, false);} else {w.attachEvent('onresize', overlayPosition);w.attachEvent('onscroll', overlayPosition);closeBtn.attachEvent('onclick', close);}})(window, document);</script> </body>を
<BODY BGCOLOR="色">~ <!-- passive:ad:171 --> <div id="fc2_bottom_bnr" style="position:fixed;z-index:10000;left:0;bottom:0;width:100%;display:block;filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#70000000,EndColorStr=#70000000);background:rgba(0,0,0,0.7);"><div id="fc2_bottom_bnr_img" style="display:block;width:728px;height:94px;margin:0px auto;padding:10px 0px 14px;"><iframe src='//assys01.fc2.com/1346' style='width:728px;height:90px;border:none;' scrolling='no'></iframe><!-- FC2管理用 --><img src="//media.fc2.com/counter_img.php?id=1505" width="1" height="1"><!-- FC2管理用 --><div style="color:#C0C0C0;text-align:center;font-size:9px;margin:0px;padding:2px 0px 0px;">上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。</div></div><span id="fc2_bottom_bnr_close" style="cursor:pointer;display:block;position:absolute;padding:5px;top:0;right:0;width:20px;height:20px;opacity:0.8;max-width:100%;max-height:100%;"><img src="//blog-imgs-61.fc2.com/t/e/s/test0006/fc2_bottom_bnr_close.png" width="20" height="20" style="border:none;width:20px;height:20px;max-width: 100%;" /></span></div> <script type="text/javascript">(function(w, d) {var area = d.getElementById('fc2_bottom_bnr'),areaStyle = area.style;var getScrollMax = function() { return d.documentElement.getBoundingClientRect().height - w.innerHeight; };var getScrollCurrent = function() { return d.documentElement.scrollTop || d.body.scrollTop; };var overlayPosition = function() {if (getScrollMax() > getScrollCurrent()) {areaStyle.bottom = 0;areaStyle.top = 'auto';} else {areaStyle.bottom = 'auto';areaStyle.top = 0;}};var closeBtn = d.getElementById('fc2_bottom_bnr_close'),close = function() { area.style.display = 'none'; };if (w.addEventListener) {w.addEventListener('resize', overlayPosition, false);w.addEventListener('scroll', overlayPosition, false);closeBtn.addEventListener('click', close, false);} else {w.attachEvent('onresize', overlayPosition);w.attachEvent('onscroll', overlayPosition);closeBtn.attachEvent('onclick', close);}})(window, document);</script> </body>に書き換えます。

なお、色については「色・配置の変更」を参照してください。







10.区切り線をひく



区切り線は区切り線を挿入したい部分に<HR>と記述します。
携帯の画面は小さいので、適宜区切り線を挿入することでページがみやすくなります。このタグを覚えておくと便利です。

・見本

こんな風に


なります。







11.区切り線の長さの変更



区切り線の長さを変更するには<HR WIDTH="線の長さ">と
記述します。線の長さは数値を入力することでも変更できますが、「%」を入力するのが便利です。

例えば、<HR WIDTH="80%">と入力すると区切り線が画面の
80%に設定されます。変更された区切り線は中央揃えになります。

左揃えにするには<HR WIDTH="線の長さ" align="LEFT">
と記述します。







12.区切り線の太さの変更



区切り線の太さを変更するには<HR SIZE="線の太さ">と
記述します。

線の太さは数値を入力することで変えることができます。
例えば<HR SIZE="5">と記述すれば5ピクセルの太さに変更
できます。

・見本

これが




こんな風になります。










13.区切り線の色の変更



区切り線の色を変更するには<HR COLOR="線の色">と記述します。
なお色については「色・配置の変更」を参照してください。

・見本

こんな風になります。














14.文字を右から左にスクロールさせる



文字を右から左にスクロールさせるには、
<MARQUEE DIRECTION="RIGHT">文字列</MARQUEE>
と記述します。

ちなみに左から右にスクロールさせるには"RIGHT"を"LEFT"と変更します。
下から上は"UP"、上から下は"DOWN"と記述します。

・見本

"right"と記述しています。右に流れます

"left"と記述しています。左に流れます







15.スクロールの繰り返し回数を指定する



スクロールを繰り返し行う場合は、
<MARQUEE LOOP="回数">文字列</MARQUEE>と記述します。

例えば<MARQUEE LOOP="10">文字列</MARQUEE>と記述すれば
文字列が10回スクロールします。


・見本


↓5と記述してあるものが流れています。
(表示されていない場合、すでにスクロール回数を終えています。
お手数ですが、再度このページを開きなおしてください)
"3"と記述しています。

↓10と記述してあるものが流れています。
(表示されていない場合、すでにスクロール回数を終えています。
お手数ですが、再度このページを開きなおしてください)
"10"と記述しています。







16.スクロールエリアに背景色をつける



スクロールエリアに背景色をつけるには、
<MARQUEE BGCOLOR="色">文字列</MARQUEE>と記述します。

なお、色は「色・配置の変更」を参照してください。

"blue"と記述しました。

"red"と記述しました。

"yellow"と記述しました。





以上、16のタグを紹介しましたが、全てが携帯サイトを作るのに
必要なものではありませんので、適宜必要と思ったものを利用してください。


携帯サイト作成~初級編~TOP

タグ :

未分類 | PAGE TOP↑

パソコンと携帯の違い

2006年05月02日(火)

パソコンと携帯の違い
~その1~



ず、言うまでもないと思いますが、パソコンと携帯は画面の大きさが違います。

しかし、そのことを認識していないと、携帯サイトを作ろうとするときに戸惑います。

携帯の画面は小さい。


見本サイズ



そのため、必然的に構成もシンプルになります。
いえ、しなくてはなりません。

パソコンのサイトのように凝ることはできませんが、逆に言えばシンプルに作れるので、初心者にも向いています。




~その2~


ソコンにはマウスがありますが、携帯にはありません。

そのため、必ず一度はリンクの上を通ることになります。

つまり、パソコンと比べて、あなたが踏ませたいリンクを比較的踏ませやすくなります。




~その3~


介は簡潔に。

携帯の場合、これが必須となります。

パソコンの画面ならともかく、あの小さな画面で、長々とした説明を読んでくれる人はまずいません。

そのため、アフィリエイトリンクの説明も極めて簡潔です。


たとえば、懸賞とかだと、

無料登録で
月10万のチャンス!


といった感じのものばかりです。

タグ :

未分類 | PAGE TOP↑

タイトルを書き込む

2006年05月02日(火)

ホームページのタイトルは<HEAD>と<link href="https://static.fc2.com/css_cn/common/headbar/120710style.css" rel="stylesheet" type="text/css" media="all" /> </head>の間に
<TITLE></TITLE>というタグを記述します。
次に<TITLE>と</TITLE>の間にあなたのホームページ
のタイトル(またはページのタイトル)を入力します。






上の例では<HEAD>と<link href="https://static.fc2.com/css_cn/common/headbar/120710style.css" rel="stylesheet" type="text/css" media="all" /> </head>の間に
<TITLE>ここにタイトルを書く</TITLE>
という文章を記述しています。

この記述を入力するとInternet Explorerの場合左上の
青いラインに「タイトルを書き込む」と表示されます。

このページの左上にも「タイトルを書き込む」と
表示されていますが、これはこのページのタイトルを
「タイトルを書き込む」と記述しているからです。


実際に上のHTMLの記述をメモ帳にコピーし、「index.html」と
いう名前で保存し、もう一度起動してみてください。


Webブラウザは真っ白になってると思いますが、左上には
「タイトルを書き込む」と表示されているはずです。

携帯サイト作成~初級編~TOP






携帯サイトの超基本的なHTML


タイトルを書き込む


タイトルの表示


色・配置の変更


内容の記述


文字の位置を変える

 
リンクの貼り方


よく使うタグ集

タグ :

未分類 | PAGE TOP↑

タイトルの表示

2006年05月02日(火)

ホームページのタイトルをテーブル(箱)の中に文字を入力して
簡単に作ってみましょう。
ホームページタイトルは「携帯サイト作成基礎マニュアル」にしてみます。





<body><div id="sh_fc2blogheadbar"> <div class="sh_fc2blogheadbar_body"> <div id="sh_fc2blogheadbar_menu"> <a href="https://blog.fc2.com/" rel="nofollow"> <img src="//static.fc2.com/image/headbar/sh_fc2blogheadbar_logo.png" alt="FC2ブログ" /> </a> </div> <div id="sh_fc2blogheadbar_search"> <form name="barForm" method="get" action="" target="blank"> <input class="sh_fc2blogheadbar_searchform" type="text" name="q" value="" maxlength="30" onclick="this.style.color='#000000';" onfocus="this.select();" onblur="this.style.color='#999999'" /> <input type="hidden" name="charset" value="utf-8" /> <input class="sh_fc2blogheadbar_searchbtn" type="submit" value="ブログ内検索" /> </form> </div> <div id="sh_fc2blogheadbar_link_box" class="sh_fc2blogheadbar_link" style="visibility: hidden;"></div> </div> </div> と <!-- passive:ad:171 --> <div id="fc2_bottom_bnr" style="position:fixed;z-index:10000;left:0;bottom:0;width:100%;display:block;filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#70000000,EndColorStr=#70000000);background:rgba(0,0,0,0.7);"><div id="fc2_bottom_bnr_img" style="display:block;width:728px;height:94px;margin:0px auto;padding:10px 0px 14px;"><iframe src='//assys01.fc2.com/1346' style='width:728px;height:90px;border:none;' scrolling='no'></iframe><!-- FC2管理用 --><img src="//media.fc2.com/counter_img.php?id=1505" width="1" height="1"><!-- FC2管理用 --><div style="color:#C0C0C0;text-align:center;font-size:9px;margin:0px;padding:2px 0px 0px;">上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。</div></div><span id="fc2_bottom_bnr_close" style="cursor:pointer;display:block;position:absolute;padding:5px;top:0;right:0;width:20px;height:20px;opacity:0.8;max-width:100%;max-height:100%;"><img src="//blog-imgs-61.fc2.com/t/e/s/test0006/fc2_bottom_bnr_close.png" width="20" height="20" style="border:none;width:20px;height:20px;max-width: 100%;" /></span></div> <script type="text/javascript">(function(w, d) {var area = d.getElementById('fc2_bottom_bnr'),areaStyle = area.style;var getScrollMax = function() { return d.documentElement.getBoundingClientRect().height - w.innerHeight; };var getScrollCurrent = function() { return d.documentElement.scrollTop || d.body.scrollTop; };var overlayPosition = function() {if (getScrollMax() > getScrollCurrent()) {areaStyle.bottom = 0;areaStyle.top = 'auto';} else {areaStyle.bottom = 'auto';areaStyle.top = 0;}};var closeBtn = d.getElementById('fc2_bottom_bnr_close'),close = function() { area.style.display = 'none'; };if (w.addEventListener) {w.addEventListener('resize', overlayPosition, false);w.addEventListener('scroll', overlayPosition, false);closeBtn.addEventListener('click', close, false);} else {w.attachEvent('onresize', overlayPosition);w.attachEvent('onscroll', overlayPosition);closeBtn.attachEvent('onclick', close);}})(window, document);</script> </body>の間に入力した内容はWebブラウザ上で表示されます。

上の例の<TABLE BORDER="1">~</TABLE>までに記述された内容は
四角い箱の中に「携帯サイト作成基礎マニュアル」の文字を表示させるものです。

<TABLE BORDER="1">の"1"は箱の淵の太さを意味します。

"1"を"2"、"3"と変えると箱の淵がより太くなります。
しかし、携帯サイトを作る際には"1"で十分です。

実際に上の記述をメモ帳にコピーしてWebブラウザで見て下さい。
左上に四角い箱の中に「携帯サイト作成基礎マニュアル」という文字が表示されているはずです。


ここで紹介した<TABLE BORDER="1">~</TABLE>までの記述は
表の作成についてのものですが、携帯サイトで表を作成することはないと思いますので、表の作成についての詳しい説明は割愛させていただきます。

なお、<TABLE>はi-modeに対応されていないため、
使用しないほうが無難です。

他にも当サイトでは、i-modeに対応されていないタグを紹介している箇所があります。
i-modeに対応されているかどうかを確認するために、以下のリンクからシミュレータをダウンロードすると便利です。
わざわざ、携帯から自分で作ったサイトの表示をいちいち確認しなくてもこのシミュレータを使えば、どのように携帯で表示されているか確認できます。

iモードHTMLシミュレータ


携帯サイト作成~初級編~TOP






携帯サイトの超基本的なHTML


タイトルを書き込む


タイトルの表示


色・配置の変更


内容の記述


文字の位置を変える

 
リンクの貼り方


よく使うタグ集

タグ :

未分類 | PAGE TOP↑

携帯サイト作成~初級編~

携帯アフィリエイトサイト作成ツール

わずか8分で100サイト作成!!
無料HPスペースの面倒なアカウント取得にもう時間を掛ける必要はありません。
詳しくはこちら

伝説の携帯アフィリエイターが「社外秘」にしていた極秘ノウハウをすべて公開しています。
詳しくはこちら

ドロップシッピングで稼げないのは、仕組みを理解していないだけなんです。
ドロップシッピングで月商1,000万円の現役ドロップシッパーがその秘密を公開!!
詳しくはこちら

お勧めサービス

 
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。