matumaeduke のすべての投稿

wordpress4.4 embed機能のテスト

wordpress4.4で記事投稿欄にURLを貼るだけで対応していればツイッターカードやブログカードのように表示してくれる機能、embedが使えるようになったようだ

wordpressプラグイン:麻雀牌プラグイン

おーできた。見目美しいな。

んー?でもこれURLを単なるURL文字列として表示したい場合どうすりゃいいんだ??wwwあとで調査して追記するわw

※追記

 http://mayoi-dev.wslab.net/archives/241

1行にURLだけであればカード化する、そのほかの文字が入っていたらカード化しないらしい。↑はURLの前に全角スペースいれてある。

行の途中にどうしてもカードを入れたいのであれば
[embed]URL文字列[/embed]←カッコは半角
すればいい

たとえば

wordpressプラグイン:麻雀牌プラグイン

こんなふうに.

ちょっとまてw[embed]←カッコは半角 記事中にこれ書けなくなったじゃんwどうすんだwさらに調査w

wordpressプラグイン:麻雀牌プラグイン

趣味でネット麻雀やっててなんだか初心者さんにあー画像付きで牌並べて説明したいなあと思ったりしたのだけど
あれ?もしかしてwordpressで麻雀牌並べるようなプラグインあるんじゃね?ってさがしてみたらあったあったありました。
麻雀牌プラグイン
http://wordpress.1000sei.com/mahjong/

趣味と実益を兼ねて麻雀ブログでもはじめようか、いやサイト1個作るほどのことでもねえな・・・ならこのブログでやろうかとか思ってしまった私を誰が責められようか(いや責められない)(反語)

つうかちゃんと仕事と勉強しろよっていう・・・

Firefox40に更新してみたら表示不具合?(レイアウト崩れ)(ほぼ総括)

私が総括したわけではないーw 感謝感激おれ秀樹

もずはっく日記: Bug-org 1194055 Size of <input> elements has changed in Firefox 40
http://www.d-toybox.com/studio/weblog/show.php?mode=single;id=2015081600

一番くわしく纏められています。

  1. 障害は日本語windows7,vistaだけのもよう
  2. font-familyの設定をするのではなくwidth,max-widthを設定すべきとのこと
  3. firefox41で修正可能性があること(されない可能性も多分にある)

こーすりゃいいあーすりゃいいなんて一概に言えないなあ。
win7,vista+firefox40の場合のみ発現するなら切り捨てるか個別OS対応するかしてもいいとも思うが今後またへんなシステムフォントを引っ張ってこられてもデザイナーはOSごとの対応迫られて困るわけででもそれはOSのリソース使う以上しかたのないことで→(ループ)

レガシーなメンテナンスほとんどしてないようなウェブサイトや社内ページも保守できたらいいけど全部が全部メンテできるわけでもなく一サービス利用者なだけだったら文句もなかなか通らず、でもそんなメンテしてないとこ使うなよといわれるかもしれないけど必要なサービスなら使わないといけないしさらになんかwikiとかでも問題になってるところがあるらしいし。。。

んーわからんw場末のこんな未熟者が考えてもどうしようもないですね。

旧来OS・システム・ブラウザの挙動・フォントなどなど私は全然知識が足りて無くどうすればいいのかわからんけど、まあ取り急ぎ有益な情報なので。充分自分だけが対応するには助けになります。改めて感謝

 

(2015/08/20 ※追記)
width,fontが設定されて無いフォームについてMS Shell Dlg 2というフォントの平均サイズにてフォームを表示させる対処をする方法が提案・検証されているようです。メイリオの平均サイズがあまりにいままで(MS UI Gothic)と違いすぎるのが問題視されての処置だそうです。少々大きくなるようですがさほど違いが無いらしいらしいらしい…(検証せんの?m(_ _;)m)

(2015/08/28 ※追記)
firefox40.0.3がリリースされました。さっそく更新して自分のレイアウト崩れたサイトみてみたところほぼinputタグの大きさは元通りになっていました。これにて解決です。少々Firefox39から大きくなるとの情報は得ていますが、概ねあまり変わらない程度にまでなったことを確認して一連の事象はFirefox40~Firefox40.0.2までのものと思って解決になります。

