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

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

新規登録して質問してみよう
ただいま回答率
85.35%
Webサイト

一つのドメイン上に存在するWebページの集合体をWebサイトと呼びます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

4回答

995閲覧

ポートフォリオ作成の為の学習で自分の段階にあった、、、

tamachano

総合スコア4

Webサイト

一つのドメイン上に存在するWebページの集合体をWebサイトと呼びます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

1クリップ

投稿2020/02/20 09:55

編集2020/02/20 10:27

初めまして!僕はWebプログラマーの就職を視野にポートフォリオを作成したいと考えているのですが、
ProgateのHTML CSSコースを学習し終えましたので、どのように皆さんしているのか気になって検索してみた結果、模写から入るのが良いという記事や呟きが多く見られました。

そこで実際やってみようとしたのですが、実際には学習してない内容のコードが書かれていたり、あまりにもまだ模写へのレベルにハードルの高さを感じていますが、今の段階におすすめの学習法などあれば教えていただけないでしょうか?

今は調べながら既存のサイトを写経しながら学習しています。

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

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

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

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

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

m.ts10806

2020/02/20 10:04

Web系企業って結構広いんですが、何を目指してるんでしょうか。
tamachano

2020/02/20 10:08

記載し忘れてました。。Webプログラマーです。
m.ts10806

2020/02/20 10:35

>Webプログラマー これも広いんですが・・
kyoya0819

2020/09/19 01:16

ただバイトか、要実務経験が多いですね。
guest

回答4

0

業界研究を綿密に行ったうえで具体的なゴールを設置してください。
そのゴールが明確でない状態で「あれやろう」「これやろう」と模索しても一向に向かっていきません。

それによって求められるポートフォリオも違ってきます。
ということは身に着けるべき技術も違ってきます。

「HOW」ではなく「WHAT」「WHY」が先です。

「何になりたいか」「なぜなりたいか」なしに「どうやっていこうか」は決まりません。

仕事としてやっていきたいのでしたら尚更小手先では通じません。
模写をポートフォリオとして出すのでは何一つアピールポイントになりません。
なぜなら既にあるものだから。独自性も感じられないし、技術力をはかる指標にはなりません。
模写なので、お手本が目の前にあるので、コードコピペしてちょっと変えただけということも可能です。

いわば「作品集」ですよね。
自分でテーマ決めて考えて作ってないものを「作品集」と言えるでしょうか。

企業が求める人材には方向性と基準があります。

業界研究なしには作るものは決まらないですよ。

投稿2020/02/20 10:52

m.ts10806

総合スコア80875

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

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

tamachano

2020/02/20 11:04

業界研究というのはどういうことでしょうか? 業界研究というのはなにかWeb系企業の業界研究ですか??よく具体的に分かりません。 模写というのはそういうことではなく、1からソースコードを見ずに手本のページを書くことだと理解していますが違いますでしょうか?
m.ts10806

2020/02/20 11:28 編集

>業界研究というのはどういうことでしょうか? 大学なり高校なりなんてもいいんですが、受験校決めるときに「ここはどういう学校だろうか。何が強みだろうか」調べませんか?それと同じです。 「何があるのか」知らないからには目指すものは決まりませんよね。 自分で会社おこすわけではなく「就職する」なのですから。 何を求められているか知らないことには何もできません。 仕事は相手があることです。自己満足で進めてもお仕事にはなりません。 >模写というのはそういうことではなく、1からソースコードを見ずに手本のページを書くことだと理解していますが違いますでしょうか? もう少しきちんと回答を読んでください。 模写はあくまでお手本となるサイトがある前提です。 それをポートフォリオとして出しても何一つ企業に響くものにはならないんですよ。 例え「あくまで地力をあげるためだ」という前提だとしても(それ書かないと分からない) ポートフォリオのための練習にはなりません。 「模写先のサイトをレイアウトを組む力」しかつきません。 なぜなら見た目だけ合えばそれでいいということになるから。 どういう意図で、どういう意味を持たせて、このように組んだ ときちんと語れるようになる必要があります。 それなら自身でテーマを決めてどんな簡単なものでも 出来が不細工なものでも、「自分プロダクト」をたくさん生み出していった方がいいです。 で、しばらく経った後に過去の自分プロダクトを見てみて 「今ならこう作るな」とか言えるようになればそれは成長です。 模写では成長も見えにくいと思いますよ。 やろうと思えばカンニングできるから。 模写することが目的になってしまいがちですからね。 それに模写系の質問に対してはteratailの回答者の対応は結構ドライです。 「業務で対応する」ことを考えた場合、別に何を見てたって構わないわけですから。要件さえ満たせていれば。 それなら、自身で要件を考えて部品なり作品を作り続けた方が良いでしょう。
guest

0

模写のやり方としては、
参考サイトをみて、自分なりにコーディングしてみる、というのがオススメです。
画像は拝借し(なので、ローカルに落としてきて、オンラインには公開しない前提)コードは自分で書く、といった具合です。
参考サイトのソースコードを見て、そのまま書いただけでは、なんの練習にもなりませんので、ソースコードを見るのは最後の最後どうしてもわからなければ、にしておきましょう。
なので、まずはProgateで得た基礎を元に、
本などを見て、とにかく、サイトを作りまくる、のが一番の学習方法かと。

