HTML手打ちでWEBサイトを作成する方法とは?

このQ&Aのポイント
  • WEBサイトを作成する際、HTMLを手打ちで作成する方法や使用するツールについて知りたいです。
  • ヤフーやokwaveなどのポータルサイトはどのように作成されているのか気になります。
  • プログラミングを学んでいるが、HTMLやその他のプログラムを組み合わせてどのように使用しているかイメージが湧かないです。
回答を見る
  • ベストアンサー

WEBサイトはHTMLを手打ちして作られている?

ヤフーのようなポータルサイトや、okwaveなどはどうやって作成しているのでしょうか。 HTMLを手打ちでやっているのですか? 作成のためのソフトがあるのですか? HTMLの他に、スクリプト系やサーバサイドWeb系というプログラムも使われているとプログラミング学習サイトで読んだのですが、具体的には"どこにどうのよう"に使われているのでしょうか? (たとえば、ヤフーの○○のページのココに使われている、といったように具体的に教えて頂けると幸いです。) プログラミングを学んでいるのですが、 これらのイメージが沸かないのでタグやプログラムを覚えていても頭に入って来ません。 将来的にはランディングページやポータルサイトを作りたいと考えています。 以上、宜しくお願い致します。

質問者が選んだベストアンサー

  • ベストアンサー
回答No.4

多分「手打ち」のイメージが狂っているような。 タグ打ちと言っても、<html>などと、一文字づつ打っている方は、ほとんどいません。 入力支援機能の付いたエディタだとかIDE(統合開発環境)を使っているのです。 たとえば、hと打ち込んだだけで、<html>が変換候補に現れます。 また、お約束のコードなどは最初から入力された状態で始めることもできます。 たとえば、<hrml><head></head><body></body></html>など。実際には、もっと入ってます。 使用に関してという意味でフリーのものも多くあるので、リンクしておきます。 入力支援の強力なエディタ Mery http://www.haijin-boys.com/wiki/%E3%83%A1%E3%82%A4%E3%83%B3%E3%83%9A%E3%83%BC%E3%82%B8 Oracleの統合開発環境(WEBだけでなく、JAVA開発などもできます) https://ja.netbeans.org/ タグ打ちの勉強がしたければ、PHPまでに対応したものをDLすればいいかと。 AdobeのHTML・CSSコーディング用ツール http://html.adobe.com/jp/edge/code/ http://html.adobe.com/jp/edge/reflow/ Chorome以外のブラウザへの対応は、さらに加工が必要。 これらのツールを使って作成するわけです。この時、入力支援機能を使いながら一から書き起こす場合もあります。また、Dreamweaverなどを使って作成したものを、IDEで加工するケースもあります。 <meta name="generator" content="作成ソフト名">なんてのは、この時点で削除してしまいます。 >ヤフーのようなポータルサイトや、okwaveなどはどうやって作成しているのでしょうか。 見た目が変わっても、HTML自体には大きな変更が無い場合があります。 CSSで表示する画像や線を変更するだけのような場合です。 そのような場合には、新しい画像を用意して、CSSを編集するだけです。 新規で作成する場合や大きな変更を伴う場合には、モックアップ(見本図)を作って、それに当てはめて作ります。 >これらのイメージが沸かないのでタグやプログラムを覚えていても頭に入って来ません。 どのように稼働しているかをイメージするためには、実際にやってみるのが一番だと思います。 私もそれで多くの発見がありました。 実際にやるといっても、いきなりレンタルサーバーで無茶なことはできません。そんなことをすると多くの方に迷惑がかかります。外部公開しないテスト環境を作れぼ良いと思います。 テスト環境は、「CentOS LAMP 構築」などとして検索してください。この際、古い情報やあやふやな情報は捨ててください。また、apacheなどをRPM化せずにソースからインストールしろと言っているようなところも捨ててください。 お持ちのPCが仮想環境を利用できるなら、そちらに。 手持ちのPCがノートでHDD容量が厳しいなど、ハードウェア要件に該当しないなら、別のPCを1台用意してそちらに。 別のPCを用意する場合 自作してしまえば、3万円程度で作れます。(モニタは切り替えて共用できるとして) その程度のサーバー機も売られています。(鼻毛鯖などで検索) 中古機を買ってどうこうはお勧めできません。(わたしはそうしたけど、インストールだけで偉い苦労しました。HDDが老朽化しているなど、余計な出費でかえって高くつくこともあり)

aspirin2020
質問者

お礼

とてもわかりやすいご回答、本当に感謝します。 おっしゃるとおり、「手打ち」のイメージが間違っていました。すごく腑に落ちました。 実際に手を動かしてやってみます。 ありがとうございました。

その他の回答 (3)

  • okgoripon
  • ベストアンサー率44% (1141/2550)
回答No.3

