ブログをリニューアルしました


このブログ、つまり、ウェビングスタジオのメインブログをリニューアルしました。

リニューアルというか、長年積み重なった設定を初期化して、a-blog cmsのブログ用公式テーマ「blog2015」をベースにしたという縮小に近い改修です。
blog2015は読みやすく扱いやすいテーマです。使っている他の人のブログを見て気になっていました。この機会に使ってみることにします。

15年近く続けてきたブログが昨年ころから書けなくなり、g.o.a.tへ移転してみたり、非公開の場所で完全にプライベートの日記を書いてみたりしていました。
一方でTwitterやFacebookは大量に投稿していたので、書けなかったのは「役に立つ情報が充実した、人気が出そうな記事を書かなければならない」というプレッシャーのせいだと思います。
私のライフログが、私のドメインにまったく残っていないのは、やっぱり悲しいです。

純粋な技術情報はQiitaで書いているので、今後はブログをはじめた頃の原点に戻って、私個人の日記と対外活動を中心に書いていこうと思います。

ちょっと待て、カテゴリーを消す前に

リニューアルにあたって、記事の分類を、タグのみにしました。昨今のレンタルブログはカテゴリーを廃したものが多いですし、ブログのような雑多な記事は複数のタームを持つタイプの分類の方が自分自身も後々探しやすいです。

a-blog cmsはエントリーからカテゴリーを外すのが簡単です。管理ページで全記事を選択して、一括修正のプルダウンで「カテゴリー>なし」を選ぶだけです。

300件から、えいやっとカテゴリーを剥がしたところで、あることに気づきました。

a-blog cmsは、エントリーURLにカテゴリー名が含まれるということに。

例えば、このブログ内で歴代最高の人気記事となっている「GitHubとBitbucketの比較:Webデザイナーの業務にはBitbucketが向いている」だと、

https://webbingstudio.com/weblog/internet/entry-651.html

https://webbingstudio.com/weblog/entry-651.html
になり、すべての被リンクが切れてしまうということです。

心の中で「ああああああああああああああああああああああああああああああああああああああああああ」と叫びましたがもう遅いです。それに、ある程度手数やリスクをかけても、このタイミングでカテゴリーは廃止したい気持ちは変わりません。

加筆

アップルップルのかずみちさんから「.htaccessを書かなくてもいいんだよ」と、「entry_301_redirect」オプションのことを教えていただきました。これがオンになっていると、エントリーのファイル名に重複がなければ、カテゴリーを変更してもエントリーのリンクが切れません。

結局、以下のように.htaccessを書いてリダイレクトさせました。どう考えてももっと短い書き方があります。

# a-blog cms以外のコンテンツ(a-blog cmsを動作させないディレクトリ)
RewriteCond %{REQUEST_URI} !^/?weblog/life/
RewriteCond %{REQUEST_URI} !^/?weblog/work/
RewriteCond %{REQUEST_URI} !^/?weblog/cms/
RewriteCond %{REQUEST_URI} !^/?weblog/webdesign/
RewriteCond %{REQUEST_URI} !^/?weblog/others/
RewriteCond %{REQUEST_URI} !^/?weblog/internet/
RewriteCond %{REQUEST_URI} !^/?weblog/study/
RewriteCond %{REQUEST_URI} !^/?weblog/think/

・・・

# ブログカテゴリー廃止
RewriteCond %{REQUEST_URI} ^/?weblog/life/
RewriteRule ^/?weblog/life/(.*)$ https://%{HTTP_HOST}/weblog/$1 [R=301,NE,L]

RewriteCond %{REQUEST_URI} ^/?weblog/work/
RewriteRule ^/?weblog/work/(.*)$ https://%{HTTP_HOST}/weblog/$1 [R=301,NE,L]

RewriteCond %{REQUEST_URI} ^/?weblog/cms/
RewriteRule ^/?weblog/cms/(.*)$ https://%{HTTP_HOST}/weblog/$1 [R=301,NE,L]

RewriteCond %{REQUEST_URI} ^/?weblog/webdesign/
RewriteRule ^/?weblog/webdesign/(.*)$ https://%{HTTP_HOST}/weblog/$1 [R=301,NE,L]

RewriteCond %{REQUEST_URI} ^/?weblog/others/
RewriteRule ^/?weblog/others/(.*)$ https://%{HTTP_HOST}/weblog/$1 [R=301,NE,L]

RewriteCond %{REQUEST_URI} ^/?weblog/internet/
RewriteRule ^/?weblog/internet/(.*)$ https://%{HTTP_HOST}/weblog/$1 [R=301,NE,L]

RewriteCond %{REQUEST_URI} ^/?weblog/study/
RewriteRule ^/?weblog/study/(.*)$ https://%{HTTP_HOST}/weblog/$1 [R=301,NE,L]

RewriteCond %{REQUEST_URI} ^/?weblog/think/
RewriteRule ^/?weblog/think/(.*)$ https://%{HTTP_HOST}/weblog/$1 [R=301,NE,L]

私らしいフォント

