質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.47%
CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Q&A

解決済

5回答

326閲覧

アウトプットの方法やWebページ作成ができず困っています。これからどうやっていけばいいでしょうか?

shinaozora50

総合スコア15

CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

0グッド

0クリップ

投稿2019/12/24 03:15

私は、progateのHTML&CSSは学習終了して、今はJavaScriptを学習中のものです。
これから学んだ知識とかでアウトプットで、Webページを作成したいのですが、どうやって作成したらいいのかからつまずいています。
やはり誰かのサイトやホームページ作成の本とかのコードを写経したり、模写するとこから始めた方がいいのでしょうか?
progateで学習したら、静的なWebページでも作れるようになると思っていたのですが。

今後どのように学習していけばいいでしょうか?
初歩的な質問してしまって申し訳ございません。

詳しく教えていただけないでしょうか?
宜しくお願いします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2019/12/24 03:18

「好きにしたらいい」というアドバイスでよければします。 なにをしたいのか、目標や目的は自分しか知りません。
shinaozora50

2019/12/24 03:22

好きにしたらいいですよね 回答しにくい質問してしまって申し訳ございませんでした。
Rocky

2019/12/24 03:24

所詮、プログラムは目的を達成するための道具でしかありません。 作りたいものをお作りになればよいと思います。 その過程で技術的な課題がでれば、またここに書き込んでください。
m.ts10806

2019/12/24 03:30

回答してますけど、同種の質問が非常に多いもので。 プロゲートを責めるべきか身に付いてない受講者を責めるべきか、言語を責めるべきか…
shinaozora50

2019/12/24 08:36 編集

ある静的なWebページの似たような物を作成しようとして、floatやdivなど色々まだちゃんと理解してないタグとか使い方とかもありましたので、基本勉強しなおして、分からないところも調べながら、まずは簡単な静的な4ページ程のWebページに似たような物を作ってみようと思います。 ご回答くださった皆さんありがとうございました。 やはりインプットの学習だけしてては、自分が理解してないところや、実際にWebページ作成しながらデベロッパーツールで色々検証しながら作っていくのがいいのが良く分かりました。 上手く言いたいこと説明できなくて申し訳ありません。 これからは、復習しながら、調べながらアウトプットとして模写や自分でWebページ作成したいと思います。
dice142

2019/12/25 02:02

解決されたのでしたらベストアンサーを選んで解決済みにしていただけると。
shinaozora50

2020/01/15 08:22

すいません。まだWebページどんなの作りたいかも思いつかなくて困ってます。 情けないですね。
m.ts10806

2020/01/15 08:37

質問は「どうやって学習していけばいいか」ですよね。 その回答は出揃ってるように見受けられます。 決めてやってみて調べてみてまたやってみてつまずいたときにその「点」を質問すべきと思います
dice142

2020/01/16 02:00

この質問のゴールは「どのように学習すればいいか?」の回答ではないのですか? あなたが何を作りたいか決まればゴール、であれば質問文と合いません。
guest

回答5

0

本を読み終わるだけで、できるようになっている人はいません。
明確な目標をもち、どういった場面で使えるか考え、教科書通りではないやり方を実践した人ができるようになります。

あなたが言ってるのは
「野球の入門書を読むだけでホームランを打てるようになると思っていた」
というのと同じです。

まずどうなりたい?というところからしっかり詰めていくべきでしょう。
写経云々は手段でしかありませんが、それならそもそもオンライン学習の時間(もしくは費用)って無駄だったんじゃないですか?

オンライン学習からteratailに駆け込んでくる人は多いですが、駆け込む人のほとんどが今回の質問者さんと同じ状態です。

端から見てると、「よほど学習要綱が悪いんだろうか」と思えてしまいますが、結構何も考えずに提供者側に全部任せて自分では何も考えずカリキュラムこなしてるだけの人が多いです。

それなら独学でやったほうが何倍も実力が身に付くんじゃないかと思うくらいに。

ご存じかもしれませんが、「オープンソース」と呼ばれるものは、やろうと思えばどこまででも無料でできます。
書籍を買ったり有料の講座を使うことなくやろうと思えば、実務レベルにもなります。
もし書籍を買ったり講座を受けるのであれば、任せきりにするのではなく、提供される以上のものを身に付けてやろうという気概でやらないと、独学で自ら進んで学ぼうとする人には一生追い付けないと思います。

※私自身、文系未経験から10年以上エンジニアやってますが、試験勉強のために教本を買うことはありますが、言語を身に付けるために書籍を買うことはほとんどありません

投稿2019/12/24 03:28

m.ts10806

総合スコア80850

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

本は所詮、本です

本には書いていないことが、たくさんあります。

教材は所詮、教材です

教材には書いていないことが、たくさんあります。

まずは、手を動かすことが先決です。

手を動かすことに対して疑問を持ってはいけません。

この手の質問は2つに大別できます。

  1. 働いていて言語を身につけなければいけない状況
  2. 趣味・副業(単独)で身につけなけれないけない状況

1だったら、先輩等がいるはずですのでそちらに聞いていただくのが手っ取り早く遠回りはしません。
2が重要です。学び方とは1つではありません。だから皆さん迷います。MENTAのような家庭教師的なサービスを受けられるものもあります。

