続々・はじめてのブログ

ブログ運営CSS, HTML, PHP, WordPress, はじめてのブログ

結局のところ、サイトの細かいカスタマイズをするにはプログラミング的なこともまったくの無知ではいられないということを悟ったので、かるーくgoogle先生に教えを請いました。かるーくね。

HTMLとかCSSとかPHPって結局なんなのさ

今までこれらのことは名前だけは知っていたけれど、あくまでも異世界の言語であって自分には関わりのないことだと高を括っていました。別に日常生活の役に立つわけじゃないしー、ってね。

けどまあ、強がってても仕方ないので、基本だけは押さえておきましょう。ここから書くことは、あくまでも僕が自分なりに理解したことなので、間違っているかもしれませんが悪しからず。まあだれもこんなどーでもいい文章読まんやろ。

HTMLについて

HTMLとは、Hyper Text Markup Languageの略で、正確に言うとプログラミング言語ではなく、マークアップ言語というらしいです。プログラミング言語がデータを処理(計算とか)するために使用するのに対し、マークアップ言語はデータを表現するために使います。何が違うのかよくわかりませんね。ま、細かいことはどうでもいっか。

一言でいうと、HTMLはサイトの骨格を作るために必要なものです。見出しはここ、段落はそこ、画像はどこ、といった具合に大雑把な構造を作るために必要で、サイト作成には必須のものであるようです。

CSSについて

CSSとは、Cascating Style Sheetsの略で、こちらもマークアップ言語の一種です。HTMLが大雑把な構造を記述するのに対し、CSSは細かい装飾、文書構造の表現に必要なものとなります。見出しは太字、背景は青色、とかね。

PHPについて

PHPとは、Hypertext Preprocessor(下線そこであってんのか?)の略です。これはプログラミング言語の一種で、サーバー上で機能します。

通常、HTMLで作成したサイトは静的サイト(静的HTML)といって、常に同じ内容が表示されます。しかし、PHPを使うとアクセスした時間や時期、アクセスした人といった条件に応じて異なる内容を表示させることができるようになります。

Googleで同じ単語を検索しても、必ずしも毎回同じ結果が返ってくるとは限らないのは一つの例ですね。このようなサイトを動的サイト(動的HTML)といいます。

静的ページにアクセスすると、毎回同一のHTMLファイルにより同一のページが表示されます。 静的サイトにおいてページの内容を変更したいときは、そのページのHTMLファイルを変更してサーバーにアップロードし直す必要があります。 なぜならHTMLはマークアップ言語であって、できるのはあくまでも記述された内容を表現することだけだからです。条件によって異なる処理をするような高度なことはしないわけです。

それに対し動的ページでは、サーバー上のデータベースに記事内容とかのファイルが保存されていて、アクセスがあった時点でデータベースの各種ファイルからページを構成して表示させるんだそうです。
だから、データベース上のファイルが更新されればそれに応じて表示される内容も変化するわけですね。

PHPというのは、この、アクセスした側からの情報を受け取り、それに応じてデータベースから情報を返すことで、動的にページを生成して表示させるというプロセスに必要な仕組みであるようです。

例えば、掲示板とかに何かしら書き込みがあったら、その都度誰かがHTMLを書き直してアップロードし直すのかというと、そんなことできるわけがないですね。
だからPHPを使った動的ページである必要があるわけです。

誰かが書き込みをしたら、その情報がサーバーに送られて、データベースの該当ファイルが書き換わって(?)、そのファイルをもとにページが再構成されて、書き込みが表示されるようになる、と。

また、WordPressを使って作成したサイトは動的サイトです。おそらくアメーバブログとかはてなブログとかの無料サービスもそうです。

例えば、新規記事を投稿するとトップページに自動的に表示されたり、他ページのサイドバーの新着記事に表示されたりします。
このように特定の操作が複数のページに影響を与えることができるのは、すべてのページがPHPを利用した動的ページとして構成されているからです。

