クラスで話題の「塩娘」、ポラロイド風に…

今、クラスで話題の「塩娘」。
クラスメイトの方のご実家で作られている塩です。
せっかくの塩味を楽しみたいと、朝は「塩むすび」、夜は「枝豆とビール」でいただきました。
スーパーの安い、しおっからい塩とは違う、やさしい甘みを感じます。
丁寧に作られているのだろうな、と思わせる塩でした。
おいしかったです。ごちそうさまでした。
というわけで、結構前にphotoshopの授業で作ったポラロイド風写真。
「塩娘」さんに勝手に出演していただきました。

↓作り方はざっくりと、レイヤーで確認↓

アコーディオンパネル

jQueryを使ったアコーディオンパネル
項目をクリックするとテキストがアコーディオン風に表示。

↓クリックすると実際の動きとソースを確認できます↓


Headerをクリックするとテキストがアコーディオン風に表示。
Headerに画像を挿入。


↓クリックすると実際の動きとソースを確認できます↓

縦に可変する背景画像

■縦に可変する背景画像
テキストの長さに合わせて、枠の画像も伸び縮みさせる方法

  1. htmlのブラウザプレビューをキャプチャー。
  2. photoshopで開き、必要な枠幅を確認。
    ドロップシャドウ分をみてcontent幅よりやや小さめ。
  3. 角丸シェイプで枠作成。ドロップシャドウをつける。(戻れる様に、ここでpsd保存しておく)
  4. 画像統合し、シャドウを固定。
  5. 画像を上下に分け、jpg保存。
    (上:bgimg_content.jpg/下:bgimg_post.jpg)
  6. Dreamweaver/base.cssに画像挿入
#content	{
	width: 530px;
	float: left;
	margin: 0;
	background-image: url(bgimg_content.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
.post	{
	width: auto;
	background-image: url(bgimg_post.jpg);
	background-repeat: no-repeat;
	background-position: center bottom;
	padding: 2em;
}

XAMPP,MAMP,Apache,MySQL,PHP,WordPress………って何??

今日の授業を振り返って、整理してみる。

  1. XAMPPをインストール。
  2. WordPressをダウンロード→解凍。
  3. XAMPPのhtdocs内に解凍したwordpressフォルダを入れる。
  4. XAMPP→ApacheMySQLを起動。
  5. セキュリティのページで、MySQLのパスワードの設定。
  6. XAMPP→ApacheMySQLを再起動。
  7. phpMyAdminのページで、localhostでデータベースを作成。
  8. WordPressのアドレスにいく。
  9. WordPressの必要情報を入力。
    (サイトタイトル、ユーザー名、パスワード、メールアドレス)
  10. WordPressインストール完了。

※家では、MACMAMPをインストール。こっちはすごく簡単だった!

まいった!
いっぺんに新しい用語が出てきて、まったく頭がついていかない!!!
言われた通りに順を追って設定を行ったので、もちろん成功した。
でもそれでは意味がない。
なぜなら…
「何をインストールし、何の為に設定しているのか」
「どんな役割のものか、どう使いこなすのか」
「今まで試したものと、どんな違いがあるのか」
なんにもわかっちゃいないのだ。
そんな訳で、インターネットで調べてみる。
調べたところで、また知らない用語にでくわすけれど、自分なりに解釈してみた。
合っているかな?

  • MAMP
    Apache,MySQL,PHPを簡単にインストールできるパッケージ。
    Macintosh,Apache,MySQL,PHPの頭文字をとっている。
  • Apache
    世界中でもっとも使われているWebサーバソフトウェア。
    webサービスを提供するシステム。サーバーマシンの上で走るプログラム。
  • MySQL
    データベース管理システム。
    大量のデータを蓄積し、整理・検索を簡単にする。
  • PHP
    動的なページを作るプログラム言語。
    掲示板、ブログ、予約システム、ネットショッピングなどを作成するのに使われる。
    • PHPは、サーバーサイドスクリプト言語である。
    • PHPは、HTMLに埋め込む事ができる。
      • JavaScriptもHTMLに埋め込むタイプのスクリプトだが、クライアントサイドのため非常に制限が多い。
    • PHPは、CGIと比べて処理速度が速い。
      • PHP
        リクエストのたびにプログラムを起動することがなく、サーバーに負担がかかりにくい。
      • CGI
        WEBサーバーの外部プログラムなので、クライアントからリクエストがあるたびに新たにプログラムを起動。その為、CGIを実行するたびにサーバーに負担がかかる。
  • WordPress
    オープンソースの無料ブログツール。
    プログラム言語にPHP、データベースにMySQLを利用。

それぞれの役割・特徴・関係性が、少し見えてきた。
「これ見せて。あれ見せて。」とお願いすると「はいどうぞ。」と見せてくれているのがApache
つまり、こうしてインターネットを使って調べている時、Apacheが裏で働いているという事か。
今の断片的な知識が、そのうちつながるといいのだけど…。