各自のトップページ作成【 Android版 】

  前回までの練習用ページで、ある程度は HTML 文書に馴れてきたので、
  今回と次週で最終的な各自の Web ページ作りを行う。

◆トップページの作成

1.Chrome」によるソースの表示
  
  ① 最終的なトップページとなる サンプルページを表示 して確認する。
  ② サンプルページのソースを表示 する。

2.テキストを選択してコピーする
  ① のあたりで長押しし、選択モードにする。
  ② 文字カーソルピンの左を「<!DOCTYPE ・・・」の 「<」に合わせ、
    文字カーソルピンの右側を下に向かって引っ張って選択範囲を広げる。
  

  ① 文字カーソルピンの右を「</html>」の > に合わせる。
  ② 画面上の「コピー」を選択してコピー(記憶)する。
  

3. 以後、今までと同じように QuickEdit による編集作業 を行います。
  ① のあたりでタップし、メニューを表示する。
  ② 「貼り付け」を選択する。

  

  ★ HTML文書が貼り付いたので、自分用に編集する。

  

4. サンプルページのソースを参照し、赤い文字の部分を各自の情報に変更する。
  ファイル名 "index.html" で保存する。 ※ 赤い文字以外のところは変更しないように!

5. 修正したトップページのファイル (index.html) を AndFTP でサーバにアップロードする。(上書き)
   アップロードができたら、「全履修学生のページ」で確認する。
  


◆自己紹介のページ ( profile.html ) の作成

  1. Chrome での作業
   ① 自己紹介の サンプルページ を開いて確認する。
   ② 確認できたら、自己紹介の サンプルページのソース を開く。
   ③ 今までのように、罫線間を選択状態にしてコピーする。

  2. LiquidLogic の作業
   (1). "LiquidLogic"を起動し、新しいファイル「」を開いて貼り付ける。
   (2). ファイルの保存
     ① ファイル名「新規?」上をタップし、メニュー内の「別名保存...」を選択する。
     ② ファイル名を "profile.html"に変更し、画面右下の「文字コード/改行の変更」を選択する。
     ③ 文字コードを「日本語(シフトJIS)」を選択して閉じ、画面右上の「保存」を選択して保存する。
   (3). 各自の内容に変更して「上書き保存」する。

  3. AndFTP で、サーバーに"profile.html"をアップロードする。

  4. 各自のWebページから「自己紹介」のリンクをクリックして表示するかを確認する。

  5. さらに変更したい場合は、2.~ 4.の作業を繰り返し行う。


全履修学生のページ


★ 参考ページ

  1. 表示色サンプル

  2. アクセスカウンター

  3. カウンターフォント