教えて!しごとの先生
教えて!しごとの先生
  • 解決済み

広告のデザイナーをしている者です。 仕事の都合上、HTMLなどのプログラミングを身につけるように指示を受けたのですが、…

広告のデザイナーをしている者です。 仕事の都合上、HTMLなどのプログラミングを身につけるように指示を受けたのですが、 正直プログラマーの適正が無いのか、習得に難儀しています。困っていることを羅列しますが、下記のような私にプログラミングは厳しいでしょうか? 今まで仕事をしてきて、「流石に自分には合わないかも」と思ったのは初めてです… ・子供の頃から勉強は数学だけ極端にできない ・プログラムコードのゴチャゴチャ感が苦手。 ・webサイトの『デザインは』できる ・地道にコードを書く作業に耐えられない ・せっかちな性格 ・そもそもプログラミングに興味がない ・普段のデザイン業が忙しく、時間を割けない

続きを読む

158閲覧

知恵袋ユーザーさん

回答(10件)

  • ベストアンサー

    プログラミングをやらない普通の人から見れば、プログラミングも、プログラミングではないと言われる HTML も、同じに見えるはずです。2つの違いは分からなくても良いです。 情報化社会がこれまで以上に仕事に浸透してきている現在なので、これまで慣れてきたやり方との違いに苦しむ人はたくさんいまして、困っているのは質問者さんだけではないと思います。 広告のデザインも HTML が関わってくるとそれを見なければならないこともあると思います。一時的な都合だとしてもこれも情報化社会の一端ですよね。 >下記のような私にプログラミングは厳しいでしょうか? 「プログラミング」や「HTMLのような "記述言語" 」も、どちらも画面の中で記号や文字がズラリと並び、論理的に意味を持っている、というところは同じです。 数学も言われてみれば似てますよね。 問題文も、数字と記号を組み合わせた計算式も、論理的に意味を持っていて、それを読み解かなければなりません。 厳しいかどうかについては、厳しいです。 でも、「仕事の都合とはいえ、質問者さんの仕事ではない」っていうのが正解ですかね? でもそこを何とかやらなければならないということですよね。 やってみてダメなら指示者の方に 「ちょっと無理です」 と伝えて、『HTMLコーダー』(HTMLコードを組む人)を短期のバイトとかで雇うなり、代替策を考えてもらって下さい。 【即席HTML講座】 その HTML ファイルのコピーを取り、ファイル名を「理解用.html」にします。 コピーならば中身を自由に荒らしても問題ありません。 1. 大前提がある <html>    <head>       何か書かれている1(目に見えない、設定に関するタグが並ぶ)    </head>    <body>       何か書かれている2(目に見える、デザインを形作るタグが並ぶ)    </body> </html> この形は大前提でほとんど崩れません。 2. タグの形 その1 タグには大別して2種類あります。 <div></div> や <span></span> など のような開始タグと終了タグが必ず組になっているものと、 <img> や <br> など のような1つのタグで完結するもの、の2種類です。 3. タグの形 その2 < と > でくくったタグの中には、いろいろ設定を書くことができます。 それは「A は 1 です」、「B は 2 です」、というような、 設定項目="設定値" という形の設定です。 それらが半角スペースで区切っていくつか並んだりします。 <body>         ← 設定がない場合    <div id="wrapper">       ← 設定が1つの場合       <div id="root">          ← 設定が1つの場合          <div id="Detail" data-reactroot="">    ← 設定が2つ並んでいる場合          </div>       </div>    </div> </body> タグの形は基本的に以上です。 それ以外には、 <!DOCTYPE html> とか、 <!-- コメント --> というものもありますが、それらは例外的なものです。 4. ゴチャゴチャ感対策 ゴチャゴチャの例: 以下のようなものだとお手上げですが、 <body>    <div id="wrapper">     <header class="Detail_chie-Pages__Header__2FmyX"><div class="ClapLv1VisuallyHidden_Chie-VisuallyHidden__VSsSO"><h1>Yahoo!知恵袋</h1></div><div class="Detail_chie-Pages__Masthead__1mmq2"><iframe id="TEMPLA_MH" style="width:100%;height:88px;border-width:0" src="https://s.yimg.jp/images/templa/static_mhd.html" title="ヘッダー"></iframe></div></header></div> </body> 上記を以下のように書きなおすと整頓されて、なんとか手を付けられそうではあります。 <body>    <div id="wrapper">       <header class="Detail_chie-Pages__Header__2FmyX">          <div class="ClapLv1VisuallyHidden_Chie-VisuallyHidden__VSsSO">             <h1>                Yahoo!知恵袋             </h1>          </div>          <div class="Detail_chie-Pages__Masthead__1mmq2">             <iframe id="TEMPLA_MH"                   style="width:100%;height:88px;border-width:0"                   src="https://s.yimg.jp/images/templa/static_mhd.html"                   title="ヘッダー">             </iframe>          </div>       </header>    </div> </body> この整頓のポイントは、i, ii, iii, iv, v, vi とありまして、 i. > の直後で改行をする。 ii. 開始タグ、開始タグと続くところは、< の直前でキーボードの Tab キーを押して段々畑みたいになるようにする。 <header ...> <div ...> <h1> ↓↓ <header ...>    <div ...>       <h1> iii. 開始タグと終了タグのあいだのテキストも段々畑のようにする。 <h1> Yahoo!知恵袋 </h1> ↓↓ <h1>    Yahoo!知恵袋 </h1> iv. 開始タグと終了タグの対応を冷静に見て、きちんと Tab の数を合わせる。 <header ...>    <div ...>       <h1> Yahoo!知恵袋 </h1> </div> </header> ↓↓ <header ...>    <div ...>       <h1>          Yahoo!知恵袋       </h1>    </div> </header> v. タグの中の設定が長すぎるときは、設定ごとに改行して、Tab を使って見やすくする。 <iframe id="TEMPLA_MH" style="width:100%;height:88px;border-width:0" src="https://s.yimg.jp/images/static_mhd.html" title="ヘッダー"> </iframe> ↓↓ <iframe id="TEMPLA_MH"       style="width:100%;height:88px;border-width:0"       src="https://s.yimg.jp/images/templa/static_mhd.html"       title="ヘッダー"> </iframe> vi. さらに見やすくするために、空行を自分なりに上手に入れてみる。 <body>    <div id="wrapper">       <header class="Detail_chie-Pages__Header__2FmyX">          <div class="ClapLv1VisuallyHidden_Chie-VisuallyHidden__VSsSO">             <h1>                Yahoo!知恵袋             </h1>          </div>          <div class="Detail_chie-Pages__Masthead__1mmq2">             <iframe id="TEMPLA_MH"                   style="width:100%;height:88px;border-width:0"                   src="https://s.yimg.jp/images/templa/static_mhd.html"                   title="ヘッダー">             </iframe>          </div>       </header>    </div> </body> ※こういう手作業の整頓も、「Adobe DreamWeaver」等のホームページ編集ソフトに一度読ませると、簡単に除去される場合があるので注意してください。

  • ChatGptに聞きながらやると割と楽に学べますよ!

  • 本物のデザイナーの方ですか。そうですね、諦めた方が良さそうですね。 >・せっかちな性格 せっかちなのではなく、考えたくないだけだと思います。 所謂天才型のデザイナーなのでしょう。数字を色々計算する系のデザイン論なども勉強したことは無いと思います。天賦の才だけで今までやってきたので、肌に合わない系の作業はできないのだろうと思います。 プログラミングは才能が無くてもできますが、努力は必要です。才能にあぐらをかいて努力をしてこなかった天才には難しいことでしょう。

    続きを読む
  • 書いた通りの表示をするのがHTMLなのでプログラミングってほど難しくはないかな。 コードを書き出したら書ききらないといけないわけでもないし、 部分部分で作って組み合わせることもちゃんとできる。 ・webサイトの『デザインは』できる これがどういう意味かはよくわからんが、デザインした通りに表示するよう打ち込んであげればいい。

    続きを読む

< 質問に関する求人 >

プログラマー(東京都)

この条件の求人をもっと見る

< 質問に関する求人 >

デザイナー(東京都)

求人の検索結果を見る

もっと見る

この質問と関連する質問

    職場・人間関係に関する質問をキーワードで探す

    < いつもと違うしごとも見てみませんか? >

    覆面調査に関する求人(東京都)

    この条件の求人をもっと見る

    Q&A閲覧数ランキング

    カテゴリ: 職場の悩み

    転職エージェント求人数ランキング

    • 1

      続きを見る

    • 2

      続きを見る

    • 3

      続きを見る

    あわせて読みたい
    スタンバイプラスロゴ

    他の質問を探す

    答えが見つからない場合は、質問してみよう!

    Yahoo!知恵袋で質問をする

    ※Yahoo! JAPAN IDが必要です

    スタンバイ アプリでカンタン あなたにあった仕事見つかる