今回はMacの標準ブラウザで有名なSafariの古いバージョンを同時に起動できる方法があるようなのでご紹介。
この「Multi-Safari」はver1.0～ver2.04までにリリースされた10個のSafariを、OS Xで起動させることが出来るツールです。
ダウンロードした各バージョンのSafariを起動してゆくだけで、複数の起動が行えます。
今回はsafariをご紹介しましたが、windowsのInternet Explorerの異なるバージョンを確認する Multiple_IEなどがあるのも知っておいて損はないと思います。
■Old Version Downloads
http://www.oldapps.com/
このサイトでは古いFirefoxなど一部の古いブラウザの他にiTunes、QuickTime Player等のその他ソフトウェアごとに古いバージョンもDLできます。
]]>
【INFOBAR第2弾】
この画像は、充電している状態。薄型で、色は緑もあるようです。
また、アンテナを内蔵しているので、そのままでテレビが見られるというもの。
この様に、プロダクトデザイナーとのコラボレーションなどで話題を呼び
「ﾃﾞｻﾞｲﾝケータイ」と言う言葉は、既に浸透していますが、
まだまだ衰える事無く、今後も益々注目を集めていくでしょう。
参照：『ウィキペディア（Wikipedia）』]]>
PHPってHTMLと違いローカルでプレビューできないですね。
デバックの度にいちいちサーバーにアップロードして確認しなければならない。
プラグラマーは自分のPCをサーバー化して、セキュリティ組んでバリバリ開発している人もいますが、デザイナーの人に取っては１から勉強してシステムを組んでいくのは大変ですね。
プレビュー命のデザイナーにはシステムなんて関係ねぇ！
でも作業効率を上げる為に開発環境を整えるのも大切です。
HTMLと同じようにPHPがローカルですべて完結したらすてきですよね。
そこで紹介するのが、「MAMP」というソフト。（フリーソフト）
名前の由来が Macintosh、Apache、MySQL、PHP の頭文字を取ったものらしい。
ようはMacでPHPやデータベースが使えちゃうという意味。？
このソフトを使用すればMacのローカルでPHPが使用する事が可能になります。
しかも簡単！
1.まずは公式サイトよりディスクイメージのダウンロード
http://www.mamp.info/en/index.php より
Download nowをクリック！
2.使用のMacのCPUに合わせてダウンロードして下さい
一番下の部分です。
3.ダウンロード完了後、ディスクイメージを展開する
4.３で展開したフォルダをアプリケーションフォルダにドラッグコピーでインストール完了！
5.MAMPを開く
左のApacheサーバとMySQLサーバが緑に光っていると正常に動作しています。
6.スタートページを開いてみる
ここがいわゆる管理画面的なもの。
ココから現在のPHP情報（phpInfo）やMySQLを管理できる「phpMyAdmin」を参照できます。
7.実際にphpをローカルで動かしてみる。
MAMPをインストールしたからと言って、どのディレクトリのPHPでも動作するというものではありません。
「アプリケーションフォルダ」の「MAMP」の「htdocs」内のPHPのみ動作します。
このフォルダに突っ込んでみましょう。
開いてみると動作するはずです。
8.ちょっと便利にする
htdocsにアクセスするのにいちいち「アプリケーションフォルダ」の「MAMP」の...としているとめんどくさいです。なのでデスクトップにエイリアスを配置して置きましょう。
これでばっちりですね。
MAMPは簡単に開発環境を整える事が可能です。
これからはデザイナーもPHPといったサーバー再度プログラムも扱わなければならない時代。
これを機にPHP触ってみてはどうでしょうか？
ここに自分のメールアドレスと、変換したい画像などを入れて、
変換したい形式を選択するだけで、メールで送ってくれます。
試してみたが、２分程です。(例：jpg→gif）
何か、お困りの際には、使用してみて下さいね。
]]>
■Potrase（現在 ver1.8)
→http://potrace.sourceforge.net/（海外サイト）
■バッチファイルの作り方
1：メモ帳等のソフトを起動
2：[potrace.exe *.bmp]←これを開いたメモ帳に貼り付け
※「potrace.exe」の後にある半角スペースは必要なので消しちゃダメです
3：メモ帳の名前を[（好きな名前）.bat]というファイル名に変更して保存！
ﾟ･*:.｡. .｡.:*･゜完成ﾟ･*:.｡. .｡.:*･゜
上記の方法で使用出来ない場合はこちら！
■akJ betas.exeダウンロードサイト
僕個人は白ベースの”サッパリ”したサイトが好きなのですが、
こうして、あらためて並べてみると黒ベースはやっぱり”かっこいい”感じになりますね。
それに蛍光色が映えますから、思い切ったデザインができますね。
]]>続いてインストール。
用意するのは次の情報
データベースの名前 データベースのユーザー名 データベースのログイン名
後は以下のサイトの手順通りインストールを行う
1km.info http://www.1km.info/modx_site/modx_install.html
このサイトはすごく丁寧に手順を記載していて分かりやすいです。
おまけに日本語化する方法や、最初にしておいた方がいい基本設定まで記載してあります。
（お世話になりました）
この時点で気づいてる人もいると思いますが、管理画面が緑！
じゃなくてAjaxバリバリなんですね。んでもってそんなに重たくない印象です。
結構細かいところまで作り込まれていて、視覚的に分かりやすくなっているので、WEB担当者じゃなくても大体どんなものか分かると思います。
管理画面左側にはディレクトリがツリー形式で並んでおり、ここから右クリックでそれぞれのドキュメントの編集、削除が行える。
MTやWPにもテンプレートというものがあるが、基本的には一緒。
外部のエディタかなんかで、HTML書いてコピペでMODxに持ってきた後で
変数や設定値とかを手を加えてあげるだけで、簡単にテンプレートができます。
<h1>
<a href="index.html" >
<img src="/images/logo.jpg" alt="ICSIGN" /></a>
</h1>
<h1>
<a href="[(site_url)]">
<img src="{{temp_url}}images/logo.jpg" alt="ICSIGN" /></a>
</h1>
<h1>
<a href="http://www.icsign.com">
<img src="http://www.icsign.com/〜/images/logo.jpg" alt="ICSIGN" /></a>
</h1>
とこんな感じで変数や設定値を記述し、テンプレートを仕上げて行く訳です。
PHPプログラムで出来ているのですが、テンプレート内やドキュメント内にスニペットを動作させるPHP（スニペットコール）を記述する事で使用できます。
スニペットには、お問い合わせの入力フォームを生成してくれる「eForm」や、
ドキュメントの一覧で出力してくれる「Ditto」など
様々なタイプのものがあります。
[!eForm?
&formid=`generalForm`
&subject=``
&form=`infoweb@icsign.com`
&to=`xxxxx@icsign.com,xxxxxxx@icsign.com`
&tpl=`formc`
&report=`formc_report`
&thankyou=`formc_thankyou`
&formname=`INTERNET CIRCULATE SIGN2, Ltd.`!] スニペットを出力する際のテンプレートというものがあり、
その際チャンクを呼び出し使用します。
例えばお問い合わせフォームの入力欄や項目はスニペットで生成して、
レイアウトや装飾部分をチャンクに記述しておきスニペットで呼び出す感じになります。
その他、全ページ共通の情報をチャンクとして保存しておけば、
どこからでも呼び出す事が可能です。
http://www.icsign.com/assets/templates/icsign/
{{temp_url}}
これが結構便利。
テキスト入力欄や、チェックボックスや、リストをドキュメント作成時に追加できる。
何が便利かというと、追加したものはテンプレート変数として呼び出せる事が出来る。
ドキュメントごとに画像を変更したい場合、あらかじめURL入力用のテンプレート変数を作っておき、ドキュメント作成時に画像のURLをそのテンプレート変数に入力する。
その後テンプレートでも、チャンクでも呼び出すような設定をしておけば、簡単に呼び出せます。
このMODxはページをキャッシュする機能があり、
ほかのCMSツールよりも呼び出しスピードが速いみたいです。
まだ全然研究できてないのですが、未知の可能性を感じます。
またMTやWPのようにブログ感がないので、使用感はこれぞCMSって感じでしょうか。
機会があればぜひ導入してみてはいかがでしょうか？
言わずと知れたMicrosoft社のオフィスソフト
Mactopia Japan http://www.microsoft.com/japan/mac/products/office2004/default.mspx
フリーのオフィスソフトがいいなら
NeoOffice http://www.neooffice.org/neojava/ja/index.php
デザイン関係の人は外せませんね。
Adobe社 http://www.adobe.com/jp/
ブラウザ。
Safariよりタブブラウジングやアドオンが充実している。
Mozilla Japan http://www.mozilla-japan.org/products/firefox/
Googleさんにお世話になっている人は入れとこう！
GmailやGoogleカレンダー、Google検索まですべてデスクトップで操作できちゃう
Google Desktop Download http://desktop.google.com/mac/
Gmail用のブラウザー
SafariやFirefoxよりも高速です
Gmail Browser http://willmore.eu/gmailbrowser/
最強最速ランチャソフト
Control＋Spaceで呼び出して、コマンドを入力するだけでいろんな事が出来る
例えば「sa」とコマンドを打つだけでSafariを開ける
QuickSilver http://quicksilver.blacktree.com/
C言語、Java、HTML、PHPという開発向けテキストエディタ
プロジェクト管理は出来ないのですが、とりあえず動作が軽い
mi http://mimikaki.net/
老舗テキストエディタ。
Mac標準のテキストエディタが物足りない人はぜひこちらを
Jedit http://www.artman21.net/product/Jedit4/index.html
入力支援ツール
Shift×２で呼び出してメニューを呼び出して選択するだけ
定型文やHTMLやCSSのタグを登録しておけば、最速ですね
T.Clip X Std http://www.trinityworks.co.jp/software/TClipXStd/
FTPクライアントソフト
WindowsのFFFTPを使ってた人なら使いやすいですね
Transmit http://www.act2.com/products/transmit/
フリーFTPクライアントソフト
フリーでここまで出来ればいいですね
Cyberduck http://cyberduck.ch/
フォトビューアソフト
私の知っている中で最も高速かと
Photo Grid http://www.nattaworks.com/frameRight.html
解答専用ソフト
定番ですね
SttuffIt Expander http://www.act2.com/download/freeware.php
アンインストールソフト
Macの場合アプリケーションはゴミ箱に捨てるだけで表向きはアンインストールされるのですが、細かなゴミは残ったままなのです。そういうの気にする人はぜひ
AppZapper http://appzapper.com/
動画再生ソフト
多種類の動画形式に対応してるので、インストールしときましょ
DivX http://www.divx.com/?lang=ja
メンテナンスソフト
OSの最適化や、キャッシュのクリアが行える。
少しMacの動作が遅くなってきたと思ったらこれで最適化してみよう
OnyX http://www.titanium.free.fr/pgs2/english/download.html
参考になればいいかと思います。
]]>tutorial blogさんのページでクールなワークスペースが紹介されていましたので、少し覗いてみましょう。
]]> まずはこれ。
マックカラーのような感じで統一されおしゃれですね。
僕は結構スキです。
そのデスクライト欲しいです。
凄く開放的ですね。
眺めは良さそうですが、落ち着けるのでしょうか。
この時期はあつそうです。。。
一箇所で全てができてしまいそうですね。
最後は僕が一番気に入ったワークスペースです。
さっぱりしていて、一番落ち着きそうな雰囲気が気に入りました。
続きはtutorial blogさんのこちらの記事から見れます。
http://tutorialblog.org/cool-workspaces/
javascriptを利用して実現することも可能だと思いますが、今回はCSSのみでフッターの位置を画面の下に固定する方法をご紹介しようと思います。
]]> 早速、下記のリンク先を見てみてください。http://ryanfait.com/sticky-footer/
ブラウザのウィンドウサイズを変えたりしてみても、常にフッターが画面下に固定されていますね。
では、実際に実装する方法の説明です。
[1]:HTMLで最低限必要な記述は以下の通り。
<body>
<div class="wrapper">
<!--
コンテンツをここに
<h1>タイトル</h1>
<p>内容内容内容</p>
-->
<div class="push">
</div>
</div>
<div class="footer">
</div>
</body>
class="wrapper"の中にコンテンツとなる内容を記述(マークアップ)していきます。
また、div class="push"が無いとOperaで「class="footer"」と「div class="wrapper"」の内容が重なって表示されてしまうようです。
次にCSSでの記述です。
html, body {
height: 100%;
}
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%; /* ie用に設定 */
margin: 0 auto -100px;
/* class="footer"と同じ高さ(100px)の負の値を入力 */
}
.footer,
.push {
height: 100px;
}
注意点としてclass="footer"とclass="push"の高さを同じにします。
また、class="footer"とclass="push"の高さと同じだけclass="wrapper"のmarign-bottomにネガティブ指定をします。
以上でフッター位置固定の実現が可能です。
しかし、実際に使用してみると原因は不明なのですが、時々表示が不安定だったりするといったこともあるようです。
それでもテクニックのひとつとして、覚えておいて損はないのではないでしょうか。
参考：（CSS Sticky Footer）
]]>