2017年7月 8日 (土)

改行できないのでココログだけIE……。

 先に言っておこう。
結論。ココログの記事アップはIEからする事にした(笑)

 かなりイラッと来る不具合である!
しかもずい分前からの不具合である!

 再三このブログでも書いているが、も一回。
アバター何ぞで庭作って遊んでいる場合じゃないだろう?!
 
 今やIEよりChromeの方が利用者多いんじゃないの?今後Windows10が主流になれば、皆edgeになるんじゃないの?
なのに対応してないのはどういう事だ!

 改行出来ん!!
 広場にも久しぶりに行ってみた。相当前からあれやこれやと対策が回答されている。edgeの対策まであるではないかー!
 
 にもかかわらず、未だに改行出来ん!
「HTMLの編集」画面にしてみたが、改行のタグが無い。っていうか、余計なdivタグがEnterをたたく度に追加されていく…。やけくそになって5回も連打し、「HTMLの編集」を見ると、divタグが繁殖していた!

 が、リッチテキストに戻ると改行が無くなる仕組みだ。
そんな仕組みは要らんのだが。

 手動で改行タグを入れても無駄だった!
仮に出来ても面倒くさい!

 しかしこんなに「!」マークの多い記事も珍しいなぁ。

 どうやらテキストエディタで下書きして貼り付けるのがいけないらしいのだが、みんなローカルで下書きして、文章直したりしていないのだろうか?スマホから投稿する時もメモ帳みたいなアプリに書いてないのだろうか?ずっとネットに繋ぎっぱなしなのか?
 
 確かに直接新規作成画面で書き込んでみると、改行タグや段落のタグが生成できている……なぜか一行目が空くけどね。う~ん、Chrome側でどうにか出来んものかね。
 はっさくはスマホもPCもChromeを使っていたので、アバターのメンテナンス告知を見るにつけ、かなりのイライラ度であった。
 
 もう、edgeも普及してきているのに。一体いつになったらココログはこの案件に着手するのだろう。どこかの電気屋さんに売却後になるのだろうか。
 
 はっさくのお勧めはココログだけIEで開く……それが一番楽だった。今まで通りテキストをコピペできるしね。あまり参考にならない記事だったな。
 でも書かずにはいられない不具合であった。
最近のココログユーザーさんは、サポートに「どうなってんの!?」とあまり騒ぎ立てたりしないのだろうな~。

 呑気すぎる!

| | コメント (0) | トラックバック (0)

2017年6月 2日 (金)

グラデーションを簡単にしてくれるツール

 最近は便利なツールが増えて、面倒くさがりのはっさくには嬉しい限りである。
 これも資料にしている書籍に掲載されているのを見つけ、半信半疑で使ってみたツール。
 このブログでも、タイトルバナー下のナビゲーションとサイドバーの項目タイトルに使用したグラデーションはお助け頂いた。
 
 ↑こちらは一番広く知られているサイト。
 ただし、はっさくのボロいWindows7のIEでは、動作が上手くいかなかった。現在はChromeを使用しているものの、やはり上手くいかなかった。多分ブラウザの設定であろうと想像はつくのだが、探っていない。
  じゃあ載せるなよと言われそうだが、Macとか、Firefoxでは未確認なので一応載せておこうと思う。
 
 
 ↑こちらは国産のサイト。
はっさくは現在こちらを使わせて頂いている。
 好きな色に設定して、あとはCSSに貼り付けるだけ!なんとも便利なツールだ。
  時々ここでも書いているが、あくまでもPCで閲覧する際のお楽しみである。スマホの閲覧でも楽しみたい場合はココログプロに登録が必要なので、悪しからず。

| | コメント (0) | トラックバック (0)

2017年5月19日 (金)

