おはモニ。
どうもひめたそん@himetasonです。
ブログの運営やサイトの運営をしていると、デザインなど色々な分野に興味が出てくると思います。
WordPressのテーマをカスタマイズしたい。思うようなレイアウトを実現したい。
はたまた自分で１から作ってしまいたいという人もいるかもしれません。
WEBプログラミングという分野になってくるのですが、その情報は世の中に沢山あります。
その中で何から覚えていいかわからないという人も多いと思うんですよね。
今回はそんな悩みを解決する内容をお届けします。
参考にしていただければ幸いです。
僕は主に文章執筆のみでプログラムなんて数年前にJAVAアプリ開発を齧ったくらいでした。
しかしちょっと行動に移してみるとWordPressのテーマを１から自分で製作するまで１週間で出来てしまったんですよね。
１から作らなくてもオリジナリティの演出に役に立つことは間違いないです。
もちろん情的サイト（ホームページなど）ならもっと敷居は下がりますよ。
たった２冊の本から学べるWEBプログラミング
さてみなさんが迷うのは、そもそも何を覚えたら良いの？って話だと思います。
WEBサイトで構成されているHTML、CSS、PHP、JavaScript
HTML：サイトを構成する内容
CSS：デザイン
PHP：関数（WordPress）
JavaScript（複雑な動きや機能）
いきなり全ては難しいと思いますし、他にもあります。
その中でもまずはCSS、HTMLから始め、次にPHPを覚えることをお勧めします
いきなり１から全てを作るのは難しいのでまずはデザインを変えるところから始めるのが敷居も低く楽しく感じると思います。
見た目を変えることは変化を感じやすく覚えやすいですしね。
その後からPHPを覚えると良いです。
おそらく同時は地獄ですのでね。
.text {
color: #fff;
.background-color: #000;
}
[/codebox]
この例だとclassであるtextという要素の文字が白、背景が黒になるという簡単なコードです。
CSSではこのようにデザインを変えることができます。
ブログデザインなどの外見はCSS。
WordPressの機能などはPHP。
静的サイトはHTML。
複雑なボタンや機能、動きの実装にはJavaScript。
詳しいことは割愛しますがだいたいこんなものという認識でオッケーです。
じゃあそれをどう覚えていくかって話なんですが、やみくもに考えても確かに何をしていいかわかりません。
この２冊で基本は押さえられます
WordPressユーザーのためのPHP入門 はじめから、ていねいに。
この２冊だけでオッケーです。
こちらは僕が実際に利用した本です。
これだけで基本である４つを全部網羅できるということ。
そして読みやすくわかりやすいんです。
実際に手を動かしながら覚えられるので敷居も低いですよ。
独学で学ぶならわかりやすさと実行しやすさが大事ですからね。
テーマを配布しようと考えているので多少応用はしていますが約１週間でこのようなWordPressのテーマを作れました。
また今なら特に何も見ることなく、ただ作るだけなら１日かかりません。
この本をオススメする理由はHTMLやCSSを弄って楽しみながら覚えられること。
そして高校生向きに執筆された本なので読みやすく解説が優しいんですよ。
今回は割とWordPressにフォーカスしていますが、まずはテーマのデザインを弄りながら覚えると良いです。
次に紹介した本でPHPによる根本的な仕組みを理解できます。
特にWordPressはHTMLを動的に吐き出すので独自の関数で定義していくこともあるのですが、２冊目の本も非常にわかりやすいです。
基本が押さえられれば後は応用で幅が広がっていきますので次にやりたいことが見えてきますよ。
基本を覚えた後は応用、次のスキルへ
ベースが理解できてきたら自ずと次に何がしたいか見えてきます。
そんな時に次のステップへどう進むかを書いていきます。
基礎ができてからの応用はサイトでOK
次に覚えたいことは各々変わってくると思うんですよね。
もちろんそのままCSSを極めても良いですし、楽しさを見出したらWEBアプリケーションに手を出してもいいかもしれません。
その先の本も沢山出てはいるのですが僕は断然サイトで学ぶことをお勧めします。
まず、プログラムの世界はめちゃくちゃ広いです。
その全てが収まっている本を読んでも頭に入らないんですよね。
なのでやりたい！と思えたことから学んでいくのが楽しく早く覚えるコツです。
僕の場合は以前記事でも紹介したのですが動きや３Dに興味を持ちました。
先ほど紹介したデモサイトの２つ目はかなり冒険しています。
実用性はあれですがCSSでこんなこともできるっていう参考にはなると思いますよ。
このようにやりたい表現を覚えたり、サイトの構造化についても学びましたね。
前の章で紹介した基本を学んでしまえば次の１つって理解しやすいんです。
それを１つ１つ覚えていくことで出来ることが意識しなくても増えていきます。
それが１番負担のない勉強方法だと思いますよ。
要は楽しんで学ぶスタンスですね。
オススメの参考になるサイトを紹介
[sanko href="https://saruwakakun.com/html-css/basic/box-shadow" title="【CSS】box-shadowで影をつける方法とサンプル集" site="サルワカ"] [sanko href="https://plusers.net/category/wordpress-theme" title="wordpressテーマ作成の記事一覧" site="Plusers"] [sanko href="https://manablog.org/css-midashi/" title="【CSS】コピペで超簡単に作れる大見出し・中見出しのまとめ" site="manablog"]という３つのサイトをオススメします。
１つ目のサルワカはこのブログで採用しているテーマ「SANGO」を製作しているサイトです。
ここはまるで教科書のように丁寧にWEBデザインの基礎から応用まで網羅されています。
下手な参考書よりわかりやすい説明やお洒落なサンプルなど見所満載です。
２つ目のPlusersはWordPressのテーマを１から作ることをコンセプトにその先の応用まで丁寧に描かれています。
基礎の復習も兼ねれますし何よりわかりやすいです。
特にPHPの参考にすると良いと思います。
３つ目は僕の崇拝するマナブログ。
プログラマー目線の解説が多くSEOに関してとにかく強いので、構造化マークアップなど参考にしています。
もちろんわかりやすく自身でテーマを作成していらっしゃるのでぜひ参考にしてみると良いですよ。
内部構造的なことを知るのにも参考になりますね。
先ほど紹介した僕の製作したテーマ２つは大いにこのサイトたちを参考にさせていただきました。
もちろん他にも沢山覚えたことはありましたがだいたいのデザインや構造は網羅できると思います。
内容が濃く有名どころを今回はピックアップしました。
紹介したサイト以外にも沢山参考になるサイトはあります。
これがしたい！って思いついた時その１つ１つを検索してみましょう。
簡素にコードだけ書かれているサイトもありますが、最初の本を参考にすれば大方の仕組みを理解した上で応用できると思います。
結論、独学で学ぶことは可能です
今回は僕の利用している書籍、サイトの紹介でした。
これだけである程度のことはできてしまいますよ。
ちょっとしたカスタマイズから１からのプログラミングまで全対応です。
そして身につけたスキルは間違いなくこの先有用になると思います。
ぜひとも始めてみてください。
それでは良いプログラミングライフを。
ではまた。
