初心者がホームページを作成

質問

1つのサイトを作成して、PC、スマホ、タブレットとそれぞれのブラウザの大きさに合わせて、表示できるサイトを作成したいのです。
そして、独自ドメインを取得し、レンタルサーバーにアップする予定です。

しかし、私はホームページを作成したことがない初心者です。（フォトショップ、イラレは慣れています）
「レスポンシブ」のテンプレートをダウンロードしましたが、その後どのようにして、作成したらいいか分かりませんでした。

グーグル等、簡単にホームページが出来るとありますが、それはグーグルのサーバーに保存しないといけないという、ことなのでしょうか？

ホームページ作成の条件は、
・１つのサイトで、PCやスマホに対応できる方法
・独自ドメインを取得し、レンタルサーバーにアップできる方法。
（途中で、同じドメインでサーバーを変えることができるように）

ホームページは、個人の業務用として、ごくごく簡単なつくりのものでいいです。
なにか、テンプレートがあって初心者でも簡単に作成できる方法は、ないでしょうか？
ホームページ作成ソフトは、持っていません。
出来れば、無料で出来るか、ブラウザで作成出来ることは可能なのでしょうか？

ご存知の方、よろしくお願いいたします。

回答No.2

noname#242220 · ベストアンサー

ガラケーに関しては使用する『HTML言語』が異なりますので、
完全には同じ表示には成りません。
以前は『ユーザエージェント』で切り替える方法が使われてました。

現在は『スタイルシート』で『可変グリットレイアウト』として
作成する事で単独のページがPCとスマフォに対応出来る様に成ってます。

スタイルシートの内容は単なるコードの羅列ですので、テキスト編集アプリで可能。

HTMLコードのエックスポート機能はイラレ、Photoshopにも有ります。
作成データのアップは『WebDAV形式』に対応しているホストならPCにマウントして
コピーするだけで済みます。

＞ブラウザで作成出来ることは可能
プログをホームページにしている人もいます。

回答No.5

T-iks

独自ドメインを使い、ブラウザで作成出来ることは可能なら、WordPress（CMS)が良いと思います。

（WordPress有料テンプレート）　http://www.wp-w3c.com/

（WordPress無料テンプレート）　http://www.k2-s.com/

（WordPressレンタルサーバー）　http://www.server-choice.org/

参考URL：

http://www.server-choice.org/

回答No.3

kaisinjuku04

ブラウザ上から簡単に作成できるレスポンシブデザインと言うことなので。
ショッピングサイトではないことを前提とします。

ドメインを取得して、どこかのレンタルサーバーを借りてWordPressをインストール。
FC2はダメですよ。WordPress3.5.1が利用可能か確認すること。
固定ページ機能で各ページを作れば、簡単なものであれば、ブラウザから作成できます。

WordPressの標準テンプレートtwenty eleven　、　twennty twelveはレスポンシブ対応です。
携帯対応のプラグインも使えます。

WordPressはかなり何でもできるので、複雑なこと(デザイン変更とかphpの編集とか)をやろうとすれば決して簡単ではありませんが。

回答No.1

ORUKA1951

レスポンシブもメディアクェリも初心者にいきなりは無理です。
　意外と思われるでしょうが、（フォトショップ、イラレは慣れています）を危惧しているのです。
　ワープロ、DTP（Desktop publishing( http://ja.wikipedia.org/wiki/DTP ))と、HTMLは表面上はまったく同じように見えますが、目的がまったく異なります。
　ワープロやDTPは、どのように印刷するか!どのように表現するかが最大の目的です。一方のHTMLは、
・文書をその文書を構成する要素(Element)に分解し、それをタグを使ってマークアップしていくものなのです。
　<h1>ここは見出しだよ</h1><p>ここから新しい段落です。</p><p>ここからまた別の<p></p>で、<strong>この部分はとっても重要な部分です</strong>・・・
　と、単純なテキストです。

★ですから、メモ帳のようなテキストエディタひとつで書けるのです。
★一方、ワープロやDTPで出力されたものを見せられてもコンピューターにはどこが見出しで、どこが本文かは判らないでしょう。

　こうしておけば、今後何十年・何百年経っても、また他のコンピューターで理解できますが、ワードやイラストレーターで作成されたものは、そのソフトがないと利用できなくなります。
・・・・・
・・・・・
　その上で、それをどのように利用するか--パソコンのディスプレイに表示するかは、ブラウザのようなソフトで、<h1></h1>で囲まれた部分は大きな太字で、<p></p>で囲まれた部分は新しく行を起こして、<strong></strong>で囲まれた部分も太字で・・と、（自前ののスタイルシートで）処理していくのです。
　もちろん、スクリーンリーダーで読ませれば<h1></h1>は太い男声で読んでくれるでしょう。<p></p>の前後では、少し間をおいて読まれるでしょう。

　以上から想像できるように、まったく何もしなければ!!!!
　^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
「PC、スマホ、タブレットとそれぞれのブラウザの大きさに合わせて、表示できる」
　物なのです。PC、スマホどころかスクリーンリーダー手もプリンターでも・・
^^^^^^^^^^^^^
　ただ、そのようなHTMLとブラウザの関係ですから、DTPで作成されるそれと比較するとHTMLだけのプレゼンテーションは、とても貧弱です。
　その結果、様々なテクニックが工夫されました。
★下記の一節は読んで置いてください。短いです。
　⇒14.1 スタイルシートの概説( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/present/styles.html#h-14.1 )

　メディアクエリやレスポンスデザインを使わなくても、HTMLやスタイルシートの知識があれば、様々な端末に対応したページは作成できるのです。よく紹介させていただくのですが
　⇒ナビゲーションリストを様々にデザインしてみよう。( http://www.ichiya.com/WebService/Howto/sample/HTML/nav/navigation1.html )
　は、多分テキストエディタだけで書かれていますが、ブラウザの[表示]メニューから[スタイルシート]に進み、様々なスタイルシートを選ぶとデザインはまったく変わりますが、そのいずれもスマホの狭い画面でもPCの大きな画面でも利用できますね。ウィンドウの幅を変えてみましょう。また印刷プレビューでは印刷時のデザインもわかります。スタイルシートを使用しないにすると検索エンジンがどのように読んでいるかも判ります。
　そして、このページはメディアクエリもレスポンシブデザインも使われていません。

　まず、HTMLとは何かを学んでみましょう。
⇒はじめてのWebドキュメントづくり( http://www.asahi-net.or.jp/%7Esd5a-ucd/www/ )
　メモ帳だけで一通りこなしてみましょう。

　そしたら、
⇒1と2の間辺りからはじめるCSS講座( http://www6.plala.or.jp/go_west/beginner/css/ )
　でスタイルシートをかじって見ます。

　多分、優れたテキストエディタがほしくなるでしょう。フリーで色々あります。

　その後で、【その後でなければなりません】、Webオーサリングツール( http://ja.wikipedia.org/wiki/Web%E3%82%AA%E3%83%BC%E3%82%B5%E3%83%AA%E3%83%B3%E3%82%B0%E3%83%84%E3%83%BC%E3%83%AB )を探してみましょう。
　↑このページにも、HTML用に使用できるテキストエディタ＝HTMLエディタ( http://ja.wikipedia.org/wiki/Web%E3%82%AA%E3%83%BC%E3%82%B5%E3%83%AA%E3%83%B3%E3%82%B0%E3%83%84%E3%83%BC%E3%83%AB#HTML.E3.82.A8.E3.83.87.E3.82.A3.E3.82.BF )の紹介があります。