カスタマイズをする前に!

 カスタマイズをする時のチョットした小技。
 久しぶりにテンプレートをいじった時に気がついたので、少し書き残しておかないと、日頃意識していないので忘れそうだ。
 
 タイトル通りデフォルトを作っておく。まんまじゃん!
 
 つまり全体のサイズや文字の種類などはそのままに、タイトルバナーを季節毎に替えてみたり、個別記事の雰囲気を替えてみたりしたい場合に便利なのが、デフォルトのテンプレートを自作しておく事である。
 形を整えてから、枠線を入れておき、場所ごとに色分けしておくと、何処から何処までがバナーの場所かも、サイドバーとメインの隙間も分かりやすい。はっさくはバナー下のナビゲーションを微調整する際に、この手を良く使う。
 1.まず、デザイン→新規テンプレート作成の順に画面を開く。
   ↓
 2.レイアウトを選ぶ。
   (とりあえず、はっさくは両サイドバーを選択)
   ↓
 3.表示項目、並べ方を順に選ぶ。
   ↓
 4.テーマはカスタム・テーマを選ぶ。
  ラジオボタンをクリックすると、各項目の設定が出来るようになる。
  この時点で確認してみると、こんな感じになっている。

Photo_6

  これが、初期状態である。
 5.最初に全体の横幅や、サイドバーの横幅を決める。
  はっさくは、両サイドバーを300pxずつにした。(本文は500px)
  これは、実際に表示できる範囲は300pxよりも小さいから。
  アフィリエイトの画像を載せようと思うなら、なるべく大きい方が良いので、この位は欲
  しい。
   2カラムのテンプレートにすれば、もっと広くなるので貼り付ける画像も大きく出来る。
  大きさだけ決めると↓こんな感じに。
  まだ、タイトルバナー部分がオレンジ色だったり、サイドの項目タイトルが枠で囲まれていたりしている。

Photo_7

  これを全て取っ払ってからデザインを考えるのも手である。
  (取っ払って、文字も見やすく大きめにしてみた↓)

Photo_8

 6.格パーツに色を付け、枠線も分かりやすくつけておく。
  CSSをいじる際、変にズレたり段落ちしたりすると、本文の幅がおかしいのか、サイドバーの幅を直せばいいのか、分からなくなる。
  そんなときの為に各々に色付けしておくと便利!

Photo_9

 7.確認して保存したら、テンプレート管理の所の名前を、分かりやすい任意のモノにし
  ておく。
 以上が、自作テンプレートの下ごしらえである。
 季節毎に、そろそろ替えたいなーと思ったら、これを複製して作れば最初の手間が省けると思う。
 
 ここまで説明しておいて今更だが、ココログではテンプレートの自作カスタマイズはPC版がメインである。スマホも同じデザインにしたいと思えば、「ココログ・プロ」へ変更して月額千円が必要になる。
 ベーシックやプラス、フリー等のユーザーはスマホでのデザインは同一のものだ。現在これをもう少しどうにかならんモノかと思案中である。
 
 いっそ、1カラムにしてみるのも手かなぁ。

| | コメント (0) | トラックバック (0)

2016年7月 3日 (日)

RGBとCMYKの色補正

  ディスプレイと印刷物の色。
簡単に言うと、両者では使える色数が違うよ、というお話。

  難しい数字の話しは、ネット検索に任せるとして、ここではあくまではっさくの体感的な感想で進めます(いつも通りに)。

  もともと写真画像の編集作業を仕事にしていたので、ほんの少し一般の人より色の差違が分かってしまう。

  家電量販店にTVのモニターが並んでいると、各社の違いがわかる程度には知っている。

  ◆PCやTVなどのモニターはRGB
R(赤)、G(緑)、B(青) で表現。

  ◆印刷物はCMYK
C(シアン)、M(マゼンタ)、Y(イエロー)、K(黒) で表現。
    ちなみにKはKUROではなく、keyplate。

  今は変換ツールがフリーでもあるらしいから、それを使っているという人もいるかもしれない。フォトショにもあるし。ただしRGB→CMYKに変換したら、元には戻せないとおもったけど。その辺は割愛。

   では、どんな風に違うのかというと、PCのディスプレイで見えていた画像をプリントアウトすると、発色が悪く感じる、或いは濁って見える、なんか暗い、と感じたことはないだろうか。

  PC上で使っている色を、プリンターのインクでカバーしきれないので、こうなる。まして家庭用のプリンターなら尚更である。
  特に透明感のある色、例えば蛍光ペンのような色は出にくい。
  もっと言えば、AdobeRGBとsRGBでも違うが、難しくなるので、ここも割愛。

  以前、広告代理店にいた子に「自分の出したい色にするにはどうしてる?」と尋ねたら「印刷所の職人さんの腕ですね」と言っていた。余談だが。

  はっさくが個人的に曲者と思うのはマゼンタである。モニターだとギャルの好きそうな濃いピンクで、発色の強い色だが、プリントするとうっすらグレーが乗って濁ってしまう。
  正直、仕事でマゼンタを引く事はあっても、足す事はまれであった。

 ここで表現するのは難しいが(どの道モニターだし…)

 PC上でこんな感じにしたかったのに→ ■■■
 