さて、Webプログラマーとなると、質問者さんの目指す職種とはかなり変わってしまう印象を受けます。
HTML、CSSだけではプロのWebプログラマーとして食っていく!とは難しいと思います。
(どちらかと言うと、Web系のプログラム方面を全て包含してるとなると、PHP、Rubyと言った、サーバーサイド言語を使うことも必要になるかと)
また、現代では、その二つだけでは、フロントエンドエンジニアとも言えなくなってきてます。

Webフロントエンドエンジニアを目指すなら

現代ではJavaScriptも必須になります。
HTMLとCSSだけだと、駆け出しア○メーターに少し毛が生えた程度しか稼げない可能性があります。
なので、ここをまず目指すなら、JavaScriptも学習してください。

Webデベロッパーを目指すなら

上記+PHPなどのサーバーサイド、API連携などの技術も必要になるかと思います。
最低限知識は必要になります。
また、場合によってはCMSのカスタマイズ、フロントエンドフレームワークを扱えることも求められるでしょう。

Webプログラマーを目指すなら

そういった職種があるのかは定かではありませんが、
言葉の印象からするに、上記の全てを包含している、と解釈するならば、
JavaScriptやPHPなどを組み合わせた大規模Webアプリケーションとかを開発することも求められるのではないでしょうかね。
あと、そうなると、ただ書くだけではなく、大規模開発に求められるオブジェクト指向な書き方とかも求められると思います。
場合によってはスマホアプリとの連携のために、ネイティブを理解し、ある程度開発することも求められるでしょう。

用語に関しては調べてみてください。

さぁ、どこを目指しますか?

投稿2020/02/20 10:33

編集2020/02/20 10:50
miyabi_takatsuk

総合スコア9555

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

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

miyabi_takatsuk

2020/02/20 10:37

そして、これはあくまで技術での話に過ぎないので、 「仕事」をしていくならもっといろんな能力が求められますことをご承知おき下さい。
m.ts10806

2020/02/20 10:44

>HTML、CSSだけでは到底プログラマーとは言えません。 んー。名乗ってもいいんじゃないかなぁと個人的には思います。 一応HTMLのLはLanguageですし。 具体的に目指す方向性がないと実は答えようがない質問ですね。 そのあたり考慮してほぼ全て挙げたのは、優しいなぁと。
miyabi_takatsuk

2020/02/20 11:05 編集

m.ts10806さん > 確かに、名乗るのは全然してもいいかもですね。 言語ちゃっ言語ですもんね 汗 HTMLはWikipediaによるとマークアップ言語とよばれるものらしいですね。 回答修正します。 確かに、ひとえに一言では言えなくなってきてる分野でもありますし、答えようがなかったのですが、 ひとまず、挙げれるだけ挙げてみました 汗
tamachano

2020/02/20 10:59

お二人とも回答ありがとうございます! 細かい方向性までは今は考えてないですが、現在Rubyは学習しています。今後も他の言語は勉強していきますが、HTML、CSSを学習してなるべく早い段階でアウトプットする為にも、学習にも形にもなるものを作りたいと考えました。 サイトを作る段階で今困っているので動画や本を参考にして作成してみるのが一番ですよね。。 将来的な話はまだこれから定めていく必要性がありますね。。
miyabi_takatsuk

2020/02/20 11:04

ProgateのHTML CSSコースを卒業されたのであれば、 まずはフロントエンドエンジニアではないでしょうかね。 Webデベロッパーとなると少しハードルが高くなるかと。 Rubyですか・・・。 ひとまず、そのことも質問本文に含めましょう。 Rubyは静的型付けの、かっちりしたクラスベースのオブジェクト指向言語のようなので、 ハードルは高いかと思いますが、どうか頑張ってください。 でも・・・もし、フロントエンド目指すなら、Rubyより先にJavaScriptの方がいいかと思いますけどね。 (最終的には質問者さん次第)
m.ts10806

2020/02/20 11:08

>現在Rubyは学習しています。 その絶対的な判断基準と言うか、前提を出さないのは時間の無駄にしかならないですよ。今からでも追記してください。 (とはいえRuby案件って結構地方差大きいような)
guest

0

回答ではないですけど、なんか色々間違ってませんか?

ポートフォリオって、ただの自己紹介のためのツールです。
自己紹介のために学習するって本末転倒では?

模写って何を表現したいのか正直理解できません。

投稿2020/02/20 11:35

退会済みユーザー

退会済みユーザー

総合スコア0

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

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

0

模写から入るのが良いという記事や呟きが多く見られました。

写経はインプットですので、Web技術をもし身につけたら何をしたいかを逆算し、その何かにいきなり着手してみましょう。

不足している技術などたくさん出てくるかと思いますが、それらを一つ一つ理解していくことで技術力は向上し、最終的にその何かがポートフォリオになります。

投稿2020/02/20 11:41

退会済みユーザー

退会済みユーザー

総合スコア0

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

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

ただいまの回答率
85.35%

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

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

質問する

関連した質問