初心者がエンジニアに転職するための、壁打ちブログ('ω')

・CS、SV、TA、データサイエンス、などをIT業界で学んできた私が、 サーバーサイドエンジニアとして独立するまでのブログです

ゼロから始めるエンジニアへの道 #8

検証したこと

  1. Chromeconsoleを使い、企業のLPがどのような作りになっているかの検証と確認　

2.LPで言語ごとにどんな役割を指定して動作しているのか ※前提として、htmlだけで非常に量が多いので抜粋して記載

検証

~
  <head>
        <title>[企業名]~サブタイトル~</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="_css/import.css">
        <script async="" src="//dmp.im-apps.net/js/1001214/0001/itm.js">
        </script><script async="" src="https://b92.yahoo.co.jp/search/?p=L2X3FLYE84&amp;label=&amp;ref=https%3A%2F
~
  • これから書くhtmlのcarsetで、文字コードの指定
    • meta属性(name or content)について↓↓

dekiru.net


リンクタグ中のrelとhref属性について↓↓　

rel属性

www.mitsue.co.jp

href属性


www.sejuku.net

HPやLPをみての疑念の払拭

  • Souce以外に、別の言語(js / css )などのscriptを導入することができる
    • というか導入しないと、動的なコンテンツを作れない。　
      • パット見てイメージが湧いたのはscripttagを使いsrc属性で、別のクラウド上のディレクトリ（なのかわからない）を指定。（下記にディレクトリのイメージパスを記載します。　

f:id:Takeda2864:20200512175133p:plain
ディレクトリのイメージパス

ちょっとした愚痴　

  • ←箇条書きを記載する際に*を前頭に文書を作成します。　
    • 場合によってが<br>を記載して、markdownの行間を開ける属性をいれるのですが、上手にいかないことが多い。

学習範囲（追記予定）

1.<ul>tag の使い道と意味　
2.listitagの略で<li>tagをul内に収める
3.文書の意味と定義に合わせたtagの重要性　

ローカル画像が表示できなかったので、Gsuiteのdriveにディレクトリパスを紐づけて表示した

  • データディレクトリを作成でき、ドメインに依存して手軽な共有ができる。　　
    • データファイルの表示等を共有するだけなら、「共有リンクを作成」でOK
    • コードを使い、ブラウザ表示する場合に、要素から物故抜きしないと表示されない↓↓

f:id:Takeda2864:20200514175557p:plain
こんな感じ

  • クロームのconsoleで、html要素から物故抜きしてくると、表示できる様子
    • 他にも方法があるらしいのですが、 やり方がわからないので割愛。