印刷してみたらこんな感じに…… →  ■■■

 どうだろう?!近いと思うけど。
 デバイス毎に若干の違いはあると思うが、大体このくらいの差はあるという事。


  特に日本人は黄色人種なので、日に焼けた子供など、茶色くなった肌ににマゼンタなんて最悪だ。イエローだって足しすぎると濁るよ。
  あと、入学式ジーンズに見かけるお母さんの着物で多い若草色。これも肉眼で見た色に近づけるは難しい。

  女性なら、化粧する時ベースメイクやコンシーラーで、イエロー系やオレンジを使うのをご存じだろう。それと同じ感覚である。

  ちょっと赤みが欲しいなと思ったら、マゼンタ足すよりシアンとイエローを少しづつ引く方をお勧めするなぁ。理屈で言えば同じじゃん、と思うだろうが実際肉眼で見ると若干違って見えるのだ。
  昔のネガの時代は色を重ねて作っていたそうたが、デジタル時代の今は、引き算を考えて補正しないといけない。

  但し、顔ばかり見ていると全体がおかしな事になる事も!そんな時はっさくは「白いところ」をチェックする。白いシャツ、白い皿、白い紙などが青かったりピンクがかっていたら、なるべく白に近づける工夫も必要になってくる。

  カメラの性能にもよるが、仕事で色補正をする人は、この事を踏まえて色を調整している。

  自宅で写真をプリントアウトする時は、その辺を念頭に置いて補正をしてみると良いと思う。 試しにスマホの画像をアプリで補正をしてみると分かりやすいかも知れない。

  モニターの場合でも、折角作った料理をブログに載せる時などは、少しB(青み)を引いてみるといいかも。頑張って作った力作を、蛍光灯の下で撮影したら、青っぽくなってしまった、なんて時は画像編集アプリのトーンカーブで、ほんの少し青みを引いてみる。暖かみのある色の方が美味しそうに見えるだろう。

  あ!余談だが、傘を買う時に内側がサーモンピンクのだったりするといい。

| | コメント (0) | トラックバック (0)

2016年4月11日 (月)

ココログのスマホ対応は?

 ココログのスマホ対応は、どうなっているのだろう?
 自分のブログをスマホで見ると、なんだかいただけない事になっている。
 タイトルバナーは無いし、その昔貼り付けていた画像が、とんでもないサイズで表示され、意図しない場所にあったりする……。う~ん。
 仕方がないから、ちまちま削除しているのだが面倒臭い!

 他社ではPC用のタイトルバナーを、スマホ用にも併用できる所もあるというのに。
 つまりレシポンシブルWEBデザインのテンプレートというものだ。

 ココログでレシポンシブルWEBデザインにしようと思ったら、HTMLをいじれる有料プラン(ココログプロ等)にせねばならないらしい。

 全部いじれなくても良いのに。
せめて、タイトルバナーだけでも各々のバナーに出来れば、オリジナル感は出せる。
 今は無料とプラスの人は、皆ココログの無味乾燥なヘッダーになっているではないか。

 広告も、なぁ。
記事タイトルと内容の間にあるのは、どうなんだろう?
あまり記事タイトルと内容を離さないで貰いたいのだが。

 それと以前から疑問に感じていたけど、アバターとか庭を作るとか、そんなに需要があるのだろうか?

 ココログって、それがメイン?

 だいぶ力を入れているようだが「そんな事よりスマホ用のテンプレートどうにかなんないかね~」と考えてしまうのは私だけだろうか?