Firefox40に更新してみたら表示不具合?(レイアウト崩れ)(※2015/08/15 22:30追記)

んーまだよくは分かっていない。
おさらいとして現象:windows7+firefox40に更新すると<input>要素などの横幅が2倍近くに広がってしまうサイトがある。

私の場合いままで自サイトではcontainerからのフォント指定を継承してメイリオ指定していたのだけど、入力フォントとして扱われずMS UI Gothicが入力用に使われていたのだと思う。
だもんで、単純にサイト製作者側としての対応としてはCSSにて

input{ font-family:MS UI Gothic; }

もしくはtype指定で

input[type=text]{
font-family:MS UI Gothic;
}

とすればwindows7+firefox40での表示は元通りではある。(自サイト+windows7+firefox40で検証済み)
けれどもmac,win10,win8とかは比較検証機材が無いため表示するとどうなるかわからん。
むしろ今までどう表示されていたのかも知りたいところではあるw
もちろん昔からある手入れがあまりされてないようなサイトを表示する場合でもwindows7+firefox40では問題が残り続けるでしょう。
あと社内イントラネットのページもレイアウトが崩れる場合があるので(特に社内だけだと手を抜き易いw)firefoxを許可してる会社でもfirefox40への更新ちょっとまった!状態になるとおもう。

不確実な情報なのであまりよくわからないが原因はなんかメイリオとMS UI Gothicのフォントの横幅の差が酷いらしい。

いくつかあるブラウザの表示差異を埋めるだけでヒーコラ言ってるので、できればOSでの違いまで考慮したサイト作りをさせない方針が示されることを望みます。また何か進展があれば記事を上げます。

(※2015/08/16 21:00ぐらい追記)
fontを決め打ち指定でなくwidth,max-widthをinput要素に指定する方法が提案されています。詳しくは↓で。
Firefox40に更新してみたら表示不具合?(レイアウト崩れ)(ほぼ総括)
http://mayoi-dev.wslab.net/archives/217

Firefox40に更新してみたら表示不具合?(レイアウト崩れ)(※2015/08/14 04:00追記)

やはり問題になってますね。firefoxデフォルトのinput textarea select 内のフォントがMS UI Gothic→メイリオに変更された為ということらしい。
うちのサイトではcontainerにメイリオ指定いままでしててそれが要素に継承されてたはずなんだけどなあ
どうも今まではinput要素そのものにスタイル指定していない限りinput要素があった→中身の文字はMSUIgothic となってたのかなぁ?
どちらが正しいかっつーと今が正しい表示されてるってことか?いやいやwin10やwin8で今まで通り見えてるんだからそれはないか
深まる謎をかかえたまま3日目へ・・・

あとmozillaでのこれの話題。一人現況説明と対応をがんばってる方に感謝と激励を送る。
796 :名無しさん@お腹いっぱい。:2015/08/13(木) 15:06:57.81 ID:8DV7rnJz0
40.0でレイアウトが崩れたサイトがある

Bug 1194055 – Size of <input type=”text” /> elements has changed in Firefox 40

https://bugzilla.mozilla.org/show_bug.cgi?id=1194055

 

(2015/08/14 11:00)
firefox40.0.2が公開されてますね。拙速な行動に定評がある私が更新を試してみましたが、レイアウト崩れは修正されてないようです。継続で。

Firefox40に更新してみたら表示不具合?

firefox40がリリースされたとの事で早速更新してみたのだけど、サイトのhtml中のinputボックスとかselectタグのプルダウンメニューの表示が今までと違ってなんだかおかしい。
inputボックスはサイズがおかしいし、プルダウンメニューはメニュー選択項目にマージンかかってるように隙間が開き過ぎる。
デフォルト入力文字のフォントもなんかおかしいきがする。sizeが効いていないかんじ?

