脳のぽっけ

webデザインとか勉強ちゅ

はじめてのHTML+CSS

HTMLとCSSを勉強するため、図書館で本を借りた。

↓こちら。「はじめてのHTML+CSS猿橋大さん著。 

はじめてのHTML+CSS (TECHNICAL MASTER)

はじめてのHTML+CSS (TECHNICAL MASTER)

 

著者は、HTML学習者初心者ならきっとみなさん参照しているウェブサイト
HTMLクイックリファレンス」の管理人さんです。

以下、ちょっと感想です。

 

・オールカラーで見やすい!

・ページ構成が綺麗。適度に空白があり、フォントも見やすく、説明もわかりやすい

・サンプルをダウンロードできるのも親切

・スマホ対策、SEO対策、サーバのことも扱っていて最新!って感じ。

・完成するウェブサイトがシンプル、今後も応用できそう

・とりあえず書いてみよう、っていうスタンスがすごくいい

・本の序盤からCSSに触れられるのもいい

(他の本では、まずHTMLの要素属性を一通り説明してからCSS、って流れが多く、いつも挫折してCSSまでたどり着けなかった)

・コラムに細かいけど重要なことがサラッと網羅してあって嬉しい

・解決したい問題はこれです➡解決しましょう➡成功です!って流れになってて、

 成功しないことが限りなく少ないように一歩一歩解説してあるのが良い。

 「成功」っていう言葉がそもそも良いです!

絶対に覚えておこうと思った事

情報構造とスタイリングはそれぞれ独立している

ドットインストールでも挫折した自分ですが、この本は最後まで楽しく進めることができました。

HTMLCSSなんだそれ、っていう超初心者でも、本に沿っていけばウェブサイトができます。

これから何度かソースを書き写して、復習しながら、知識を深めていきたいと思います。

誰にも求められてないけどiPhoneの画面を晒すよ

あいぽんを買ったのですよ。5c。
何を思ったか色はグリーン。好きな色なかったからなんとなく。
先日、どうしてもどうしてもあいぽん欲しいという衝動に駆られて
駅近のソフトバンクショップへ小走りで赴き、在庫有だったのを即決。

これまでは、3年半くらい前に買ったドコモのガラゲーを電話として、
同居人から貰ったiPhone4SをiPod的役割として使っていて、
さらに同居人から今年の始めにiPadminiをもらい、それぞれ使っていたのである。

移動中の電車内で急に人身事故が起きた時(たまにある)とか、
適当に散歩していたら本格的な散歩になって道に迷った時(よくある)とかに、
i-modeで乗換案内とか地図検索とかやってられないわよまったく。

てなわけで緑のあいぽんを手に入れた私は今から画面を晒します。
数ヶ月後とか1年後とかに何か変わっているのかなという記録のために。
全世界に晒さんでもいいじゃんと思うが自己が満足すれば良いの。

起き抜けに町田康の小説を読みました。

Dockと1ページ目

f:id:marikka753:20131031092833p:plain

まずDockには、リマインダ、Evernote、字幕付TEDのアプリ、音楽の4つ。

■リマインダ

リマインダは超よく使っていて、大小問わずとにかくタスクが詰まってる。
同居人と、買い物リスト・やる事リストを共有したり。
新OSからの新しいデザインはイマイチだと思う。あんま好きじゃない。

Evernote

Evernoteは、私の第2の脳なので欠かせない。個人情報の宝庫。
なんでもかんでも記録し、参照し、暇な時に眺めてはニヤニヤしている。

はてブのブクマをhatebuteで飛ばしたり、
PinterestとStumbleuponのlikeをIFTTTで飛ばしたり、
手書きの手帳(ほぼ日)を毎日写真に撮ってEvernoteに保存している。

ウェブクリップもよく使う。
お気に入りレシピ、領収書、旅行の計画、アイディア、なんでも入っている。
あと、簡単に音声を録れるので、ギターの練習を録音して貯めている。

■TEDiSUB

本当によくTEDを見るので、Dockに置いてある。
公式よりもこのアプリがシンプルで気に入っている。

TEDiSUB - Enjoy TED videos with Subtitles!

TEDiSUB - Enjoy TED videos with Subtitles!

  • semix2
  • エンターテインメント
  • ¥100

1ページ目は、基本系?アプリを置いている。
下2段は空ける主義。なんでかわからん。
そして上から3段目に最もよく使うアプリを置いている。
いつもそこに目がいくし、指が届きやすいので。

2ページ目

f:id:marikka753:20131031094642p:plain

2ページ目はソーシャル系のアプリたち。
有名どころばっかり。全部よく使う。

■FastCnP(簡単コピペ)

主にメアドの入力が面倒な時に使う。
あと日記のテンプレとかも置いてある。

簡単コピペ

簡単コピペ

  • AWALKER co., Ltd
  • ビジネス
  • 無料