>HTMLを手打ちでやっているのですか? >作成のためのソフトがあるのですか? サイトによります。 まあ、だいたいは何らかの「作成のためのソフト」で作成して、そうして出来たページに対して「HTMLを手打ち」で微調整しているんじゃないかと思いますが。 >具体的には"どこにどうのよう"に使われているのでしょうか? そのサイトのHTMLファイルを見れば、おおよそは判ります。 というか、見てわからない人に説明できるほど簡単ではありません。

  • kamikami30
  • ベストアンサー率24% (812/3335)
回答No.2

とりあえず、 ランディングページとポータルサイトの意味わかってます? 多少技術があれば作れるでしょうが、技術を学んだ結果と言うものではないと思います。 まぁ、いいとして、 とりあえず、レンタルサーバー借りてください。 フリーのでも、安いのでもOKです。 htmlのサンプルと解説があるサイトのサンプルをコピーして設置してください。 設置したものをブラウザで確認してください。 phpのサンプルと解説があるサイトのサンプルをコピーして設置してください。 設置したものをブラウザで確認してください。 レンタルサーバーにデータベースも立てられれば、立ててみてください。 phpでデータベースを操作してみてください。 PCが余っていれば実機に、なければVMPlayerの仮想に Centosをインストールして、レンタルサーバーでやったことができるサーバー環境を作ってください。 レンタルサーバーでやったことを、自作サーバーでやってみてください。 途中、疑問に思ったことやわからないことはどんどん調べてやってみて下さい。 この時点で、質問の内容をまた考えてみてください。 それなりにわかると思います。 わからなくても、どうすればわかるかが、わかると思います。 必要なら本も買うと便利です。

aspirin2020
質問者

補足

早速のご回答ありがとうございます。 確かに、その方法ですと即席のWEBページができるとおもいます。 しかし、ヤフーはサンプルを使って開発しているわけではないですよね? >htmlのサンプルと解説があるサイトのサンプルをコピーして設置してください。 この部分を、0からhtmlを手打ちで打っているのか、それとも何かしらの(想像ですが、タグを勝手に生成するような)ソフトを使っているのか、というのが質問の趣旨でした。 しかし、ご回答頂いたやり方はWEB開発がどのようなものか、自分は何を学ばなければいけないのか、ということが分かることができると思いますので、ぜひ実践させて頂きます。 もちろん書籍も購入予定です。 改めて、ご回答ありがとうございました。

  • lv4u
  • ベストアンサー率27% (1862/6715)
回答No.1

プログラムの学習は、ネットや本をながめているだけでは、頭に入ってきません。 1)実際に手をつかって、打ち込んでみる。 2)事例となっている動作環境を用意する。 3)動かしてみる。 4)動かない、エラーがでる等の問題を、関連する専門書を購入して調べたり、ネットで調べて「自力」で解決する。 上記のことを何度も繰り返すことで、少しずつ頭に入ってきますよ。 なお、現実問題として、環境を用意するということでレンタルサーバを借りるとか、書籍を購入するなど、それなりのお金が必要となります。

