いつものバーベキューに飽きたら本場アメリカンカウボーイの肉の塊を喰らおう！
どうもKai Hajimeです。
今日の「おすそわけ」したいことはなにかというと、、、
いつもはお肉屋さんで焼肉用の肉を買ってきてバーベキューや焼き肉をやっていますが、いつも同じスタイルのバーベキューにそろそろ飽きてきたので、なにかいつもとは違うものをと探してみました。
ロース、カルビ、タン、ハラミ、バラ、ホルモンなどなど、あれこれ色々な種類の肉を食べるのもイイんですが、今回は「分厚い肉の塊をガッツリ食べたい！」ということで本場アメリカンカウボーイが届けてくれるバーベキューセットに挑戦することに。
今年はマンションから一軒家に引っ越して庭もできということで、だったら「自宅でのんびりバーベキューをやろう！」ということで、どうせやるならいつもとは一味違ったバーベキューに。で、奥さんと相談した結果がコチラです。
本格的アメリカンバーベキューを楽しめるThe Meat Guyの「バーベキューセットB 合計10kg・10人前」
こいつらがダンボールに入って送られてきます。しかしこのボリュームにはビックリしました。
「バーベキューセットB 合計10kg・10人前」は大人2人、子ども2人では当然多過ぎです。
ゴールデンウィーク中に食べきれなかった分は冷凍して保存しています。商品にもよりますが冷凍保存だと最大1年間は保存できます。
HTML&CSSがわからなくても大丈夫！ 初心者でもwebサイトが簡単にできる「Blocs」の感想
どうもKai Hajimeです。
先日紹介した「Blocs」のトライアル版で自分のブログの紹介サイトを作ってみました。今回はその感想などをおすそわけしたいと思います。
前回の記事はコチラです。
「Blocs」はその名の通りブロック（部品）を組み合わせてwebサイトを組み立てます。まるでレゴで好きなモノを自由に作るように簡単にwebサイトを作成することができます。
皆さんご存知だと思いますが、まずは一般的なwebサイトがどのようなカタチで構成されているか僕なりにまとめてみましたので本題に入る前にご覧ください。
「そんなの知ってるわ！」と言う方は飛ばしてください。
一般なwebサイトの構造
通常、webサイトは大きく分けて「ヘッダー」「ナビゲーション」「コンテンツ」「フッター」というカタチが一般的です。
「ヘッダー」
基本的に企業のロゴやブランド名、ブログタイトルやロゴなど、実際の店舗の看板の役割です。
「ナビゲーション」
webサイト内の各コンテンツを閲覧・移動するための案内板です。デパートの入り口や各フロアにある地図みたいなもんです。
オマケにナビゲーションから一気に目的のコンテンツに飛べるようリンクが貼られてるモノがほとんどです。
ナビゲーションは用途にあわせて様々な種類があり、サイトのデザインによってどんなナビゲーションを採用するかでデザインも変わってきます。
「コンテンツ」
webサイトのメインとなる情報がある場所です。デパートでいうと各フロアのショップ、商品といったところ。
「フッター」
基本的にはメインのコンテンツを補足する内容・情報があるところ。
著作権、利用規約、プライバシーポリシーなどですね。個人ブログだとSNSのリンクなどでしょうか。
これらに加えてメインコンテンツの横に「サイドバー」を設けて２分割（もしくわ3、4分割、、、あまり見かけませんが）し情報を整理するという、最近のブログによく見るカタチもあります。
「Blocs」では残念ながら現在のバージョンでは「サイドバー」の機能はありません。今後のアップデートで実装されることを祈って首を長くして待ちましょう。
※「Blocs」で作ったサイトをスマホで観覧することを前提にされているのであれば、時代はレスポンシブルデザインが主流となっており、「サイドバー」が無いのは理にかなっているとも考えられます。
少し長くなりましたが、これら「ヘッダー」「ナビゲーション」「コンテンツ」「フッター」「サイドバー」がwebサイトを構成する主な要素です。
「Blocs」では大きく分けて３つだけ
「Blocs」でwebサイトを作る際の構造を、超簡単に説明すると以下のような構成になります。
A 上の「NAVBAR」
B 真ん中の「BODY」
C 下の「FOOTER」
たった３つです。
この３つ、A、B、Cの中に「サイドバー」を除く、「ヘッダー」「ナビゲーション」「コンテンツ」「フッター」を「BLOC」という各スタイルを持った「箱」としてはめ込みます。
まず、「BLOC」という箱をはめて全体像をざっくり作ります。
写真はあらかじめ準備された「BLOC」をはめて、そこに背景画像や文字をいれています。
画像の選択や文字など編集は画面左側の編集スペースで簡単にできます。
次に「BLIC」という部品をいれて機能を足していきます。
「BLOC」という箱の中に「BLIC」という部品が入れ子状になっているイメージです。
写真は僕のブログの過去の記事をコラム風にレイアウトしたものです。
「view more」からリンクで飛べるように設定してます。
このリンク設定も画面左の編集スペースで簡単にできました。
画面中央にあるのはあらかじめ準備された部品たち「BLIC」です。
「BLIC」には見出し<h1>〜<h6>、様々な表記スタイルをもつテキスト類やMediaと称される画像やビデオ、アニメーション効果、カルーセルというスライド式に画像を表示する機能、ボタンやアイコンなどなど、他にもかなり種類がデフォルトで用意されています。
「BLOC」の中に自分がレイアウトしたい部品「BLIC」を自由に配置して編集することができます。マニュアルはありませんが直感的に操作できました。
英語ですが、見るだけでも理解できるようにわかりやく説明されている動画がありますのでご覧ください。
僕も仕事から帰宅してのスキマ時間でブログの紹介ページを作ってみました。
navi、header部分にはブログへのリンクを、body部分にはブログの過去記事をコラム風にはめ込んだり、ギャラリーやスライド、自己紹介やSNSへのリンクを設定してみました。
footerにはBlocsのサイトのリンクを設置したりと、簡易的ですが自分のブログの紹介記事が初心者の僕でもざっと３時間程で完成しました。
過去記事や各リンクへの設定も簡単でした。
早いのか遅いのかはさておき、あまり悩むことなくサイトができたので現時点では満足しています。
コチラです。
注意点、補足
作業の途中で迷わないためのゴール設定をしましょう
簡単です。しかし、行き当たりばったりだと、どうしても右往左往してしまいます。
これはWebサイト製作だけでなく、他の製作物でも同じです。
僕はブログを書くの下手くそです。一つの記事を書くのにかなりの時間がかかってしまいます。
世の中には行き当たりばったりでも、読者にわかりやすく充実した内容を書く人たくさんいると思います。
たいていの方は展開を考えたり、自分なりのフォーマットをもとに文章を書いていると思います。
服飾デザイナーも建築家でも小説家でも、モノづくりをする人は実際の作業前に必ず自分なりの設計図を準備すると思います。
今回僕は何も考えずに作業を始めたので開始当初は
「あ〜でもない、、、こうでもない」と時間を無駄にしました、、、
そんな回り道をしないように、簡単なスケッチでも良いので自分なりの設計図をノートなどに書きましょう。
最終的に「自分がどんなサイトをつくりたいのか？」というゴール、出来上がりの絵があるとが効率的に作業が進むので製作時間を短縮できます。
ここまでやる必要はないけどカッコイイサイトの設計図
「Blocs」の操作・編集はもとてもシンプル
あらかじめ準備された各要素（BLOC）に各機能（BLIC）を割り当てて編集していくだけです。
カスタマイズしないのであれば、複雑なコードを書く必要は一切ありません。
ただ、どうしても新しく使うアプリケーションでは毎回仕方ないことですが、ツールの機能や操作を理解するのには多少の時間は必要です。
とは言え、操作するアイコンもシンプルなので直感的に初心者の僕でも問題なくwebサイトができました。
そのBlocsの良いところ、残念なところ
僕としてはHTML&CSSの勉強のために購入を検討していたので、次の点がBlocsのイイところだと思います
初心者なので0からサイトを構築することは非常にハードルが高く労力も時間もかかってしまいます。
Blocsだとサイトの基礎を簡単に作れる！ だから
- ざっくり作る
- 自分でカスタムしたい細かいところは、後からHTMLとCSSをでカスタムしていく
というやり方が良いと思います。（僕もこのやり方でいこう思っています。）
綺麗な（グチャグチャでは無い）HTML＆CSSをエキスポートできる
「ざっくりとした骨組みをつくった後に自分でカスタマイズ」というやり方をとるなら、初心者の自分にもわかりやすい綺麗なコードが出力されるの必須です。
この点でBlocsは最高のwebサイト製作の「下書きツール」としては現時点で最高のアプリケーションだと思います。
残念なところ、、、
正直、右も左もわからない超初心者なので、簡単にサイトができるという素晴らしい点しか目につきません。
あえて言うなら、Google Webフォントは使用できますが、日本語フォントには非対応という点と、サイドバーがない点が少々残念なくらいなのかな、、、というぐらい。
こんな方にオススメ
- HTML、CSSのスキルがないWebデザイナー、Webディレクターの方
- 今からwebデザイン、HTML&CSSを学びたい方
- 自分の店や会社、サークルなどのサイトを作りたい方 など
今回は「Blocs」がいかに簡単にWebサイトが作れるアプリケーションなのかということを試すために自分のブログの紹介サイトを作ってみました。
今回は設定していませんが、Google Analyticsの設定もできるのでBlocsで作成したサイトを本格的に運用することも可能です。
いまのところ広告は貼れないのでアフェリエイトには不向きなのかな、、、？しかし
「お店の外観や料理写真が載ったトップページがあり〜の、写真にコメント付きのメニューがあり〜の、ブログやSNSへのリンクがあり〜の」
みたいな、おしゃれでシンプルな飲食店のWebサイトや簡易的な企業のランディングサイトなどをサクッと作れるとあれば広告を貼る必要ないのかなと思います。
というわけでBlocs買います！
今の自分には充分すぎる機能。そして使い心地も良いので買います。
また試してない機能に「動画も埋め込める」「各要素にアニメーション効果を簡単につけられる」などあり、これらも使ってガンガン作っていこうと思います。
今後また様々なアップデートも予定されているようで楽しみです。
まとめ
Webサイトは作るだけ終わりではありません。
作ってからどう使うのかが本来の問題であり目的です。
いい年したオッサンがこのタイミングでHTMLやCSSの勉強を初めても、上には上が居ます。今から１から初めていては時間がいくらあっても先人たちに追いつくことは不可能に近く、また無謀な挑戦です。
しかし、「Blocs」のようなwebサイト製作の「下書きツール」があれば、下地をざっくり組んで、あとはHTMLやCSSでカスタマイズするという方法を取ることで、少しでも先人に追いつくことができるのではないかと考えます。
まずは人並みにWebサイトをつくることができるようになることが最優先事項です。
とにかく作りまくる！しかないですね。
簡単にWebサイトをつくりたい方はトライアル版があるので是非お試しください。
読んでいただいた方へ
ありがとうございました。
Kai Hajime
HTML&CSS初心者の救世主!? 子どもでもレスポンシブルデザインのサイトが簡単に作れるアプリ
おはようございます。
今朝iPhoneで簡単にloop musicを作れるアプリがあると知り検索すると、とても興味深いアプリケーションを発見しました。まさに「瓢箪から駒」です。
最初はこのアプリを探してたのですが、、、今回おすそわけしたいのはコレじゃないです。まあとりあえず、、、
通勤電車やちょっとした空き時間にピコピコといじれるアプリ。ちょっと高いけど面白そうなんでポチちゃいました。
本命はコレ！
で、何を見つけたかというとコチラです。上の音楽アプリと同じ名前で検索に引っかかったというわけで偶然見つけました。
これは初心者でも簡単にレスポンシブルデザインのサイトがが作れる「Blocs」というMac専用のアプリです。３日間の無料トライアルがあるそうなので早速この週末にチャレンジしてみようと思います。
HTMLとCSSを独学中ですが、理解できてるところもあれば、まだまだ始めたばかりでとても仕事ができるレベルではありません。
今の勉強方法を継続しつつこの「Blocs」で自分好みのサイトを作ってみて、作ったサイトがどんな風に作られているか参考にしたいと思います。
普通この手のアプリケーションで作られたコードはグチャグチャになることが多いそうですが、「Blocs」はそういうこともないということで勉強になると思います。
実際に「Blocs」でサイトを作ってみた方がレビューされているブログ記事があります。コチラです。
誰にでも手軽にレスポンシブデザインのサイトが作れてしまう時代。「HTMLやCSSはわからないけど、ウェブサイト作ってみたい」という方は試す価値ありです！
HTMLやCSS初心者でも綺麗なウェブサイトが作れる「Blocs」がスゴい - AIUEO Lab2
参考にさせていただきます。akiueoさんありがとうございます。
Webデザインを仕事にするとなると、HTMLとCSSのスキルは必須です。しかし初心者がコードの構造などを学ぶのにお手本が必要だと思います。
ネットで好きなサイトのHTMLやCSSを見ることもできますが、実際に自分が作ったサイトのHTMLやCSSが見れるとなるとコレは非常に便利で面白いことだと思います。
週末はコレで１つサイトを作ってみようと思います。
読んでいただいた方へ
ありがとうございました。
Kai Hajime
＝追記＝
最初に紹介した音楽アプリのことを調べてみると、コチラのブログで使い方が紹介されています。僕も参考にさせてもらいます。
現状に満足しているサラリーマンは読むべからず！ 孤独とは学びに不可欠な精神構造である
今日は最近読み始めた「孤独のチカラ・齋藤孝 著」を読んでグサッと刺さるところがありまくりなので、その一部を抜粋して「学びの質」についておすそわけしたいと思います。
僕は40歳を超えて脱サラを目指し、一日の中から何か一つでも成果をあげるために毎日試行錯誤しています。周囲からは「無謀な事はよせ」と言われていますが、死ぬ間際になって「やりたいことをやらずに終わった人生だった」と後悔したくないので往生際が悪いと言われようが構いません。しばらくは悪あがきしようと思っています。
タイトルにもしましたが、現状に満足している方、特にサラリーマンはこの本「孤独のチカラ」は読まなくて良いと思われます。
つるむ関係はいわば談合状態だ
『とりあえずいまのままの自分でいい』という安きに流れて、お互いに「いいよね」「いいよね」と入札価格を低く抑えたままで安心している。だが、自分に期待するものが大きい単独者であれば、談合して自分への入札価格を低くしてしまうことはなく、非常に高めの設定をするだろう。そうして高くしてしまった自分を落札するには、いまのままでいいわけがない。自分自身に大変な負担がかかっていくことになるが、力を伸ばすためには不可欠の精神構造だと私は思う。
いきなりグサッときました。
ウチの会社は福利厚生も充実していて、給料も賞与も超一流企業並みです。
安心してください、僕は例外です（約３分の１です）。
ウチは同じ正社員でも雇用形態によって表面的には見えない社内カーストが存在します。これについてはまたいつか、、、
待遇面ですでにお腹いっぱいの社員たちはこの「談合状態」に陥っています。全く同じ業務をこなし、談合状態の社員たち以上の成果をあげても評価は上がらない僕ら飢えた社員たちは、現状打破するために、虎視眈々とその機会を逃すものかと狙っています。しかし、カースト制なのでそう簡単には崩れません。組合を持ってしてでもです。
そうなると自ら力をつけて飛び出すことしか他に方法はないと僕は考えます。
自分に少し重めの負荷をかけ高く落札できるようになる必要があります。
単独者とは
著者は「単独者」を次のように言い表しています。
登山家はチームであっても単独者である。誰かが登らせてくれるわけではない。代わりに登ってくれるわけでもない。実際の山登りは、つら過ぎて私は苦手だが、精神の山登りはなぜか得意で、結構ひとりで歩いている。そこに、もしほかの人がいてくれればいいものだが、あくまで単独者同士がたまたま一緒に登っているという形でありたい。
つるむというネガティブな関係
著者は講師という立場で友達同士で授業を受ける学生たちに対し一斉に席替えをするそうです。
実際に友達同士がばらばらにされて、ひとりひとりが私と向き合ってみると、そこで初めてつるんで行動している時には得られなかった感覚がわかってくる。〈差し〉とも言うが、一対一での対話が重要なのだ。
また
群れて成功した人はいない。何かを勉強しよう、学ぼうというときには、まずは群れから離れて一人で立つ。これが基本姿勢だ。頭のよし悪しや、本をたくさん読んできたかどうかより、単独者になれるかどうかが問われる。
著者は「友達をつくるな！」と言っているわけではありません。
何かを学ぶのに孤独な単独者として学ぶのと、慣れ合いでつるんで学ぶのとでは「学びの質」に違いがあるといっています。慣れ合いでつるむことにあまり意味がないということです。
ふだんは仲がよくていい。だがそもそも学びの第一の構えは単独者であるということを理解してもらわなくてはいけない。
まとめ
僕は「脱サラ」するために必要なスキルを身につけるために勉強してしたり、考え方をアップデートするため、または知識を得たり情報収集のための読書を積極的に生活の中に取り入れています。この著者が語る「単独者」という立ち位置、気概は心に刺さりました。これからの自分の在り方の根幹となる考え方になると思います。
タイトルが「孤独のチカラ」とあり、なんだか暗い内容なのかという印象でしたが、全く違います。
一人、孤独になることが実は成長する過程でとても大切な時間であることが著者の経験を元に語られています。真面目に書いていると思われますが、真面目過ぎで真剣な文面から時折見える著者のユーモラスな一面が読んでいて楽しくなる一冊です。たまたま出会った一冊でしたが、久々に良い本に出会ったと思います。
学びの質を変えたいと思ってる方、学校や会社で周りになじめず一人でいること、孤独であること、対人関係で悩んでいる方は是非読んでみてください。
一人でいること、孤独であることがネガティブなことと考えがちですが、この本を読むと「孤独」についての考え方が変わってくると思います。
将来子どもたちが悩んだ時はこの本「孤独のチカラ」を薦めたいと思う良書です。
まだ途中ですが読みやすいボリュームなので、サッサと読んでまた感想を書きたいと思います。
読んでいただいた方へ
ありがとうございました。
Kai Hajime
孤独のチカラ [ 齋藤孝（教育学） ]
|
スピード・省スペース！ 場所を選ばないHTML・CSSの勉強法
書籍（HTML&CSSレッスンブック）での勉強がほぼ終わったところでProgateの中級編に登録しました。僕がProgateの入門編を始めた時は、入門編と応用編しか無かったのですが、いつの間にか「初級編・中級編・上級編」という構成になってました。しかも中級編からは有料に、、、ここは思い切って「月額¥980のプラスプラン」に登録しました。
Progateで学ぶ２つのメリット
場所を選ばない
書籍だと荷物になりますし、開くスペースが必要です。外出時はその都度パソコンと本を開いてる時間がもったいなしスペースの確保も一手間。会社でも少ない休憩時間の無駄になります。
ProgateだとiPhoneでディザリングしてノートパソコンを開けばすぐに始めることができます。通勤電車の往復など、スキマ時間で学ぶにはProgateはスペースを気にせず学べます。
ちなみにわからないことは以下の「HTML・CSS早見表」サイトで調べています。辞書も持ち歩く必要はありません。右上にある検索スペースにわからない、知りたい用語などを入れて検索すれば最新のHTML5やCSS３に準拠した用語が出てきます。
わからないところを確実に学べる
書籍だと、どうしてもわからなかったり、ほんの少しのコード書き間違えがあっても先へ進めてしまいます。しかしProgateだと間違えると前に進めません。加えて自分の間違いがどこなのかを教えてくれる「ヒント」が適宜表示されます。的確なアドバイスをくれる講師がいるようなもんです。「どこが？どのように？」違うのかを自分の書いたコードから的確に学べるので、書籍のように「わからなかったら飛ばす」みたいなことも無く、一つずつステップアップできます。超初心者の自分はこの機能に本当にお世話になっています。
本を一冊分だと思えば高い買い物ではない
１ヶ月以内に終わればの話ですが、月額¥980でアドバイス付きの講義が受けれるなんて安いもんです。スクールに通うこと無く確実に学べるのであれば投資としては格安じゃないでしょうか？
ここは１ヶ月と言わず、気合を入れて少しでも早く終わらせましょう。
毎日少しづつやって理解が深まっていくと「早く自分でサイトを作りたい！」という先走る欲望にかられますが、グッと我慢して基本をしっかり固めようと思います。
読んでいただいた方へ
ありがとうございました。
Kai Hajime
