【杉本キャンパス限定】Webページ作成

杉本キャンパスでは、情報教育PC(情報教育システム)を用いて、個人のWebページを作成・公開することが出来ます。

このページでは、個人ページの作成方法や、Webページ作成に役立つサイトなどを紹介します。

作成したWebページの公開操作は、杉本キャンパスに設置された情報教育PCでのみ実施可能です。

注意事項

Webページを作る際は...

  • 著作権に注意を払ってください。
    例えば、他人の Web ページの画像を無断で盗用したり、雑誌等からスキャナで取り込んだものを公開してはいけません。
  • 公序良俗に反するページを作成してはいけません。

制約

  • セキュリティ確保のため、CGI を作成することはできません。
  • SSI (Server Side Include) を使用することはできません。
  • ***.html の漢字コードは、日本語EUC、ISO-2022-JP(JIS)、Shift_JIS(SJIS)、どれでも構いません。
  • public_html の下のファイルは、誰でも読み込み可能なパーミッションを設定しておく必要があります。「パーミッションの設定について」をご確認ください。

パーミッションの設定について

  • public_html フォルダ下に作成したファイルは、パーミッションの設定により読み取りを許可していませんが、
    ファイル保存後10分程度で自動的に誰でも読み込み可能なパーミッションに設定変更され、閲覧可能となります。

即時に手動でパーミッションを変更したい場合は、以下の手順を参考に設定が可能です。

エクスプローラーからの設定

public_html フォルダ内にあるhtml ファイルを右クリックし「プロパティ」を選択します。「セキュリティ」タブからotherのアクセス権を「読み取りのみ」に変更します。

Webページ作成チュートリアル

Webページを作成したことがない人を対象とした、簡単なチュートリアルを公開しています。

Webページ作成チュートリアル

パソコン初心者にもわかりやすく説明していますので、参考にしてみてください。

公開されるファイル

Z:¥public_html」内に作成した HTML ファイルが Web ページとして公開されます。

このフォルダ内の「index.html」がトップページとして表示されます。

その他の HTML ファイルはトップページにリンクを作成することで閲覧可能です。

HTMLファイルの作り方

HTMLファイルの作成手順を簡単に説明します。

    1. HTMLファイルを作成するエディタは自由に選べます。
      「Visual Studio Code」や「WebStorm」、「メモ帳」などがあります。自分が使いやすいものを選んでください。

  1. 作成したファイルをZ:¥public_html内にHTMLファイルとして保存してください。
    基本的にはファイル名の最後を “.html” とすれば HTML ファイルになります。
    トップページとしたいファイルは index.html という名前で保存してください。

Webページはこの手順を用いて作成する他、別のPCで作成したHTMLファイルをProselfでアップロードすることでも作成可能です。詳しくは WebDAVシステム を参照してください。

Webページの公開方法

作成したWebページを公開するためには、次の手順を行ってください(杉本キャンパスの情報教育PCでのみ操作可能です。また、杉本キャンパス内でのみ閲覧できます。)

※新型コロナウイルス感染拡大防止に伴う遠隔授業の実施中は、本手順は不要です。
 作成したWebページは自動的に杉本キャンパス内に公開されます。

Webページを杉本キャンパス内に公開する方法はこちら

※杉本キャンパス以外の外部に公開する為には追加で次の手順を行ってください。

Webページを外部公開する方法はこちら

公開されたWebページのURL

公開された Web ページは以下の URL から閲覧することができます。

https://www.ecs.osaka-cu.ac.jp/~[OMUID]

(例: https://www.ecs.osaka-cu.ac.jp/~a12bc345


この URL は、杉本キャンパス内・外部どちらから閲覧する場合でも同じです。

Webページ作成サイト

Webページ作成の際には、以下のサイトが役に立ちます。

HTML5 対応

  • とほほのWWW入門
  • “とほほのWWW入門”から“むふふの素材集”まで、Webページづくりに必要なものが一通り揃っています。
    • HTML5仕様書
    • HTML5の仕様書の日本語訳です。 公式の文章ではないため、正確に知りたい方は

原文を参照してください。

HTML4 以前


さらに詳しい情報が知りたい場合は、書籍や他のWebページを参照してください。
大阪公立大学のライブラリサービスにも多数のHTML関連書籍があります。

個人ページへ移動

OMUIDを小文字で下に入力すれば、移動ボタンを押すことで、個人ページに移動します。
index.htmlファイルがpublic_html直下にない場合は“Not Found”が表示されます。