WordPressでは、サイトのヘッダー、サイドバー、本文部分、フッターといった各パーツごとにPHPのファイルが作られています。

ヘッダーを変更したいときはheader.phpを変更、フッターならfooter.phpを、といった具合に変更を加えます。WordPressやそのテーマに備わっているカスタマイズ機能で変更を加えた場合、該当するファイルが変更を反映するように書き換わるということなのでしょう。

ちょっと理解があやふやなのですが、WordPressではすべてのパーツの構造がPHPファイルとして管理されていて、HTMLファイルというものはないそうです。

でもブラウザ上でサイトを表示する際はHTMLとして表示されるんだそうです。
つまり、本当はHTMLのファイルはないんだけど、PHPファイルの総体をHTMLとして認識する、みたいなことなんでしょうか。

難しいですね。

一応付け加えておくと、サイトを作成する言語というのは他にも色々あって、PHPはとっつきやすいからよく使われているというだけで、PHPでないと動的サイトが作れないということでは多分ないのだと思います。


ちなみに、動的サイトだから偉いとか、静的サイトはダメだとかそういうことは全くないです。
公開したい内容が適切に表示されるならなんでもいいわけで。サイトの性質にもよると思います。

ちょっと調べてみたところ、最近はむしろ静的サイトの方が作りやすいという意見が増えているそうです。お金も大してかからないし、動作は軽いし、セキュリティ的にも安心なんだとか。

まあ人によりけりですね。

勉強の後は実践しよう

さて、ここまでのことをまとめると、WordPressにおいて重要なのはページの基礎構造においてはPHPで、細かい装飾においてはCSSだということになりそうですね(ホンマかいな)。

実はもう一つJavaScriptってのがあるらしいんですが、もう疲れたのでこれ以上は深入りしません。
なんか、PHPがサーバー上で動作するのに対してJavaはサイトを閲覧する人のブラウザ上で動くプログラミング言語なんだってよ。へー。

とりあえずCSSを少しだけいじってみたのである

PHPについて長々と書いておいて、今んとこ触ってみたのはCSSだけなのです。
まあ、PHPを触る必要が今のところないっていうだけなんですが。

CSSで何を変えたかというと、見出しに黄色っぽい色がついてたりとか、サイドバーのタイトルにも黄色っぽい色がついてたりとか、記事タイトルの下に下線を入れてみたりとか、そんな程度です。

しかも、CSSについて真面目に勉強して自分で書いたわけでもなく、こちら↓のページからコードをコピペさせていただきました。

CSSのコピペだけ!おしゃれな見出しのデザイン例まとめ68選

こういうのは本当に助かります。いくら暇といってもいきなり専門的に勉強するのは大変ですからね。
こういったサイトは他にも色々とありましたので、一から自分で勉強しなくても最低限の装飾はできそうで安心しました。

本当はもっと色々カスタマイズするときれいで見やすくて良いのかもしれませんが、とりあえず見た目はシンプルでも問題ないので、設定をいじるのはこれくらいにして、そろそろ他にも記事を書いていこうと思います。

はじめてのブログ【完】

そんなわけで記事作成の練習がてら、ブログ作成にまつわるどーでもいい記事を3つほど書いてみました。

WordPressのエディタにも少し慣れつつあります。最初はいちいちブロックを追加していくやり方を煩わしく感じて、全部Classic Paragraphのブロック1つで書いたりしたんですが、段落のブロックを使うと行間が良い感じに開くのでまあ悪くはないかなとも思い始めた今日この頃。

見出しとか付けるといかにもって感じで体裁も良いですしね。

そういえば固定ページとして最初からプライバシーポリシーのテンプレみたいなやつがあって、よくわからんけどあった方が良いみたいなので適当に編集してのっけてみました。あれももっとちゃんと内容と表現を考えていかないとダメですね。

とまあそんなこんなで始まったブログですが、これからもっとどーでもいい記事が増えていくことになると思います。

いつまで続くことやら。


終わり