ブログ技術
はてなブログのテーマストアにはサイドフレームを左側に配置したテーマがありません。なんでだろうと以前から思ってまして、試しに自分のブログでトライしてみました。 やってみて初めて発覚したというか大問題があります。 PCで見た場合は問題なく表示され…
ほとんどのアクセスがスマホからで、年々、コンテンツも大容量化しているで、おそらく将来、オフスクーンの延滞読み込みの需要が高まるのでないかと思っております。 対応策として、オフスクリーン画像の延滞読み込み処理が効果的 ほとんどのアクセスがスマ…
久しぶりに見に行ったら１００インストール超えてまして感動しました！お使い頂いて、ありががとうございます。また製作意欲が湧いて来ました。第三弾を作ってみたいと思います。 blog.hatena.ne.jp こちらが拡張機能使った、サンプルページです。 はてなブ…
ブログ表示速度のオーバーヘッドをデザイン面から見直し ＡＭＰの手法も取り入れ、徹底的にアカン部分を詰めた結果 パフォーマンス９５、ほぼ極限までネックとなってる部分を詰めました。 早い回線を使いオーバーロードさせ、スマホCPUでも1.4sでページロー…
はてなブログで、オフスクリーン画像の延滞読み込み（lazy loads）を使うには 「Lozad.js」という延滞読み込みを使用してみました。 方法はある！簡単にいこう！ぶっこめばいい！ そして最大の関門を突破する！ これをデザインのフッタへセットする。なるべ…
縦長画像を貼ると下へ画像が超～間延びします。 この弱点の解消として、画像ファイルの高さをブラウザの高さ（７０％ほど）に自動フィットさせる。縦長画像特有の横に発生する未使用のスペースに、つまりココに文書を縦書きで書いたらいいんじゃね！そしたら…
見難い記事タイトルのパターン 例えばこれ、CSSのword-break: keep-allが設定されていないテーマだと、こうなります。 見やすくなったよ！Good Job！！ word-break: keep-allを設定すると日本語の単語を理解してくれ「こう折り返したら見やすいんじゃね！」…
例えば以下はブログ本文中のコンテンツフレーム内とします。 はてなブログの文章はｐタグで囲まれてます。 ｐタグのＣＳＳ設定でボトムにマージンが設定されていまして、１センテンスが終わると自動的に空行が入る仕掛けです。これで文章の分かれ目を見易く…
はてなテーマ「FlexPhograph」をバージョンアップして、２カラムタイプにしてみました。写真系ブログは明朝が映えるのではないかの発想です。 はてなブログテーマ「The.明朝」 ●２カラム、レスポンシブデザイン（スマホは１カラムになります） ●すべて明朝で…
これは現在、作成中のテーマ「The.明朝」のテスト記事です。 記事タイトルをEVA風にする機能を実装してみました。 記事単体で表示した時だけ作動します。 しくみは、ブログ本文中に隠しタイトル文字を入れておいて、ｃｓｓスタイル「EVATIT」を指定します。…
ずべて明朝で表示するブログテーマを作成しています。 ほぼ完成しました。このブログを人柱にしてテスト中です。 ２フレームタイプに挑戦してみました。 PCだのタブレットだのスマホだの何その変なスマホとか含めて、ありとあらゆるデバイスで、うまく表示で…
本日、クロームが突然、起動しなくなりました。 ちっらとウィンドウ枠が表示されるも、消えてしまいます。 タスクマネージャーで確認すると、クロームのプロセスは存在してて、うまく起動されていないようです。起動させるたびに、プロセスが増えており、だ…
こちらがテーマを使用したブログです。 kobe.hatenadiary.com １フレームブログデザインの拘りについて １フレームブログテーマにおけるサイドバーコンテンツの並び問題というのがありまして、それを解決したブログテーマです。 僕は１フレームブログデザイ…
リリースしました！ Flex PhotoGraph - テーマ ストア Flex PhotoGraph サムネイルをメインしたカード型の記事一覧表示を行う写真系のブログ向けテーマです。 どんな写真が掲載されているのか、ひと目で解る一覧をデザインしてみました。 mac safari8 2560*1…
はてなブログテーマを作成しました。 tommyoctopas.hatenablog.com 設定でトップページの表示形式を一覧形式に設定している人向けの限定記事です。 なので、はてなブログpro限定の記事となります。 現在、使用しているテーマのまま、記事一覧を大きなサムネ…
設定でトップページの表示形式を一覧形式に設定している人向けの限定記事です。 なので、はてなブログpro限定の記事となります。 この記事は、次にステップアップしております。こちらをご覧下さい。 トップページの記事一覧を超簡単に２カラムに出来ます。 …
はてなブログで画像を横並びで表示できないと諦めてる人いませんか？ 簡単にできますよ！ 記事コンテンツ幅内で自動的に縮小して、２つの画像を簡単に横並びにする方法です。 応用編 スマフォでは、どうか display: flexのCSS、flexboxを積極的に利用したい …
スマフォではスクロール操作による読み手側のストレス低減が必要かと思われます。 ゴリゴリ大量にCSSを叩き込んで改善するのでなく、気になった部分だけを、ピンポイントで最小のCSSで少し改善する事にしました。 はてなブログのフマフォ向け表示が読み難い…
はてなブログは、ＳＳＬ暗号化通信(https)に対応していません。 現状のまま１０月に突入してしまうと これから起こるかもしれない問題を 技術的なことではなく 解りやすく何が問題なのか書いてみました。 Chromeによるセキュリティ警告表示の問題 この問題を…
親ブログの写真はサムネイル中心、オリジナルは固定ページで 親ブログで使用した写真素材を固定ページでギャラリー化して写真のみ掲載する。 これにより親ブログでは写真をサムネイル程度にし、文書スペースが確保し易くなる 親ブログは文書中心のスタイルと…