| | コメント (0) | トラックバック (0)

2011年4月16日 (土)

テンプレートに悪戦苦闘…

 前回話題にした、吉田龍史氏のショッピング・カートが
どうにか落ち着いてきた

 他社のブログサイトでのテンプレート作成だったので、ココログとかなり勝手が違って苦労した。

 「どうして各社ごとにタグの言い方が(?)違うのよぉ~」
と、ブチブチ言いながらHTMLの本と格闘し、おかげで眉間にできたシワが、もう元には戻らない…。

 しかもHTMLって、ちょっと油断すると“XHTML”だの“HTML5”だのドンドン私の先を行くのだ!

 待って、お願いだから…

 確かに、早くブラウザごとのズレを無くしてほしいとは思うが、はっさくはもうお手上げである。

 どうにかこうにか作ったテンプレートは、出来上がってみればこのブログよりも気合の入った作品になっているような気がするが、まぁいいか。

 どこか変なところに気づいたら、コメントで知らせてくれるとうれしい。

ピックアップ

XHTML+CSS 100の疑問に答えます。 XHTML+CSS 100の疑問に答えます。
外間 かおり

XHTML/HTML+CSSスーパーレシピブック 効率的なサイト制作のためのDreamweaverの教科書 HTML&スタイルシート レイアウトブック 3rd Edition よくわかるPHPの教科書 HTML&スタイルシート トレーニングブック CSS3増補版

by G-Tools

| | コメント (2) | トラックバック (0)

2008年6月28日 (土)

久しぶりの更新っ!

 更新しないと削除される!?
久しぶり(遅過ぎっ)にtakoさんの「初めてのココログ・カスタマイズ」を拝見してビックリした。
(なんで人のブログを観ないと気付かない?!)

 ココログフリーでは一年間更新しないと、ブログが削除される事になったらしい…。

 偶然発見しなかったら(失礼…)削除されていたかもしれない程、何ヶ月も放置していた。危ない、危ない!

 そもそも、テンプレートが崩れ(未だ改善されずに)ついでにディスプレーもいかれて、どこから手をつけていいやら分からずにどんどんモチベーションが下がっていったのが、放置の原因なのだが。
 最近になってやっとノートPCを購入して、さて再開と意気込んでみたら、驚愕!
 IEなのにテンプレートが(メニューバーの部分が)
崩れているではないかぁぁ!

 私のデスクトップPCはIE6、ノートPCはIE7。
 調べてみたらIE7では、それ以前のバージョンでのバグを修正していたからだった。
 やっと、修正してホッとした所でFirefoxをインストールしてみた。
 ああ…、また。
 Firefoxに至ってはメニューバーの画像はおろか、
文字も縦に並んでサイドバーに食い込んでいたのだ。

 要するにIEがそうとう大雑把に出来ているらしい。
だからアバウトなCSSの記述でも「大体こんなもんだろう」と表示してくれていた。

 しかし、Firefoxや他のブラウザでは几帳面に順序正しく記述しないと、受け付けてはくれないのである。

 例えば、floatプロパティを私は画像のアドレスより前に記述していた…。(今思えば、すごくテキトウ…)それを最後に持って来たら画像が表示されて、横並びにもなった。
 つまり {  と、 } の間ならどこでも良いわけではなく、色の指定や、背景画像の指定や、positionプロパティの指定は順序良く並べないと受け付けてはくれない仕組みになっているのである。

 これが本来の姿であって「いいよ~、どこでも」なIEがチャランポランなのだ!

 WEBデザインの会社に勤務する友人に訊けば、FirefoxやOpera等のブラウザで動作確認するのが基本だそうだ。そうしておいて、IEで崩れないようにIE用の修正ソース(ハックというらしい)を記述するという。

 それでも、主要シェアはIEなのでIEでちゃんと観えないと困る。IE6とIE7でも違ってしまうので、記述を直す度にFirefoxで見てIE7で見てIE6でも確認する、という作業が面倒くさくてならない。

 とりあえず、最新バージョンのIE7ではIE6よりバグを修正しているらしいので、みんなが自動更新でIE7にバージョンアップしてくれたら、いずれIE6でチェックしなくてすむ日が来るだろう、と自分を慰めてみた。

 私としてはこういうサイドメニュー的な問題は早いこと解決して、このブログで「こんなことやりたい」「あんなこと書きたい」と思いついた事に、一日も早く着手出来るよう(…その前に削除されないように)コツコツと地味~に続けていきたい。出来るのかっ!?