IEとの表示差を比べてみた。2chですらこんなかんじにレイアウトが違って見える。ブラウザ違うからとかでなく以前のバージョンと比べれたら一番よかったのだが、自分のサイトも表示崩れてしまっている。バグならバグで早急に修正してもらいたいのだけどこれが仕様だと言われたらサイトも手直ししなきゃいけないが、なぜか幾つかの同様の報告以外情報が得られない。
firefox使ってる全世界中で確認されていて文句出ていてもおかしくはないというのに。

仕様かバグかだけでもハッキリしてほしい。続報・継続調査で。

20150812iefirefox40

(※2015/08/13追記)
さて1日経過したわけですが同様の症状が出てる人もちらほらネットで見かけます。
今のところwindows8.1,windows10では問題なく、windows7,windowsVistaで正常表示されていないようです。fontが勝手に変わっているとかなんだかOS,fontなにかそのあたりに原因がある模様
また継続調査で。

文字列の短縮

ダラダラと長い文字列をサイトのブロック要素にぶち込んで並べた場合に、文字列の長さによってブロック要素の大きさがまばらでなんだか格好が悪いので長い文字列の短縮をしましょう、ということで。

$strtitle = mb_substr($title,0,30,"UTF-8");
if ($title<>$strtitle) $strtitle.="…";

最長の文字列とブロック要素の大きさを調整して表示すると綺麗に並べれて美しくなるよ

20150722雑記 AccessAnalyzer障害対応法の調査

適当にAccessAnalyzerがログ取得遅延を起こした場合の対処法をネットなどで調査した。
まああまり褒められた手法でもありませんし・ホントにこれで改善するのか?というものまで。
まあ話半分ネタだとおもってw

■■1)解析タグを自ページの最後のほう下方位置の移動する

これはまあ障害が起きる前にほんとはやっておくべきことなのですが、
ページの先頭、bodyタグのすぐ下なんかに置いたら目もあてられません。自ページ全ての表示が遅延してしまって白いページで待たされるような事が発生する可能性があります。
フッターあたりにでも置いていたら解析タグがあるところまではさっさとブラウザは表示してくれるはずなのでフッターもしくはそれ以下の部分に解析タグを設置することをお勧めします。
まあたしか設置説明書みたいなのにはなるべく上方などと書かれていた気がしないでもないのですが情強のおれは騙されません(ほんとかよ?w)

■■2)設置タグに書かれているURLのサーバ記述を変更する

http://j1.ax.xrea.com/l.j?id=(サイトID)
http://w1.ax.xrea.com/c.f?id=(サイトID)

http://j2.ax.xrea.com/l.j?id=(サイトID)
http://w2.ax.xrea.com/c.f?id=(サイトID)

設置タグに書かれているURLのj1,w1をj2,w2に変更する。
鯖の二重化がされてるそうでj1,w1サーバが障害になっても対応できるそうです。
でもユーザ手動でタグを書き換えってw
私は試していません。結局同じように障害になる可能性が否定できないので。特にアクセス遅延の場合アクセスが集中して起こる場合が多いので手動で切り替えなんてやってられっかってかんじですw

■■3)設置タグのスクリプトをasyncにする

<script type=”text/javascript”><!–

<script type=”text/javascript” async><!–

なんかネットでみかけた。非同期にしたらいいよ!ああそうなんだ!えー結局遅延してんじゃんとか思った。
まああまりタグの改変はお勧めできんし、こっそり私がやってみた結果変わらん気がするし問題も解決しなかったように思う。
続くなんだIDやらADやらFRAMEやらの変数数値もどっか別のスクリプトで書き換えられても動作おかしくなるらしいし。

■■4)携帯用タグを使う。

<a href=”http://w1.ax.xrea.com/c.f?id=(サイトID)” target=”_blank”><img src=”http://w1.ax.xrea.com/l.f?id=(サイトID)&url=X” alt=”AX” border=”0″></a>

一番現実的で有効な対処でそしてガッカリw PC用とはちがってjavascriptは一切使ってない。偽装の画像イメージが表示される事でログを取得してる。
スクリプトのアクセス遅延だけの場合これはすごく有効。サイトページ表示も速い。
問題点は2つ

  • 結局こっちもアクセス遅延したら一緒じゃん
  • リファラが取れず何処から自分のページへ飛んできたか分からない・画面サイズ・閲覧者IDも取れない。一見上手く動いたようにみえてその実得られるアクセス解析のデータは削られ正直、アクセスがあった!○件!しかわからない。これではアクセス解析というよりアクセスカウンタである。