ここで重要なことがあります。
「調べてわからない」ということは実際問題そうそうないです
Googleでの検索技術の向上というのが何よりもこの業界では重要じゃない?と個人的には思っています。

まとめです。

まずはGoogleで調べる技術を向上させましょう。
そうして調べて、それでもわからなかったらteratailにその旨を記して質問しましょう。(MENTAのようなサービスを利用するのも手です)
この繰り返しです。

投稿2019/12/24 03:54

kyoya0819

総合スコア10429

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

個人的にProgateは文法を学ぶ場所だと思っています。
それ以外のもの(開発環境とか)を学ぶには別な手段が必要かなと思います。

一番有用な手段は 自身で調べること です。

自分が今何をしたいのか、何処で躓いているのか、なにがわかっていないのか、
これらを整理して検索することで進んでいくのが今後も通用する手段です。

もし調べずに質問しているのであればまず調べてください。
調べた上でわからないことは「調べたキーワード」や「調べたサイト」を載せた上で質問すると良いですね。

投稿2019/12/24 03:40

dice142

総合スコア5158

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2019/12/24 03:50

中盤以降、どこでも使えそうな言い回しなところが好きです。
miyabi_takatsuk

2019/12/24 04:40

Progateに対する見解、しっくりきました。納得しました。 なるほどですね・・・。
dice142

2019/12/24 04:52

> m.ts10806さん ありがとうございます。 たしかにプログラミング学習者以外にも使えそうですね。 > miyabi_takatsukさん 以前に少しやった程度ですが、そんな印象を受けました。 環境構築が不要で学習可能なので、逆に言えば環境構築に関してはほぼ扱ってないのかと。 まあでも入門者向けならその方が入りやすいでしょうね。 (Progateだけで全部学べるという誤解が生まれやすいようですが。)
guest

0

Webデザインの基礎を学ばれることをおすすめします

Webページを作成したいのですが、どうやって作成したらいいのか
progateで学習したら、静的なWebページでも作れるようになると思っていたのですが

あくまで個人的なアドバイスになりますが、
自分で0からWebサイトを作れるようになりたいのでしたら、
「Webデザインの基礎」を学んだほうが良いと思います。

progateを利用したことが無いため、これまでどのようなプロセスで学んでこられたかわかりませんが
今後エンジニア(プログラマー)としてキャリアを考えている場合でも、
「デザインはデザイナーの職域なので、エンジニアは理解しなくて良い」と ならないところがWebサイト制作です。

学ぶ手段は、本でもオンラインでも何でも良いと思います。
がんばってみてください。

投稿2019/12/24 03:39

mattari_panda

総合スコア429

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2019/12/24 05:31

エンジニアもレイアウトデザイン全く度外視では成り立ちませんしね。 お互い補い合うにしても一定の理解や認識は必要です
guest

0

ベストアンサー

お気持ち分かります。
とりあえず、ポートフォリオを作成してみてはいかがでしょう?
手順はざっくり以下のような感じでどうでしょうか。

①入れる内容の洗い出し
まずざっくりと、自分のポートフォリオに何を入れるか考えます。(自己紹介、制作実績、コンタクト情報など)
思いつかなかったら検索すると他の人のポートフォリオが出てくるので参考にされると良いと思います。
例)https://muuuuu.org/category/sitetype/portfolio

②ワイヤー作成
何を入れるか決まったら、ざっくりとどこに何を配置するかを考えます。(紙に書き出してみると良いかもしれません)
コーディングの勉強が目的なら入れる内容(写真やテキスト)はダミーで良いと思います。
例)http://websae.net/wireframe-20150303/

③デザイン作成
ざっくり配置した案が出来上がったら、それを元にデザインに起こしてみます。
コーディングの勉強が目的なら、デザインは白黒とか適当で大丈夫かと思います。

デザインの学習も予定されてるのなら、デザインは奥が深いと思うので、
検索してみたり書籍を購入されると良いかもしれません。
サイトにも検索したら色々載ってます。
例)https://www.canva.com/learn/professional-design-tips/

デザイン作成はPhotoshopやillustratorを使う人が多いですが、
お高いので、無料で使えるツールなどもあるようです。
例)https://blog.sedesign.co.jp/photoshopsubstitute

④コーディング
デザインが出来上がったらそれを元にコーディングをします。
コーディングでハマったときは、Chromeのデベロッパーツールや、Firefoxの開発ツールを駆使するのがおすすめです。
検索すると使い方が出てくるので是非!

そんなことわかってるよ。って内容書いてたらすみません><w

投稿2019/12/27 07:05

achamaru

総合スコア71

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

shinaozora50

2020/01/15 08:50

回答してくださったの、今頃なって見ました。遅くなって申し訳ございません。 どんなWebサイト作りたいか、いろんなWebサイト見たり、教えてくださったような他の人が作ったポートフォリをなどのサイト参考にして、考えてみることから始めたいと思います。 ゆっくり過ぎるかもしれませんが、教えてくださった方法参考にして、頑張ってみます。
achamaru

2020/01/16 07:48

私も最初は漠然と何をどうしたらいいのかわからない状況でしたのでお気持ち良く分かります。 参考になりそうで良かったです^ ^ 頑張ってください!
shinaozora50

2020/02/03 08:02

初心者が始めるといいといわれてる模写の為につくられたサイトなどから、模写始めることにして、今模写始めています。 色々と教えてくださってありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.47%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問