| | コメント (0) | トラックバック (0)

2007年8月19日 (日)

ココログから返事が来た

長い事ほったらかしていた、本文の罫線の不具合についてココログサポートから次のようなメールが届いていた。

 平素はココログをご利用いただきありがとうございます。
 ココログサポート窓口 田村です。

 はじめに、対応までにお時間を要し、回答まで大変お待たせしたことをお詫び申し上げます。

 お問い合わせいただいた件について回答いたします。

 ご連絡いただいたココログのレイアウトが崩れる症状については、弊社で確認のうえ、 7月31日に実施したココログのメンテナンスにより修正を行なわせていただきました。

 はっさく様の環境からでは現在状況はいかがでしょうか。もし、現在も症状が発生している場合、症状の詳細についてご記入のうえ、お知らせくださいますようお願いします。

 現在私のパソコンが不調な為に、あまりパソコンの前に座る機会が無かったので、つい見逃していたのだが、前回のメンテナンスの際にちゃっかり修正していたらしい。

 この件で最初にココログにメールをしたのは…4月で、かれこれ4ヶ月 も経っているが、いつかは必ずや連絡がくるだろうと思っていたので、比較的のんびりと構えていた。

 ココログとのやりとりは以下に記述しておくが、かなりはっさく流に要約しているので、細かい言葉尻に引っかからないように。
 まぁ、大体こんな感じのやりとりがあったのである。

[はっさく] 本文の罫線が消えてしまう、と問い合わせ。
[サポート・五戸] カスタマイズしているテンプレートのサポートは致しかねるとの回答。

[はっさく] CSS編集画面ではなく、テーマの変更から設定したが、罫線が正常に表示されない、と問い合わせ。
[サポート・五戸] 当窓口で確認したが正常。カスタマイズされていないカスタム・テンプレートでご確認ください、との回答。

[はっさく] 指示に従いデフォルトのカスタム・テンプレートで試してみたが、やはり同じ不具合発生中。IE6とSleipnirで確認。
[サポート・川村] FirefoxとOperaでは正常、IE6とSleipnirで不具合を確認。cssの記述が影響を及ぼしている可能性もあるので確認を、との回答。

[はっさく] だからっ、デフォルトの(つまりcssの記述のないテンプレート)でもダメなんだってば!…例えば、マイリストは関係ある?という内容を丁寧な言葉に変換して、問い合わせ。(←この辺から切れ掛かっている)
[サポート・川村] マイリストが原因である可能性も考えられるので、原因をつきとめる為にマイリストを1つずつ非表示にして確認を、との回答。

[はっさく] やっぱりダメみたい…の報告。
[サポート・大金] 確認しますのでしばらく時間ください、との回答。

[はっさく] どの記事だとテンプレートが崩れるか各カテゴリーごとに確認して、ココログに報告。
[サポート・佐々木] 引き続き確認作業中です。しばらくお待ちください。

[はっさく] 閲覧者の方から、カスタムcss編集でコメント欄の横幅を狭めると改善されるとの情報をいただきココログへ報告。ただし当ブログでは、これはココログ側で初期設定を直すべきと考え現状のテンプレートを維持。
[サポート・岡] 情報有難うございます。参考の上継続して確認させていただきます。結果が出るまでお待ちください。

………と、この5月6日の回答を最後に連絡が途絶えた。

 そして8月6日に、やっと上記のようなメールが着たのである。
ココログの「しばらく」は、“数ヶ月”であると心得よう、という教訓記事になってしまったけど、 少なくとも私のパソコンが原因ではないと分かったし、サーバー側のミスも直った事だし、まぁ一件落着って事で手打ちにしよう。

 以前にも別件で約二ヶ月後に回答が着いた経験があり、遅くはなるけど必ず何かしらの回答をくれるだろうと、半ば強引な自信と信頼を寄せていたので、「あぁ、一見忘れているようで、やっぱり憶えていてくれたのね」と、最近音信不通になっていた友達から久々にメールが来たような感じ。

