(メモ）
target=”_blank” rel=”noopener” を追加
最近、HTMLでブログを書くことが多いんだけど楽しい。
例えば、pやbr、h1~h6などのコードの仕組みを理解すれば簡単に書ける.
特にNeocitiesというサイトで簡単に自分のWEBサイトが作れるから、気になる人はやってみてほしい。
無料＆広告なしで個人サイトを作成できるGeocities風サービス「Neocities」を使ってみたよレビュー（GIGAZAINE)
近日中にHTMLに関するマニュアルなども作成したいなぁって思う。
HTMLでのブログは軽量だし、特に言葉が好きな人、表現することが好きな人、炎上しても比較的に被害が会うことも少ない。（そもそもコメントする機能がないからね。壁打ちできる自分だけのSNSって感じ。コメントのない公開日記に近いかな。ツイッターとかに宣伝しない限り。）
当初は、ワードプレスでやろうかなって思ったけど、色々と設定がめんどくさいし、これでいいやってなちゃったｗｗ
ワードプレスは、たしかに便利だけど僕みたいにシンプルなサイトで軽量を目指したり、微調整がしたいタイプはHTMLのコードを覚えればいいと思う。
どうしても、覚えたい人は以下のことを覚えておけばいいよ。
・コードを書く際は、(body)と(/body)の間に書きたい言葉を書く。
・(p)書きたい言葉(/p)という形で（本来は< >で囲うがエラーが起きるのでカッコで書いてる。)
・Titleは、自分の好きな言葉でいい。それが見出しになるので。
・h1からh6は、文字の大きさ。h1が一番大きいサイズ。h6が一番小さいサイズ。例を下記に出す.
・(br)のコードを使うと、スペースや改行を行えるので覚えておくとよい.
・リンクを張りたい時は、そのまま(p)を使ってもいいし、タイトルをコピペするだけでもいい
👇HTMLのリングタグを使いたいなら書き方はめんどいのでここから学んでください。
HTMLのリンク作成｜リンクタグの使い方と【a href】の意味を優しく解説
・文字を強調したい場合は、(strong)のタグ、HTMLコードを使う。
・キーボードのHOMEボタンとENDボタンで文の最初と末尾に移動できるので覚えておくといい.
・ホームページで個人情報を入力する際にTABキーを押すと、自動的に移動できるので便利
・Ctrl＋Sで”保存”のショートカットになるので覚えておくといい.(Neocitiesで）
・Ctrl+Zで一個前の入力を戻すことができる
・Ctrl + Y 元に戻した操作を戻す
・困ったら、右クリックして、”ページのソースを表示（V）”でコードが見れるので、そこから勝手にコピペしてもいいよ.
【完全版】ショートカットキー早見表・一覧【Windows/Google/Office】
針千本 HTML(知り合いによるHTML解説書）
簡単なHTMLの書き方（これが一番わかりやすい。見返すのもおすすめ)
デザインの学校 これからはじめる HTML & CSSの本 [Windows 10 & macOS対応版] 【税込み ￥2,178円】（買うならこの本がおすすめ！)
後は直接レンタルサーバー借りて、やりたい人はFTPサーバーを使ってやればいいよー。
まあ、めんどくさい人は素直にワードプレスの設定を勝手にやってくれる大手のレンタルサーバーにしよう！ｂ
Let's note SV7とSV8(それぞれ2万円程度で手に入る)
それぞれ仕事と趣味で分けれる。（LinuxとWindows用など）(テレワークにも使える）
be stockというサイトがおすすめ
・VPSできるようになる（Linuxサーバーサイド勉強）
・持っているノートPCで鯖を作る
・VPNとLinuxサーバーサイドの勉強必要（もしくはオフラインで起動させて勉強だけする？)
(知識）
Devuan でやること
・DHCP による動的IPアドレスではなく静的IPアドレスにする
(192.168.x.x の部分を固定にする)
・PC のフタを閉ぢてもスリープしない様にする
・SSH でアクセスできる様にする
・Windows で Devuan に SSH ログインしてみる
・Devuan で HTTP サーバー (Apache か Nginx) をインストールして起動する
・Windows で http:// 192.168.x.x で HTTP サーバーに接続してみる
・Windows で、WinSCP などのソフトを使用して、Devuan に html を配置する
・ラズパイ DDNS
あと、style.cssのファイルにこのコードをコピペすればスマホでもバランスよく見れる
👇のコードをstyle.cssのコードを打つ場所にコピペして、保存すればOK.メモ帳とかに張ろう。なんなら
※bodyの所から一番最後の}までコピペする
body { background-color: white; color: black; font-family: Verdana; } cssコピーする編集する/* スマホ用（共通） */ .menu ul { flex-direction: column; gap: 10px; } @media screen and (max-width: 640px) { /*-- このコメント行の下に、スマートフォン用のCSSを記述 --*/ body { width: 100%; margin: 0px; font-size: 1em; text-align: center; } img { max-width: 100%; height: auto; width /***/:auto; } } @media screen and (min-width: 641px) { /*-- このコメント行の下に、既存のPC用のCSSを全て入れる --*/ body { margin: 0; padding: 0; } }
TOP
