POST　パラメーター渡し

現在マッチングサイトをポートフォリオとして制作しています。検索ボタンを押した際にURLにパラメーターとして検索条件を含めてPOSTサーバー側にデータを渡せるようにしたと考えています。
検索ボタンがあるページはこのリンクになります。⇒https://hayato0904.github.io/search.html
現段階はindex.phpのファイルにデータの移動を完了している状態です。
カラムのデータを引っ張り出し表示している状態です。下記画像になります。

html![index.phpの内容。](f5a6df1c80860055d3ec3a613821076f.png)
1コード<!DOCTYPE html>
2<html>
3 <head>
4  <link rel="stylesheet" type="text/css" href="/css/profile.css">
5  <title>駆け出しエンジニアマッチングサイト</title>
6 </head>
7<body>
8
9  <div class="header">
10    <div class="header-logo">駆け出しエンジニアとマッチング</div>
11  </div>
12
13  <div class="main">
14    <div class="copy-container">
15      <h1>自分のプロフィール</h1>
16    </div>
17
18    <div class="contents">
19        <h1 style="background-color: black;">画像登録＆更新</h1>
20        <h2>※登録済みのユーザーのみ変更可能</h2>
21        <img src="https://www.pakutaso.com/shared/img/thumb/0I9A5582ISUMI.jpg"　width="200" height="400">
22          <h2>プロフィール画像</h2>
23          <div class="faile">
24            　 <button onclick="return confirm('ファイル選択画面に移動します。')">ファイルを選択</button>
25           <button onclick="return confirm('指定されている画像を削除します。よろしいでしょうか？')">削除</button>
26          </div> 
27          <button onclick="return confirm('指定されている画像を更新します。よろしいでしょうか？')">更新</button>
28
29           <div class="contents">
30            <h1 id="tera">
31            <h1 style="background-color: black;">ユーザー名</h1>
32            <input placeholder="ユーザー名を入力してください。">
33            <h1 style="background-color: black;">希望する活動場所(複数回答可)</h1>
34            <input placeholder="希望する活動場所を入力してください。(複数回答可)">
35            <h1 style="background-color: black;">使用できるプログラミング言語 複数回答可</h1>
36            <input type="checkbox" id="check1">
37        　　<label for="check1">HTML</label>
38        　　<input type="checkbox" id="check1">
39        　　<label for="check1">CSS</label>
40        　　<input type="checkbox" id="check1">
41        　　<label for="check1">JavaScript</label>
42        　　<input type="checkbox" id="check1">
43        　　<label for="check1">Ruby</label>
44        　　<input type="checkbox" id="check1">
45        　　<label for="check1">Python</label>
46        　　<input type="checkbox" id="check1">
47        　　<label for="check1">Java</label>
48        　　<input type="checkbox" id="check1">
49        　　<label for="check1">Go</label>
50            <input type="checkbox" id="check1">
51            <label for="check1">SQL</label>
52            <input type="checkbox" id="check1">
53            <label for="check1">PHP</label>
54            <input type="checkbox" id="check1">
55            <label for="check1">C言語</label>
56            <input type="checkbox" id="check1">
57            <label for="check1">C++</label>
58            <h1 style="background-color: black;">実務経験歴</h1>
59            <input placeholder="実務経験歴を入力してください。">
60            <h1 style="background-color: black;">自分の年齢</h1>
61            <input placeholder="自分の年齢を入力してください。">
62            <h1 style="background-color: black;">相手の希望年齢</h1>
63            <input type="checkbox" id="check1">
64            <label for="check1">10代</label>
65            <input type="checkbox" id="check1">
66            <label for="check1">20代前半</label>
67            <input type="checkbox" id="check1">
68            <label for="check1">20代後半</label>
69            <input type="checkbox" id="check1">
70            <label for="check1">30代前半</label>
71            <input type="checkbox" id="check1">
72            <label for="check1">30代後半</label>
73            <input type="checkbox" id="check1">
74            <label for="check1">40代以上</label>
75            <h1 style="background-color: black;">目標</h1>
76            <input placeholder="自分の目標を入力してください。">
77            <h1 style="background-color: black;">自己紹介</h1>
78            <input placeholder="自己紹介を入力してください。">
79            <h1 style="background-color: black;">Twitter</h1>
80            <input placeholder="自分のTwitterのリンクを入力してください。">
81            <h1 style="background-color:black;">更新</h1>
82            <p><button onclick="return confirm('記入された内容を更新します。よろしいでしょうか？')">更新</button></p>
83          </form>
84          </div>        
85          　　　　　 <table border="1" width="80%" bordercolor="#green" bgcolor="#f5f5f5">
86            <tr bgcolor="deepskyblue">
87                <td>ユーザー名</td>
88            </tr>
89            <tr>
90                <td>山内まりあ</td>
91            </tr>
92            <tr bgcolor="deepskyblue">
93                <td>希望する活動場所</td>
94            </tr>
95            <tr>
96                <td>東京</td>
97            </tr>
98            <tr bgcolor="deepskyblue">
99                <td>使用できるプログラミング言語</td>
100            </tr>
101            <tr>
102                <td>PHP</td>
103            </tr>
104            <tr bgcolor="deepskyblue" >
105                <td>実務経験歴</td>
106            </tr>
107            <tr>
108                <td>3年</td>
109            </tr>
110            <tr bgcolor="deepskyblue" >
111                <td>自分の年齢</td>
112            </tr>
113            <tr>
114                <td>21歳</td>
115            </tr>
116            <tr bgcolor="deepskyblue" >
117                <td>相手の希望年齢</td>
118            </tr>
119            <tr>
120                <td>20代前半 20代後半</td>
121            </tr>
122           <tr bgcolor="deepskyblue" >
123                <td>自分の年齢</td>
124            </tr>
125            <tr>
126                <td>23歳</td>
127            </tr>
128            <tr bgcolor="deepskyblue" >
129                <td>目標</td>
130            </tr>
131            <tr>
132                <td>プロジェクトマネージャーになること</td>
133            </tr>
134            <tr bgcolor="deepskyblue" >
135                <td>自己紹介</td>
136            </tr>
137            <tr>
138                <td>元気が取り柄です！よろしくお願いします。</td>
139            </tr>
140            <tr bgcolor="deepskyblue">
141                <td>Twitter</td>
142            </tr>
143            <tr>
144                <td></td>
145            </tr>
146            </table>  
147            </tr>
148            </table>
149        </div>
150  </div>
151  <script src="profile.js">
152    console.log('Hello World');
153  </script>
154</body>
155</html>