という訳で、私より先に気付いた人もいるだろうが、本文の横幅を500pxに設定していて、罫線で囲んで右側の線が消えていた人、もう直っている筈である。 かりに、CSS編集の記述で応急処置していたなら、その記述は削除して大丈夫。

めでたし、めでたし!

【200.08.19 追記】

 「カスタマイズ」のカテゴリーだけ、
まだ不具合が残っているではないかっ!!
はぁ~。

| | コメント (7) | トラックバック (0)

2007年6月23日 (土)

本文右側がはみ出す不具合を
カスタムCSS編集で直す

  以前から記事本文右側の罫線が消える不具合(つまりはみだしてしまうんだけど)を、ココログへ問い合わせていたものの、明確な回答の無いまま一ヶ月がたってしまった…。

  忘れているんだか、面倒くさいので避けてるんだか、直せないんだか知らないが、連絡がない。

  この不具合、ユーザー側がちょっとCSS編集に記述すれば解決出来るのは、わかっているのだけど、「本文を500pxにして罫線で囲む場合は、自分で直して下さい」って仕様は、どうなんだろう?!と思っている。

 ので、是非デフォルトで調整してもらいたく、未だ現状を維持しているのだが、いくら呑気な私でもそろそろ限界が近づいて来ている。

  私だけならともかく、他のユーザーの方でも同じ不具合が発生しているらしい。
 そういう方でサッサと直してしまいたいという場合は、CSS編集画面に以下の記述を追加すると改善されるので、参考にしてとっとと直してしまおう!

textarea#comment-text { width :450px; }

 (450pxはこの位なら大丈夫、という数値なので変更が可能) 

ちなみに、本文が400px(推奨)のテンプレートなら大丈夫なようだ。

| | コメント (2) | トラックバック (0)

2007年4月28日 (土)

カンタンな壁紙背景を作った

  調子に乗って、シンプルな壁紙を作ってみた。
  これなら絵心は無くても、誰にでも出来るじゃないか、と思ったので画像編集ソフトで(ペイントでも可能)作る時のコツを紹介!

  画像は小さければ小さい程、軽くなっていいのだが、作業中は拡大して作るので、あまり小さいのも見づらいので、今回は「32pxの大きさに、4pxの正方形のドット」という画像を作る。(作業中は拡大して)

  1. 32pxの新規画面を作成したら、すきな色にペイントツールで塗り潰す。(大抵のソフトではバケツのアイコン)
  2. 新規レイヤーを1の上に置き、四角い選択ツールで4pxの正方形を作り、選択範囲内を好きな色で塗り潰す。
     このレイヤーの複製をもう一つ作っておく。
  3. 4pxの2つのレイヤーを下の図の場所に置く。
     ※ 下図では分かり易くするために、4px単位で補助の線をいれているが、これは説明用。

     4pxの正方形を動かしたりす刷るので、定規やメモリを表示出来た方が作業がスムーズである。
     どんな大きさでも、1つのドットの倍数で画像の大きさを決めれば、うまくいく。 
  4.  3つのレイヤーを統合して(レイヤー機能のないソフトではそのまま)、拡張子をgifかjpegで保存する。
  5. 作品が出来たら、サーバーにアップローでして、ココログなら
    「コントロールパネル」⇒「ファイル」⇒新規ファイルをアップロードする。
     画像のURLアドレスを控えておく。(コピー&ペーストでよし)
  6. カスタムCSS編集のボックス内に、次の記述をする。

    body {
    background-image:url(ココに画像のURLアドレス);
    background-position: top left; }

  7. 「変更を保存」して「反映」したら、ブログを表示して確認してみて!

 以下に調子に乗りついでに、いくつか壁紙を作ってみたので、
良かったら使ってくだされ。

注)ただし商用/直リンクは不可です。   見本はこちらから

                     
     
                  
        (見づらいけど、二段目は丸い水玉の模様)

| | コメント (0) | トラックバック (0)