Webページ制作はパズル。そしてこれからWebサイトやブログを作りたい人、学びたい人におすすめ入門サイト、ドットインストールに感動。
引っ越してからのリンあれは「最近、専門的なことが出てきてわかんない、もっと簡単なのおねがいします」と言われることが出てきました。専門的…? 引っ越し前のリンあれにはなくて、引っ越し後のリンあれにあるネタ…というと、Web関連のエントリですかね…(^∀^;)
うーん、MacとかWindowsとかiPhoneとか…こんぴーたーに関しては素人だもんなぁ。そうか〜。そゆのなら誰でも読めるのかぁ〜。
と思いつつも、特にWeb関連のエキスパートと言えるほどでもないのでそんなに難しい事書いたかなぁ…(;╹⌓╹)?よくわかんない、ユコびん(@yucovin)です。こんにちは。
今日は、こうしてブログをやっているとたまに尋ねられることについてのお話と、その回答のエントリです。Web関連の話ですが、ものすごーくひらたく書いているので今日はきっと難しくないです(*´∇`*) お付き合い下さい。
超おすすめ入門サイト、ドットインストール
ブログを読んでいるみなさんは、私が何屋さんなのか?と疑問に思った事、ありますよね^^;)たぶん。(私は自分の事なので、自分が何者かを知っているのですが。)リンあれは相当個人情報暴露(ねこ先生とかねこ先生とか)ブログで、私も日々のいろんな出来事を明かしているので、読者さんから「個人情報もらさないように気をつけてください」「ストーカーに狙われないか心配です」とお便りをもらうことがあります。ですが、これでもぼやかしているところや触れていないところもあるんですよ〜〜。
という、こんな(どんな?w)私ですが、たまに尋ねられることがあるんです。
「ホームページの作り方ってどうやって学んだんですか?」
「自分もWordPressでテーマ作りたいんですけど、良い本教えてください。サイトでもいいです。」
ば、ばれてる( ꒪⌓꒪)←そりゃそうだw
薄々お気づきかもしれませんが、私は(こんなんでも)一応Webサイトを作ることもやったりしてます。(何をもってしてwebデザイナーかという議論はここでは置いておきますが。)例えば今このブログのテーマ(テンプレート)も私が作ったものです。WordPressに移る前はphpの知識が無かったので(所謂プログラミングというものは触れた事がない!)、それなりにちょびっとは学ぶ必要がありましたが、こうして形することができます。(まだいろいろと足りないところやコード的に手直しが必要なところ、それからセンス的にどうなの?というところもありますが。w)
Webページのデザインはは、思考(趣向?)そのもの ヽ(`Д´)ノ
見た目やデザインに興味のない人もいるかもしれませんが、こうして自分の思うような形を作ってブラウザに表示させるというのはとても楽しい作業です。作ったものが形になる、というのは、ブログを記事をupして皆が読んでくれるという満足感とはまた違うものです。もちろん記事内容とデザインは全く関係ないわけではなく、デザインは文章にイメージを付け足します。リンあれも、リンあれに適していると思うイメージを作ってその中に文章を置いています。(デザイン的なものが無ければ、ないという効果があります。)
この「サイト構造を含むデザイン」というものは、作る人間の考え方とほぼイコールです。すごく重要なポイントです。言い換えると「このサイトを誰にどう見てもらいたいのか?という思考」そのものです。あえて断言しますが、全ての人に「見やすくて、おしゃれで、楽しくて、素晴らしい」と思わせるものはありません。そのあたり、つまり「何を取って、何を捨てるか」がデザインということになります。アクセシビリティの観点から徹底的に無駄なものを排除したシンプルすぎる無味乾燥なサイトもアリでしょう。ハイセンスな人にはウケるおしゃれだけど見づらい事この上ないサイトもアリでしょう。
例えばこのブログ、開設当初からエントリの表示は「大きめの文字、黒字、白地」を貫いています。この高コントラストの文字色と背景色ですが、正直にいうとダサくてイヤです(笑) しかし「より多くの人に読みやすいもの」と考えた結果、こうしています。私にはさほど変わらないと見えるものでも、能力、年齢、状態によって違うということはたくさんあります、どこまで拾ってどこは切り捨てるか、その選択のバランスをどう取るか?の結果が今のリンあれそのものです。「だっせー」と思う人がある一定以上いると思いますが、内容以前に高コントラストで読みやすい方が大事だと思うからです。「だっせー」と思う人も内容が面白いと思えば通ってくれるかもしれませんし。
こうして作り手の考え方=デザインということになります。『かっこよかったりおしゃれだったらデザイン』じゃないんだぜ、と当たり前のことを言ってみたり…(笑)
Webページはデザインを表現するパズル φ(..)
と、少しだけリンあれデザインのことも含めて書いてみましたが、私はそもそもモノを作る人間なので、こうしてサイトデザインを作ることは、結果どうであれ単純に楽しいことです。
ですが、同じように描画されるものとはいえ、Webページを作るというのは、紙に絵を描いたりするようなアナログな作業とはちょっと違います(全く違う訳ではないが、出力の仕方がかなり違う)。
簡単に言うと、必要な技術の違いです。アナログな作業に必要なスキルは、わりとアナログなスキルだったりします。頭で考えることも必要ですが、実際手を動かすことが必要です。そして動かして出来た線は人によって違います。Webページはこのスキル部分がhtmlやcss(その他)のコードです。コードは私が書こうがアナタが書こうが、同じ文字列なら、全く同じ結果を生み出すことができます。
初めてhtmlやcssを使ってWebページを作ってみた時にまず感じた事、それは「Webページを作ることは”パズル”」でした。
さて私もかつて美術系の大学に行っていたので私も周りはそんな美術系の人が結構います。でも実際にWebページを作る(作ろうとする)人はあまり多くありません。デザイン系の人ですらです。興味が無いというものそうでしょうが、普段モノを作る時とはまたちょっと違う頭の使い方を要求されるからということがあるからです。正直ファイン系で『感性命!』だけで生きている人には向いていません(笑)(みんな、ごめん。
そしていわゆる「Webデザイナーです」なんてお友達がいますが、逆に、これが絵なんて全然かけそうもなく、美術デザイン系の経歴の持ち主じゃなかったりします。だからと言ってその人が作るものがダメか?というとそんなことは全くありません。
Webページはデザイン的な要素の閾値はそんなに高くない(もちろんデザイン要素MAXのステキなサイトは山のようにありますが)、それよりもまず「パズルが組めるか?」ということ大きな要素だと思います。自分の考えたデザインを表現するために、どこにどんなコード組み立てたら再現できるのか、という楽しいパズルです。
そのパズルの特性から、多くの人が比較的簡単にWebページを作る事ができるのです。
パズルのアイテムを入手するのは難しいことじゃない
と、ごちゃごちゃかきましたが、かくいう私がその多くの人の見本です。このブログのプロフィールにもありますように、数年前に買ったMacBookが私所有の初めてのマシン。それまで「ぱそこん?なにそれ?新しいお菓子?」くらいの人間でして、大学の時など友達たちから「ユコびんちゃんにパソコンは必要ないwww」とバカにされていました。そんな私でしたので、Webページを作る事など夢のまた夢。(というか、そもそもそんなに興味が無かったと言う。) なので、(デザインに関しては0スタートではないものの、)Webページを作ために必要なhtmlやcssと言った、パズルのアイテムに関しては完璧な0スタートでした。
私が初めてwebサイトというものを作ったのは2008年。ネット上にあるhtml、css入門サイトを読みあさって1週間でタブ切り替えのサイトを作りました。(※自分のサイトではない) Webページはただのパズルであるということを知るところから、そのパズルの構造を知る事、自分の作りたいものに見合ったパズルアイテムを会得する作業です。
私が出来るのだから、ほとんどの人に出来ると思います。
そう、0スタートでもWebページは作れちゃうんだよ!(」°ロ°)」
ドットインストール…無料の入門サイトにこんなものがあっていいのか?( ꒪⌓꒪)
さて、最初のお尋ねの件に戻りますが…。聞かれても、これ一つ読めば大体オッケーなおすすめな本やサイトなどは思い当たらない…。今まではそうでした。
私が最初にいろいろ読みあさったサイトはググれば出てくるようなものですが、その当時でさえ古いものばかり。ブログが主流になったのが2005年ですから、htmlやcssを説明しているのはそれよりも前の時期に書かれたサイトがほとんどです。基本的なものは間違っていないのですが、どうしても考え方が古い。情報の取捨選択をしないといけないものをおすすめとは言えないですよね。というか、たくさんのサイトからの知識の寄せ集めでしたから、提示しようがなかったりします^^;)。昔からあるサイトで有用なのは辞書的なレファレンスサイトくらいです。
書籍は…というと、こちらも難しい。私はこの手の入門書を買いませんでした。
本というのは知識程度のターゲットを絞って内容が決められると思いますが、知識の他に理解する能力によって満足出来る内容と言うのは違うと思います。本屋で実物をパラパラ見たりもしましたが、1500~3000円くらいのお金だして、それに見合うだけの内容があると思えるものは、私にとってはなかったからです。「こんなん、ネットみればわかるじゃん」と思うものが8割、残りの2割に2千円の価値があるのか?考えてしまう(-””-;) 私はすごい貧乏くさい人間だったりします。
そんなだったので、尋ねられても「うーん、私、ネットでいろいろ見ただけだし、おすすめの本とかないし」としか答えられなかったのです。
ですが、先日、素晴らしいおすすめサイトを見つけました(o°▽°)o
それがコチラ↓
3分動画でマスターする初心者向けプログラミング学習サイト – ドットインストール
『え〜、ドットインストールでしょ?知ってるよ〜』という人もたくさんいると思いますが、私は知りませんでしたよ(๑⁼̴̀ᐜ⁼̴́)੭ु⁾⁾ 一昨日発見して!これはすごい!初学者必見じゃないですか!と一人興奮しております。
IDEA*IDEAのTaguchiさんとF.Ko-Jiの「一秒後は未来」のF.Ko-Jiさんが2011年の年末あたりからやっているようです。2011年の終わりからというと、私が情報過多で自分のブログやってるだけで精一杯になっちゃったあたりですね。あ、実は、おそらく初見はではなく、たぶんベータテストの招待制のときに、このサイトチラと見かけた事があると思います。で、招待制かぁ…と思ったきり記憶の彼方へ消えていました。(という記憶がさっきよみがえった)
無料でいろいろな短編の動画講座が公開されています。いくつか覗いてみましたがこれがすごく良い!
もちろん本当の本当に知識0の人には分からない言葉が出てきたりするので理解するためには別途調べたり、頭を整理する時間が必要になるとは思います。(逆に、分かりやすくするために省いていたり、これってどうなの?ハテナと思う部分はありますが、「こっから先は自分で調べてね、学んでね」ということなのだと思います。)知識のない人が最初にざっくり概要を掴むのにこんなに分かりやすいサイトってあったでしょうか?。今まで見てきたどんな入門サイトよりもワンランク、いやツーランク以上上の分かりやすさ! これが無料というのだから驚きです。私感動しましたよ。(;∀;)
くぅ〜、2008年からやってくれていたら! 私の最初の一歩はもっともっとラクだっただろうに!(´Д⊂ヽ ということで現在PHP入門覗いてるととこです(笑)
現在公開されているレッスンは147! 短編のビデオ20回前後で1レッスンです。(もっと多いものも少ないものもありますが。)
Webページを作るモノ以外にもたくさんのレッスンがあります。
…ん!んんんん!「さくらのVPS入門(全21回)」とか、まさにこのブログにタイムリーなものもあるじゃないですか〜(o°▽°)o
「プログラミングの敷居を下げる」 、ドットインストールにはそんな理念があるようですが、まさにそうなっていると思います!
今まで、私に「Webサイト作りを学ぶ方法」を尋ねてきた方々〜、そしてこれから自分でサイトやブログのデザインを作ってみたいと思っている方〜、ドットインストール、おすすめします〜〜〜( ´ ▽ ` )ノめっちゃおすすめです。本当におすすめです〜! 「そう、0スタートでもWebページは作れちゃうんだよ! 皆が想像してるより簡単なんだよ」と言える、そんな入門サイトです。
WordPressを使っているブロガーさんでもね、知識がない人がサイトデザインに関係することを書いている記事の中にはすっごい力技のものを見かけたりします。htmlやcssを何となくでも分かっていたら、人のテーマがベースでもデザインカスタマイズは簡単です。ある程度自分の思うように出来るようになりますよ(子テーマを作っている人とかね)。これは、WordPressだけでなく、このブログがこの間まで利用していたFC2など、テンプレートをいじれるブログサービスでも同じです。2、3歩進めば自作テーマだって出来ちゃいます。自分のサイトに自分だけのデザインを作ったら楽しいですよ(*´∇`*)
実は逆に他の人の作ったテーマとかは作った人の頭の中を考えないといけないから面倒だなぁと思うユコびんがやってるブログ「もっと知りたいリンゴあれこれ」は三周年を記念してプレゼント企画を催しています。オリジナルテーマは賞品にありませんが、良かったら応募して下さいね〜。このブログを知ったばかりの方も大歓迎です(๑´ㅂ`๑) 下のリンクをチェックしてねん!