2016.07.04
Maromaro社内の知識共有した話をまとめてみた201607
こんにちはMaromaro佐々木です。
Maromaro社内で定期的に知識共有をしていまして、
各々共有したい情報を書き込んで話し合っています。
自分自身も思い出すためにまとめてみました。
ジャンル選ばずなので、色々入ってしまっています(汗
コーディング関連
JPGとPNGのロスレス圧縮(劣化しない)
JPG
jpegoptimを使う
PNG
OptiPNG使う
CSSで使うアイコンファイルをオリジナルで作成する
https://icomoon.io/app/#/select
svgファイルをいれたり、フリーのアイコンを選んでオリジナルのアイコンフォントが作れる。
アイコンフォントだと色々なサイズに劣化なく対応できるのと、色の変更が柔軟。
納品ファイルにゴミが入らないようにする
書くほどの事でもないですが、下記のようなファイルは納品時に削除するように
Thumbs.db .DS_store _notesフォルダ等も注意
Firefoxで画像が表示されない時がある
安全なサイトではないとされることがあるようで
画像の読み込みなどがブロックされることがありました。
アドレスバー左の地球儀マークを押して該当箇所を許可にすると改善されます。
pタグの中にiframeはいれても良い。
むしろインライン要素の中にいれても良い
何故ならiframeがインライン要素かつブロック要素だから
https://w3g.jp/xhtml/dic/iframe
画像ファイル名の大文字小文字について
基本中の基本ですがWindows系では実はファイル名の大文字小文字はパス指定時に判別されていません。
File.pngとfile.pngは共存できないのです。
linuxだと別ファイル扱いになるので、うっかり画像ファイル名と実際のHTMLタグで指定したファイル名が違うと表示されない事に。
【CSS】transitionプロパティ使用時に、Chromeブラウザで1pxずれる現象を回避する
要素に backface-visibility: hidden; を追加すると改善される。
参考
http://bashalog.c-brains.jp/14/02/03-144700.php
PHP、Wordpress
下記のように最後だけ省略可能 移行時にとっても役に立っているプラグイン 参考 下記参考。 配列の最後にカンマがあるとエラーが出るブラウザがあります。 下記はNG 下記はOK noConflictを使うと複数のJqueryが共存できます。 Math.randomでランダムにしたつもりが、偏っていた・・・ 参考 SNSに認識されない事案がありました。 RewriteRuleを続けて書いても以前のRewriteCondはリセットされている。 D-SUBで差し込んでいたのをDVIにしたら改善。 簡単にメールの内容をSlackに送れる Slack落としてやらないとだめ 参考 っと、まだまだあるのですが長くなってしまったのでこのあたりで。
<?php
echo "test1";
?>
<?php
echo "test2";
wordpressの内容をそっくりそのまま移行するプラグイン
JS関連
Jquery attr と propの違いでチェックボックスの書き換えができない
http://qiita.com/kbyay_/items/7a7ce9547f29b34a63b1Javascriptの配列の最後のカンマはつけてはいけない
[1,2,3,]
[1,2,3]
jqueryを複数読み込む時にはコンフリクトの対策をする
既存サイトの作業などで元々のバージョンが古い場合に大活躍!
var jq1_11_3 = jQuery.noConflict(true);
Math.randomは偏る
http://bost.ocks.org/mike/shuffle/compare.htmlOGPタグは動的に吐き出したらダメ
サーバ関連
htaccessでユーザーエージェント分岐する場合 RewriteCond と RewriteRule は抱き合わせする
参考
http://blog.livedoor.jp/tak_bon/archives/6508443.htmlデザイン関連
FireworksでSVGをパスから書き出しプラグイン
ディスプレイで見えない色が出た件について
Slack
Slackのemail機能
gmailとかと連携して、件名等で振り分けて通知とかするとさらに良いです。Slackの中華フォントをメイリオに変える
http://qiita.com/oboenikui/items/db11a3a4cbcf0d373d28
代表特権で次回も・・・・・このネタで・・・!?