社会不適合者ウーマンのひとり語り日記

生きづらさと社会性のなさでもがく成人女性のブログ。映画(洋画・邦画)/音楽/日々感じたこと/ゲーム/アニメなどを書いていきます。

【祝・独学】HTMLとCSSだけで簡単なレスポンシブ対応webサイトを作れた件について

おっすおっす。

misopotaです。

 

3月ごろから本格的なwebサイト制作を学んできましたが、ついについに…。

 

オリジナルのwebサイトを作れたんです!

(しかも、レスポンシブ対応・FTPソフトを使ってアップロード済み)

 

ちょっと18禁のサイトっぽく仕上げたので、ここでは載せられませんが、とにかくできました。

 

今までFTPソフトでのアップロードの仕方とか、そもそもレスポンシブのやり方とか…。

 

ほぼ分からない状態でやってきたので、苦労が報われてよかったなという感じです。

 

今回使ったサーバーは、「FC2ホームページ」と「FFFTP

どちらも無料で利用できます。

 

使ったエディターは、「Visual Studio Code」。(こちらも無料です)

あとは、フリー画像サイトのぱくたそを使って、仕上げました。

 

1ページだけですが、PC・スマホともにデザインも割としっかり反映されていてうれしかったです。

 

レスポンシブをしていく上で気づいたことは、次の通りです。

 

  • レスポンシブで右に謎の余白ができる場合は、要素全体にoverflow:hidden;をかけておく
  • 画像は、幅を100%にして高さは0にしておく
  • 横並びにした要素は、display:blockで解除する
  • 気になったところは微調整をする

 

とりあえず、レスポンシブでoverflow:hidden;がとても有能であることは分かりました。

 

はじめて自力で作ったサイトなので、至らない点は多々あります。

 

その分、模写コーディングや実際に自分のサイトを作るなどして、技術を上げてweb関係のお仕事に就けるように頑張っていきたいです。

 

8月から簿記3級の勉強に移るので、それまでに基礎的な部分はマスターしていきます。

 

慣れてきたら、はてなブログのカスタムや全体のデザインの変更等もやっていきたいです。

 

では、また次のブログでお会いしましょう!