退会済みユーザー

2020/09/02 13:19

ちょっと何を言っているのかわかりません。質問は何で、何をやって、どう意図と違う結果が出ているのでしょうか？

退会済みユーザー

2020/09/02 13:25

htmlとしてヤバいので、w3c validatorとか文法チェックを加えてみるのもよいかと。

javahack

2020/09/02 14:27

https://teratail.com/questions/288984 同じ内容の質問を立てるのは非推奨です。 https://teratail.com/help/avoid-asking

行動規範の内容に同意します

回答2件

formの閉じタグしかないけど、それでいいのでしょうか？

投稿2020/09/02 13:24

退会済みユーザー

総合スコア0

HTMLで気になったのが、

上記に記載しているページに存在するlabelタグの文字をクリックすると、「使用できるプログラミング言語（複数選択化）」の「HTML」にチェックが入るようになってます。
h1タグを乱用しすぎです。h1タグはできるだけ1ページに1つとしたほうがSEO的にも見栄え的にもよいです。
タグにidをふってますが、同じid名をわりあてるのはやめましょう。（例えばid="chedk1"）同名のidを割り当てたいなら、idではなくclassを使ってください。
項目をplaceholderで表現してませんか？プレースホルダーはそんな使い方はしないです。。

ん。結構ありましたね。。

投稿2020/09/02 14:07

編集2020/09/02 14:08