関連するQ&A

  • html手打ち?

    仕事でなく、ただの趣味でホームページを作っている者です。 ふと疑問に思ったんですが、ビルダーなどのツールを使っていないだけで「手打ち」と称していいのでしょうか。 「手打ちすごいねー」と言われて、お世辞とは分かっていても少し罪悪感に襲われることがあるんです。全部が全部手打ちなわけじゃないから。 テーブルタグ配布サイト等からコピペさせていただくこともあれば、秀丸マクロでキーをポンと押すだけで終了タグが出てくるようにもなってる。 置換機能もがんがん使うし、タブブラウザのアンカータグ作成機能も使っています。 一文字一文字キーを手で叩いて書き上げたわけじゃないのに、「手打ち」って…ちょっとずうずうしい気がするような、そうでもないような。 フードプロセッサーで生地をこねて焼いたパンに対して「手打ちなのねーすごいねー」と言われたら、いくらホームベーカリーは使っていなくても、はっきりと「ううん、実は手打ちじゃないのよ」と申告するところなのですが、タグ打ちの場合は微妙…… はっきりいってどうでもいい質問なので、ものすごくお暇だったらご意見お聞かせ下さいな。

    • ベストアンサー
    • HTML
  • Web上のHTMLタグ辞典は・・・

    タイトル通りなのですが、HTMLやDHTMLなどのタグと対応ブラウザ(IE,NNバージョン)が載っていて検索できるサイトは無いでしょうか? Webページ作成ソフトを使うと知らないタグが出てくるものでして・・・。 ご存知の方おりましたらよろしくお願いします。

    • ベストアンサー
    • HTML
  • Dreamweaverと手打ち

    会社のWebサイトを作成する予定です。今はez-HTMLで構築しようと練習しているのですが、効率の面で不安を感じます。WYSIWYGを考えているのですが、HPビルダーは微調整がききにくく余計ながタグが入ると聞いたのでDreamweaverを検討しています。 ・基礎的なHTML,CSSの知識で使いこなせる(構築できる) ・HTML,CSSの知らない人でも更新できる(新着情報など) ・Webサイトは2つ構築予定。(それぞれ20ページ位) ・ベース部分(デザイン)が仕上がればプログラム部分を外注する予 定 上のような条件ならez-HTMLのようなテキストエデターか、DreamWeaverのどちらを使ったほうがいいでしょうか?アドバイスよろしくお願いいたします。

  • 携帯サイトXHTMLとHTMLの振り分け設定?

    携帯サイトを作っていますがi-modeで FOMAなど向けのページとしてXHTML、 それ以外用にHTMLで作成したページを設置する場合その振り分け?判別?はどのようにすればいいでしょうか? またそれはHTML・XHTMLレベルより高度なプログラム(PHPやサーバーサイドのプログラムなど)が必要でしょうか? たとえばimode公式メニューの「ファッション」カテゴリの1位「girlswalker」のようなサイトを作りたいのですが これをFOMAで見ると画像がいっぱい、色とりどりのページが表示されますがFOMAではないdocomo携帯で見るとシンプルなつくりのページが表示されます。 こんな感じにしたいのですが・・。 誰か教えていただけると助かります。

  • テキストエディットで手打ちタグ

    こんにちは MACのテキストエディットで手打ちでHPをつくろうとしています。 ところが、ブラウザでみようとすると、テキストのまま表示されてしまいます。 HTMLとしてみるにはどうしたらよいのでしょうか? 以前はWin環境だったのですが、メモ帳で手打ちでタグを作成していました。今回も同じように、Macでやりたいのですが。 かなり初歩的な質問とは思いますが、検索しても分からなかったため、どなたか教えて下さい。宜しくお願いします。

    • ベストアンサー
    • Mac
  • 省略できるHTMLについて

    今、Dreamweaverでホームページを作ってるのですが、無駄なタグなどがあって困ってます。 省略できるHTMLについて検索して探して見ましたが、そういうサイトが見つかりませんでした。 省略できるHTMLの情報が載ってるサイトや書籍があったら教えてください やっぱし手打ちのほうがいいのですかね?

    • ベストアンサー
    • HTML
  • HTML+CSSについて質問です

    当方のHPは左サイドにメニューリスト、中央部分に記事を書いている2カラムです。また、ページ数は100ページくらいありますが左サイドのメニューリストは全て共通となっています。左サイドのメニューリストは定期的に更新しているのですが、一つの項目を追加したい(削除したい)場合、全てのページの左サイドメニューを更新しなければならず、かなりの手間がかかってしまいます。なので、左サイドメニューは独立したHTMLを作成し、更新の手間がかからないような形にしたいと考えています。このようなHTML+CSSを作成する場合、どのようにすればよろしいのでしょうか?また、参考になるサイトがあればご教授よろしくお願いします。ちなみに当方のHPを作成する知識は、基本的なタグやCSSがわかる程度の初心者レベルです。

    • ベストアンサー
    • HTML
  • 手打ちでHHP作り

    今まで、HPを手打ちで作ってきました。手打ちHP歴5年です。 以前の環境はMac OS8.6です ソフトはJedit(またはシンプルテキスト)を使い、IEでhtmLファイルにしていました。 作成方法: 1)Jeditでhtmlのタグを打ち込んで保存。→そのファイルをIEで開き、htmlファイルとして保存。 2)既に、サイトアップしたページ(htmlファイル)は、Jeditで開き、内容を更新して保存。そのhtmlファイルをアップする。 と、いった至ってシンプルなものです。 しかし、今回新Macを買い、バージョンがMac OSX 10.4.6になり、 IEがこの1/31でダウンロードできなくなったので、 テキストエディットとSafariでHPを作ろうとしました。 が、上記の方法で作成できません。 テキストエディットとSafariでHPを作成する方法を教えて頂けないでしょうか? 因に、「HP作成無料ソフト」は使う気がないので、ご紹介は不要です。 あくまで、この2種のソフトで作成方法を知りたいです。 宜しく情報、お願い致します。

    • ベストアンサー
    • Mac
  • 自分のサイトのHTMLの見方

    >タグをあなたのサイトのトップページのHTMLの<head>から</head>にコピペしてください。 サイト登録の手続きの際に上記の文章が 出てくるのですがよく意味が良く分からないのです。 教えてください。 どうやったら自分のブログサイトのHTMLを見ることができるのですか? 見ることもできないのでコピペができません。

  • webサイトの作りかたについて

    例えば、下記のようなwebポータルサイトを作成したいのですが、どのようなプログラミングの知識があれば作成出来るでしょうか? https://supremecourtlawlibrary.org/ 前提として、ノーコードツールやWordPressのようなサービスを利用せず、自分で一からプログラミングして開発することを想定しています。 ザックリとした質問ですみませんが、分かる方教えて下さい。

専門家に質問してみよう