3ページ目

f:id:marikka753:20131031095058p:plain

3ページ目はログ系アプリと、使わないアプリ。
フォルダに入っているのは使用頻度が比較的少ないもの。

  • Musicフォルダ    ギターの練習で使うメトロノームなど。
  • read n watchフォルダ TED公式アプリ、kindle、plexなど。
  • gamesフォルダ    cut the rope、angry birds、ragdoll2 など。
  • appleフォルダ      iTunesとかFaceTimeとか。ほぼ使わない。
  • smileyフォルダ    顔文字アプリを2つだけ。全然使ってない。場所埋め。
  • engフォルダ     英英辞書や英辞郎など。
  • zzztoolzフォルダ   めったに使わないツールアプリ。
              (Find iPhone、Bump、Compassなど。)

■SimpleMind+

マインドマップ作成に。操作簡単、すっきり表示。

SimpleMind+ (マインドマップ)

SimpleMind+ (マインドマップ)

  • xpt Software & Consulting B.V.
  • 仕事効率化
  • 無料

 ■Latte Camera

フィルタ充実。ぼかし機能や文字入れもサクサク。

Latte camera

Latte camera

  • LUXEYS
  • 写真/ビデオ
  • 無料

■aTimeLogger

カテゴリごとにタイムログをとってHTMLでEvernoteに送信。 

aTimeLogger

aTimeLogger

  • Sergei Zaplitny
  • 仕事効率化
  • 無料

■P tracker

 UIかわいい。主に体調日記として。気分の上下もかわいいグラフにしてくれたり。
生理周期とかわかりやすくて良い。バックアップも月1で自動的にやってくれるし。

生理カレンダ (Period Tracker)

生理カレンダ (Period Tracker)

  • GP Apps
  • ヘルスケア/フィットネス
  • ¥200

最後におすすめゲームをいくつか紹介。

 ■Toca Hair Salon

Toca Hair Salon

Toca Hair Salon

  • Toca Boca AB
  • 教育
  • 無料

これ超楽しい。髪を切ったり梳かしたり乾かしたりするアプリ。
キャラクターのアクションが面白い。スクショ機能もいい。

 ■Sweet Talk

Sweet Talk

Sweet Talk

  • Wrigley
  • エンターテインメント
  • 無料

 説明するより動画みてくださいw
たまに鏡を見ながらやってる。楽しい。


iPhone app- Juicy Fruit Sweet Talk - YouTube

以上です!

【25日目】パフィン

今日のPhotoshop練習。
パフィン!

f:id:marikka753:20131025000643j:plain

こちらのチュートリアルを見てまんま作りました。
http://www.sitepoint.com/create-an-adorable-8-bit-animal-in-photoshop/

このサイト(sitepoint.com)、良すぎる!
良質のチュートリアル多いし、すごくシンプルで初心者向けも多いし。
私の好みのデザインがたくさんありすぎるーー!
素材を自分で探さなくても良いのも最高。
やる気でるわ。こういうサイトつくる人すごい。

【23日目】宇宙的な何か

f:id:marikka753:20131023222810j:plain

 

参考チュートリアルはこちら

http://www.adobetutorialz.com/articles/30971156/1/create-unique-glowing-text-with-space-background-photoshop-cs5

すんごい手順多かった割には、完成がしっくりこないw
でも、レイヤーをグループ化したり、っていうのを何回も何回もやったので
少し慣れたかな。

さーOS X Marvericksにアプデするぞー。

【21日目】水滴の練習(失敗)

今日のPhotoshop練習。

葉脈についた水滴。

f:id:marikka753:20131021191452j:plain

f:id:marikka753:20131021191144j:plain

f:id:marikka753:20070529145938j:plain

へたくそになってしまったー。

参考にしたページ。

http://computersight.com/software/photoshop/rainy-day-animation-using-photoshop/

http://www.lunacore.com/photoshop/tutorials/tut006.htm

どっちのリンクもやっていることは同じです。

楕円つくって、オーバーレイでグラデーション。
ドロップシャドウとインナーシャドウをつけて、ブラシで白い丸を書いて完成。

いびつな形にするのが上手く行かなかった。

【20日目】まっさらから波紋

今日のPhotoshop練習。所要3分以下。

このチュートリアルすごい!

f:id:marikka753:20131017191645j:plain

 

フィルター5回くらいで、まっさらから波紋ができた!

こういうチュートリアル書いてくれる人の頭ん中見てみたい。

数時間だけ脳みそ交換してほしい。

【19日目】ドットでケーキの写真をつくる

今日のPhotoshop練習。

ケーキの写真をドットっぽいパターンにした。

f:id:marikka753:20131017190455j:plain

 

参考にしたチュートリアルはこちら。
http://pinkzap.com/?p=390

ぱくたそさんに美味しそうな絵があったので使わせてもらった。