3月11日 研修八日目
震災から4年たちましたね
4年前は全然職で受付をやってました
3時の来客をさばいてて、その後にいきなり揺れたのを覚えています
防災の備えや、メディアの信頼性を改めて実感しました
チェーンメールも多々回ってきたし
何かを人に伝えるにはきちんをしたソースを確認しないとダメだなあと思いました
先日の作業で、ほぼサイトのCSSを生成できたので、フォントを調整したり、
変更点をまとめました
特にフォントは、訓練校の座学でやったのを思い出してwebフォントを設定しました
デザイン的な要素の作業は楽しいですね
ちなみにgoogleの日本語版フォントの記事を見つけました
これは期待！
グーグルが日本語Webフォントを提供してた。これはWebフォントの大転換になるかも？ | 編集長ブログ―安田英久 | Web担当者Forum
3月10日 研修七日目
よーやく、ブートストラップの構造等がわかりました
何日かかるんだって話ですが
まとめ
bootstrapを使ってHTMLを作る
基本的なカスタマイズは公式のカスタマイズで可能
（bodyのテキストの色を変えたり、スライダーやドロップダウンなどの動的な動きまでカスタマイズできる！）
ただし、【btn-link】や【collapse】等の詳細な設定項目が公式カスタマイズにないので、その場合はLESSファイルを設定する
LESSファイルをいじってCSSファイルにコンパイルするんですが、
そのコンパイラーがよくわからず…
見つけたのが WinLess - Windows GUI for less.js でした
最初は、「コンパイル LESS」で上位に出たPrepros を導入したのですが、高性能すぎて使いきれなかったというのが実情でした（情けない…）
Winlessなら、純粋にコンパイルするだけ、またエラー箇所も教えてくれるので自分にはぴったりでした
英語がわからなくてもなんとかつかえたのがうれしい
LESSを使ってbootstrapをもっとデザインしてみた - 生存戦略型プログラミング
公式カスタマイズ機能使って、CSSをダウンロードしてから
LESSをいじれば…と思ったんですが、公式カスタマイズ機能にLESSの生成がなさげ？
細部までデザインする場合は最初からLESSファイルをいじった方がよさげですね
3月6日 研修五日目
ひたすらBootStrapのカスタマイズについて勉強していました
BootStrapでは、一部CSSが使えるがLESSでより詳細なカスタマイズができる
MEMO
http://www.brain-solution.net/blog/web-product/bootstrap3/#03
＞BootStrapはCSSフレームワークの中ではデザインカスタマイズがしにくい部類に入りますが、
＞CSSの知識と、更にjQuaryの知識があればフルカスタマイズも可能です。
＞デザインをカスタマイズするためには、基本はbootstrap.cssもしくはbootstrap.min.cssを調整する必要があります。
＞ただこれらは元データなので極力いじりたくありません。
＞そんなときは、ヘッダーで読み込ませているCSSリンクで、
＞<link href=”css/bootstrap.min.css” rel=”stylesheet”>の直下に例えば、
＞<link href=”css/original.css” rel=”stylesheet”>と自作のCSSを読み込ませてあげることで、
＞元データは変更せずに、original.cssに変更したい箇所だけ記述して安心してカスタマイズできます。
＞また、パーツの色変更やナビゲーションエリアなどの幅変更をある程度まとめて行いたい場合は、公式サイトのカスタマイズページで、必要な値を一通り指定してから必要ソース一式をダウンロードすることもできます。
http://getbootstrap.com/customize/
ASCII.jp：lessを使ってBootstrapのデザインをカスタマイズ (3/5)｜イシジマミキの実践！「シングルページ」デザイン塾
lessファイルはそのままではブラウザーは認識できません。変更したvariable.lessもまとめて1つのCSSファイルにするbootstrap.lessをbootstrap.cssに変換してブラウザーが認識できるようにします。
3月5日 研修四日目
午前中に進捗確認
Nくん→デモサイト完成
Nさん→ラフ画完成
午後イチで「こういうのを作ります」とお伝えして、さあ作りましょう～となったら、
レスポンシブデザインを作るぞ～と思ったら、難しかったです…
ちなみに調べたらいろんなレスポンシブデザインがありました
Responsive Web Design JP | 日本国内の秀逸なレスポンシブWebデザインを集めたギャラリーサイト
幅を縮めるとレイアウト変わるから、CSSで指定して…？
と考えていたら「bootstrap」がよいとのことでひたすら勉強してました
bootstrapはCSSフレームワークの1つで、ブラウザ間の差異の修正せずに表示崩れの無いWebサイトがつくれるという優れもの。
扱うには「HTML」「CSS」が知識が必要。
解説をしているサイトを見て実際に組み立ててました
色を変えるにもCSSファイルではなく、LESSファイルをいじるんですね…
今日からはじめる！Twitter Bootstrap 3入門 〜Webデザイナーのための簡単サイト構築術〜 | Find Job ! Startup
めも
「コンパイル」ソースコードを解析して、オブジェクトコードに変換すること
「ソースコード」日常言語に近い形で書かれている テキスト形式のファイル
「オブジェクトコード」コンピューターのハードウエアが直接実行 できる形式の、０と１で構成されたファイル
「LESSファイル」CSSの拡張メタ言語と呼ばれるもので、プログラミングの要領でCSSが書ける独自の言語
LESSファイルを触るためについに噂のgithubにさわります、ドキドキ
3月4日 研修三日目
本日も研修してきました！
研修進捗メモ
既存サイトからリニューアルサイトへ
このリニューアルサイトを制作する！
＜オリジナルサイトの洗い出し＞
- 改善点等の洗い出し
- 実際のデモサイト制作→Nくん
- イメージサイト、ラフ画→Nさん
- ワークフローの確認、フローチャートの作成→自分
【WEBデザインワークフローの進め方】
なにをすればどのような成果を出せるのかという目標の設定
参考文献
Webデザインワークフロー (ウェブクリエーターズバイブルシリーズ)
- 作者: 生田昌弘,坂井とわ子,堀尾保
- 出版社/メーカー: ソフトバンククリエイティブ
- 発売日: 2003/07
- メディア: 単行本
- 購入: 11人 クリック: 1,372回
- この商品を含むブログ (9件) を見る
のども痛みもひいたので、明日も頑張ります！！
3月3日 研修二日目（自分には初日）
三月から始まった研修ですが、発熱により研修早々ダウン…（花粉症かと思ったら風邪でした）
熱も下がったところで、二日目から研修に参加しました
まず、「コワーキングスペースCo-Edo」についてそれぞれが調査をした内容の発表
様々な見解が発表されました
- コワーキングの価値観を共有して作業できる
- 自分たちが利用するものにたとえたら”ヴィレッジバンガード” 様々なジャンルのものがあって、しかも専門性が高い
- web、エンジニア以外の異業種を巻き込んだイベントがもっとあったら面白いかも？
- 立地条件がいいが、マンスリー契約やデイリー契約の概算をするとそんなに儲からないのでは？
- コワーキング事業単体の儲けではなく、そこから生まれるビジネスがあると推測される
- 料金も安く、気軽に利用しやすい
- 個人的に紹介するなら「PCの提供だけできる」だけでなく「この空間の熱意を伝えたい！」
- コワーキング.comで探すと東京駅だと３件、ここ以外は料金が高い
- 運営しながら事業を考えたり、新しい事業につなげるのかなという印象
- コエドのFBが毎日更新されているのが好印象
- 利益は薄いが、コワーキングでビジネスチャンスがあるだろう
- 勉強会のスケジュールをみると「IT系に強いコワーキング」という印象
自分にとってはコワーキングスペースは利用したことがなかったので、ネットで調べてみること、様々な人の見解をきくことで視野が広くなった気がします
また、Co-Edoの田中さんから、「コワーキング事業は最近三井不動産、パセラがコワーキングスペース事業に参入し、商売色が強くなってコミュニケーション色が弱くなりつつあるかも」とお話しを伺いました。
コワーキングの魅力は「人との交流！」だとか！
コワーキングスペースってなんぞや…という自分にはとても勉強になりました。
また、研修課題としてECサイト作成 制作をすることになりました！
3人チーム（一応暫定）で頑張ります！！