CSSフレームワークが完成したので、屋号サイトも、シンプルでコンテンツ押しのデザインへのリニューアルを考えているところです。

ブログの外観は公式テーマのままですが、全体のフォントを新しいサイトで使用予定のフォントにしました。
中見出し、本文は「FOT-セザンヌ ProN M」、大見出しは「FOT-ロダンカトレア Pro DB」を採用しています。

https://webfont.fontplus.jp/font-list/cezannepron-m



セザンヌは東京駅でも採用されている比較的ありふれたゴシック体ですが、ヒラギノよりも文字幅が細く、文字の書き始めに強い力が入った跡があります。
背筋を伸ばし、凛と声を張って話す、年配の女性を連想させます。
それは私がなりたい姿で、このサイトに合っている文字かなと考えて選びました。


そんなこんなで、またブログの記事が長くなってしまうのでこの辺で。
書きたいことは浮かんでいるのだから、タイトルだけ付けた下書き記事を作っておくといいのかも。


投稿者名 うぇびん(管) 投稿日時 2018年11月01日 | Permalink

美しいゲーミングキーボード「Razer BlackWidow」を仕事に導入して三ヶ月経ちました


私たちの仕事の機材で、最もピンキリとなるのがキーボードです。安い品でもコーディングはできるので、後回しになりがちです。

自宅では、MacBook Proを「クラムシェルモード」で使っています。これまではApple純正のUSBキーボードを使っていましたが、三ヶ月前にPCを自作したときに、思い切ってメカニカルキーボードを購入することにしました。

Happy Hacking KeyboardREALFORCEも検討しましたが、最終的に購入したのは業務用ではなく、ゲーム用の「Razer BlackWidow X Tournament Edition Chroma」でした。名前が長いです。

Razer BlackWidow X Tournament Edition Chroma テンキーレスゲーミングキーボード 英語配列版 【正規保証品】 RZ03-01770100-R3M1


Razerはゲーミングデバイスの有名メーカーのひとつです。高級なゲーミングデバイスはeスポーツの激しい操作にも耐えられる堅牢さとキー反応速度を持っているので、コーディングにも役立ちます。

これを購入した理由、三ヶ月使ってみての感想などをまとめます。


投稿者名 うぇびん 投稿日時 2017年07月09日 | Permalink

CMSの構築を考慮したコーディングとかクラスの命名規則の話


先日、CSSフレームワークについて記事を書いてから、今後のコーディング設計について具体的に考えています。

【Webdesign】Atomic Designの思想で、文系でもわかるCSSフレームワークを作りたい | ウェビンブログ

というより、再利用性のある業務用テーマの制作をいくつか依頼されており、いずれにしても着手しなければならないのです。

私の主業務が、CMS(それも特定のブランドによらない)を組み込んだサイトの制作であることを前提に、自分はどう設計していったらよいか、考えていることを書いておきます。


投稿者名 うぇびん 投稿日時 2017年07月08日 | Permalink

Illustrator CC 2017から書き出したSVGは、GIMP 2.8.22で正しく表示できない


表題の通りです。同じ状況になる人がいずれ出てくるかもしれないので共有します。

結論から書きますが、これはGIMP側の仕様で、ブラウザでの表示においては問題ありません。
どうもGIMPは、SVG関連の対応は読み込み・書き出しともに遅れているようです。

Android Studioでも色情報が引き継がれない問題が報告されています。

Sketchたまご: Illustratorから書き出したsvgをAndroid StudioにImportすると色情報が反映されないことの解決法


投稿者名 うぇびん 投稿日時 2017年07月04日 | Permalink

Atomic Designの思想でCSSフレームワークを作るのは難しいので代替案を考える


一昨日、「FLOCSSがわかりにくい」「Atomic Designの思想でフレームワークを作ってみたい」という記事を書いたところ、とてもたくさんの感想をいただきました。

【Webdesign】Atomic Designの思想で、文系でもわかるCSSフレームワークを作りたい | ウェビンブログ

大半がフロントエンドエンジニアからの突っ込みです。著名な方々にもたくさん意見をいただいただのでまとめました。ありがとうございます。

「Atomic Designの思想で、文系でもわかるCSSフレームワークを作りたい」に識者たちの鋭すぎる突っ込みが入る - Togetterまとめ

Atomic DesignがCSS設計に適していない理由

ピクセルグリッドの高津戸さんによると、そもそもAtomic DesignはCSSやJSの設計とは全く関係ないそうですが、よく考えてみると、たしかに厳密な階層構造を持っているAtomic Designの設計は、デザインレベルからの意思統一が可能な環境でなければ破綻してしまいます。

私はデザインを外部に発注することが多いですし、CMSベースで構築すると、どうしてもマークアップやクラスの命名に手を出せない箇所が出てきます(※)。

そんなこんなで、Atomic Designを採用することは諦めて、既存のCSS設計を、専門のマークアップエンジニアではなくても理解しやすくする方向で考え直すことにしました。


投稿者名 うぇびん 投稿日時 2017年06月16日 | Permalink