facebookのロゴって「f」マーク以外は使っちゃ駄目!ちゃんと利用規約読んでくださいッ!

仕事の関係上、いろんなウェブサイトを見ておりますが、表題の通りfacebookのロゴを勝手に使用しているサイトがございます。

ちゃんと利用規約読みましょう。
facebook ブランドリソースセンター
https://www.facebook.com/brandpermissions/logos.php

「facebook」文字列を使用したロゴありますよね?
アレだめらしいんですよ。基本的に使っていいのは「f」マークだけ。
そんで、たとえば画像のテキストで「facebook」もNGらしいですよ。
なぜか「Facebook」と頭のfを大文字にすればOK。

なので↓こういう使い方ならOKらしい。

サイトマップ内に「サイトマップ」って項目はいらんだろう?

たとえば「sitemap.html」というサイトマップのページがあったとして、その中に「サイトマップ」という項目は必要ないですよね。

  • トップページ
  • 会社概要
  • サービス紹介
  • お問い合わせ
  • 個人情報保護方針
  • サイトマップ ←これいらんやろ

非常に簡略化していますが、上記みたいなリストがあった場合に、ナビゲーションで、同じページが重複しても構わないと思いますが、サイトマップを閲覧している時に、サイトマップというページを表示する必要性がどれくらいあるか疑問です。

せめて正しいマークアップをしよう

こんなパンクズのコードを見る度悲しくなります。

[html]
<div class="pan_navi">
<p><a href="../index.html" title="トップページ">HOME</a> &gt;&gt; <a href="index.html">施設紹介</a> &gt;&gt; 施設名</p></div>
</div><!–second_pan_navi–>
[/html]

CSS当てづらいんですよ…。全く融通が聞かないコードになってしまう。

htmlの意味を考えるとulかolを使うと思いますが、私はパンクズをマークアップするときは、なるべく<ol>を使う様にしてます。
理由は、トップページからの順番を意味を持って示したいという意図があるからです。

[html]
<ol id="topicPath">
<li><a href="../index.html" title="HOME">HOME</a></li>
<li><a href="index.html">施設紹介</a></li>
<li>施設名</li>
</ol>
[/html]

今さら…。jQueryとprototypeの共存とか…。

私は最近はもっぱらjQueryしか使ってないのですが、4〜5年前のトレンドというか、なんというか、prototype派の人もいたわけですよ。

でですね。

「prototype使ってて、今後はjQueryに移行したいけど、今の段階だとprototypeも残したい」みたいな案件もあるんですねぇこれが。

prototype使ってるhtmlにそのままjQuery入れると、”$”が共通して使用しているため、競合してしまってどっちかが動かないか、もしくは両方全く動かない状態に陥ります。

じゃーどうしましょう。

こーしましょう。
まず、prototype.jsから読み込みをします。
で、noConflictの記述をします。

[html]
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/jquery-x.x.x.js"></script>
<script>
jQuery.noConflict();
var j$ = jQuery;
</script>
[/html]

上記まで書けたら、解決までほぼ完了。

と言いたいところですが、jQueryで使用している”$”を全て”j$”にする必要があります(jQueryのソースファイルじゃなくて、プラグインで使用している”$”です)。

例えば、jQueryでスクロールを制御しているのであれば、

[javascript]
$(function(){
$(‘a[href^=#]’).click(function() {
var href= $(this).attr("href");
var target = $(href == "#" || href == "" ? ‘html’ : href);
var position = target.offset().top;
});
return false;
});
});
[/javascript]

と上記のように書いてあったとして、それを下記のように書き換えます。

[javascript]
j$(function(){
j$(‘a[href^=#]’).click(function() {
var href= j$(this).attr("href");
var target = j$(href == "#" || href == "" ? ‘html’ : href);
var position = target.offset().top;
});
return false;
});
});
[/javascript]

とりあえず全部の”$”を”j$”にすりゃOKです。”$”を”j$”に全置換したらいいんじゃないかしら。

これで競合せずにjQueryとprototypeが使用できるようになります。

でもまーぶっちゃけ、jQueryとprototypeを両方使うなんて普通に考えたらしないんだけど、案件次第でさ…。

さくらVPSでconcrete5 その0 はじめに

クライアントワークで、企画〜デザイン〜コーディング〜さくらのVPSを使ってConcrete5のインストールと組み込み、メールサーバーの設定まで一通りやりました。

多分プログラム畑の人なら、簡単に出来てしまうんじゃないかと思うのですが、私はずっとデザイン畑で仕事してきたので、色々な作業が思い通りにいかず試行錯誤を繰り返してなんとか完成までこぎ着ける事ができました。

なおさくらVPSは契約した時点でのバージョンはcentOS6.3でした。
バージョンは以下のコマンドで確認できます。

[code]
[user@servername ~]$ cat /etc/`ls /etc -F | grep &quot;release$\|version$&quot;`
CentOS release 6.3 (Final)
[/code]

ちょっとやった作業が多いので、一度にまとめて公開するのではなく、下記の手順にしたがってこれから数日かけて記事をあげていきたいと思います。

手順リスト

  1. はじめに
  2. VPSレンタル
  3. ドメイン取得
  4. DNS設定
  5. サーバー設定
    1. ユーザー作成
    2. SSH接続設定
    3. ファイアーウォール設定
    4. apacheのインストール
    5. ホストの設定
    6. PHPのインストール
    7. MySQLのインストール
    8. phpMyAdminのインストール
  6. メールサーバー構築
  7. Concrete5のインストール
  8. Concrete5の組み込み
    1. そもそもConcrete5ってなんだ
    2. Concrete5の中身
    3. テーマファイルの作成
    4. ブロック
    5. カスタムテンプレート
    6. アドオン
    7. Designer Contentとは
    8. ページタイプ
    9. ユーザー
    10. 権限
    11. キャッシュ設定
  9. おしまい

これ全部書き終わった頃には、多分一冊本が書けるよね(笑)
きっと優秀な人がconcrete5の本出してくれるんだろうなー(遠い目)