あと画像にアンカーリンク張ってあるけどnofollow属性もつけてほしい。なんか損してる気分にもなる。

■■5)自分でアクセス解析を作る。

これ一番お勧めできるw信用のならんサービスを使用するより自分の利用してるサーバが生きてる限り使えるw
他人のアクセスやら他人へのDOS攻撃でサービス遅延起こすサービス使うよりも「自分の事は自分で」精神でw
(まあ自分のとこがDOSされたら対処も自分でやらないといけないけどw)
私みたいに詳細な解析結果を必要としない人でプログラムに自信がある人はやってみたらいいんじゃないかと思うよ。どうせ自分に必要なところしか作る必要もないのだし。
少なくとも上記携帯用タグで得られる情報までは簡単に昨日1日で作れた。
まあ自分で保守で解析画面作る手間も発生するが楽しんで作ればいいんじゃねえかともおもう
いいものができたら俺にもつかわせてくれw

20150722雑記 AccessAnalyzerの障害に思うこと2

(20150722雑記 AccessAnalyzerの障害に思うこと1からの続き)

どうせ

  • 日々のアクセス数と
  • どのページが閲覧されたのか
  • 何処から飛んできたのか

を適当に見てる私としては

  • またか、早く直ってよねー
  • アクセス数が少なくて気分がわるいな

ぐらいにしか思ってませんでした。

アクセス解析は技術的には

  • 設置タグのjavascriptが動いて各種閲覧者のブラウザの情報とか抜いてサーバへ送ってログる、
  • javascriptが動作しないならタグの偽装イメージを表示させてスクリプトで得られるよりも少ない情報でアクセスをログする
  • web上で解析ログの表示解析画面表示・ユーザ管理・登録サイト管理

というまあ私でも作れちゃいそうではある簡単な代物。でも解析ページとか作るのメンドクサイしDBの容量など管理するのがちょっとメンドクサイなとおもってこの無料アクセス解析使ってたわけです。

まあ無料で定番でどの時点でログられてどんなアクセスがはじかれるか大体分かってる私としては、まあ古臭いし日本語URLへの対応が杜撰だけど、続いてるだけ信頼性があると今まではおもってきた。

しかし使ってるうちに自分のサイト上に設置されたlightboxというweb上でウィンドウ表示させるようなスクリプトが動かないことが多発してました。
なんでかなあと調べると、サイトが全部読みきられる前にウィンドウ表示させるリンクを踏むとウィンドウにならない事が判明。たしかにウチのサイトは重いなあと思って放置してたのですが結局「AccessAnalyzer」のアクセスログ取得スクリプトが詰まって重くなっていたようです
つまりAccessAnalyzerのスクリプト遅延→他のスクリプトの実行遅延で関与してたってわかった。

よくよく考えてみると

  • 自分のサイトを重くしてまで使う必要があるのか
  • 時勢が変わってjavascriptがまともに動かないと不味いご時勢になっちゃったわけで、アクセス詰まって動作しなくなると正直ページランクにも影響与えかねないんじゃね?
  • javascript中心でサイト制作してるところは下手するとコンテンツがまったく表示されないということもあるらしい。

昔ながらの定番ツールで私的にログ閲覧し易いツールではあるけど、あまりに時代に取り残されてないか?メンテ・改善が完全におろそかになってしまってる気がする。
googleがjavascriptを推しはじめてブラウザ側実行スクリプトの定番がjavascriptにほぼなった今日、javascriptの遅延はサイト制作してる者にとって致命的であるわけで。

まあそれぐらいならと自分でログ取得を作りはじめたのだけど今日さっきいきなり障害が直ったらしい。でも自サイトを重く使いづらい状況にしてまで今後このサービスを使い続けるかどうかは一考が必要であると思います。(終わり)