この日、一念発起し「どむや」のほぼ全ページをモバイル対応へと改修した。
実際にはサイト内の要素のサイズを、PCの解像度とスマホの解像度で切り替えるためのcssを実装したうえに、スマホで見た場合に不自然にならないようフォントサイズや要素のレイアウトを調整している。構想1日。作業時間は約5時間。
情報量が多く、スマホで読むには若干きついかな？と感じてしまうのはテキストサイトの宿命。とはいえ、最小限の変更で、PCサイトとスマホサイトを切り替えられるようになったのだから当初の目論見は達成された、と言っていいだろう。新年早々サイトの目標の一つが達成されたので、調子にのって次の目標である「サイトのデザイン変更を」―――と思いつつ沈思黙考、まずは構想を立てることから始めたい。
亭主はこれまでWebオーサリングソフトとしてAdobeのDreamweaver 4そして8を使ってきた。4は2000年、8は2005年発売。処理の重さは気になったものの、コードを意識することなくWebページが作成できる使い勝手の良さから、「どむや」のページは一貫してこれを用いてきた。
ところが、先日Windows 10を導入してからというもの、Dreamweaver 8の動作が不安定になり、ページ編集中に突然ソフトが終了するとう事象が頻発。仕方なく約15年ぶりにDreamweaverから別のソフトに乗り換える決意に至った。
「Webオーサリングツール」「無料」などでGoogle検索すればソフト紹介の記事はいくらでも見つかる。２～３のサイトで確認した限りでは、IBMのホームページビルダーを筆頭に、フリーのAptana Studio、おなじみGoogle Web Designer、国産のez-HTMLあたりが有名どころらしい。ただし、ソフト紹介の記事の日付が中途半端に古く、紹介されたソフトのなかには長らくアップデートが止まっているものもあって、どれが良いかの判断にまでは至らなかった。特に、表示イメージで編集が可能な高度なUIを持ったフリーソフトはなかなか見つからず、市場におけるDreamweaverの強さを改めて実感した。
以前の亭主ならば、仕方ない、Dreamweaverの最新版（月払いライセンス）を買ってしまおうと思ったのだろうが、ここのところの亭主は一味ちがう。GitHubからフリーのHTMLエディタAtomをダウンロードしたのだ。
AtomはコードベースのHTMLエディタで、WYSIWYGでの編集は不可。一方でエディタのデザインや配色はわりと好みに近く、継続的にバージョンアップがなされているのも安心できる。長文の入力・推敲には向いていないようで、とりあえず愛用している秀丸にテキストを打ち込み、秀丸のマクロでダブルクオートやアンパサンドを"quot"や"amp"に変換したのち、Atomに貼り付けることにした。これまでDreamweaver一つで完結していた作業がAtomと秀丸に分かれ、さらに秀丸のマクロでテキストを成形するなど余分な手間はかかるが、これまでが便利すぎたと割り切ることにした。
それにしてもネットには無料であらゆるものが提供されている。HTMLエディタもだが、HTML成形用のマクロなども当たり前に存在する。ここ10年くらいで、コーディングの手間は圧倒的に軽減された。マクロからDeeplearningまで、あらゆるツールがコーディングなしに利用できるのが今日の状況なのだ。
マクロによるテキストの成形も、一度慣れてしまえば大したことはない。
Windows 10導入を機に、あえて新しい環境へと身を投じてみるのも気分が変わって良いものだと、今は前向きに考えている。
本日PCに向かうこと約２時間。
「読」のコーナーのスタイルシート化が完了しました。
うーん、なんか地味だなあ。華もなければ花瓶もない。なんともそっけないページになってしまいました。
個人的にはごてごてと飾り立てるより、シンプルで機能性を重視したページを目指しているので、現在のレイアウトでも不満はありません。
ビジュアルよりも、テキストの分量、盛りの多さで勝負しています。
--
今週は泥沼を行くかのような一週間。やっとのことで金曜日までこぎつけました。
個人的には仕事がキツイことよりも、繁盛記のネタが全然出せなかったのが正直厳しいですね。RPGで例えていうなら、HPはまだまだあるものの、肝心のMPが全然ない状態。これでは気の利いたことなどかけるはずもありません。
うー、早く宿屋でMP回復したい。早くこいこい金曜の夜。
過去に作成した「どむや」のページを全てスタイルシート対応にしようとして、くじけました。
エディタでページを全て開いておき、「検索→置換」でタグを一気呵成に変更しようとしたのですが、DreamWeaverの旧バージョンで作成したコードの余りの汚さに、検索漏れが大発生・・・とくに、FONTタグ内のプロパティの統一のなさは、ひどいを通り越して精神的苦痛の領域です。
しかたない・・・１ページづつ手作業でやっか・・・(-_-;)
今日は珍しく早く帰ってきたというのに、結局スタイルシートに３時間近くを費やしてしまいました。
過去のCDレビュー、約1800件分を手作業ってのは・・・あ、今一瞬意識が遠のいた。
スタイルシート適用云々よりも、まずはDreamWeaverの吐き出した超絶ソースをなんとか見られるソースに戻すことが先決なのかもしれません。正規表現が使えないほど複雑ならば、Perlなんかの強力なスクリプト言語を使うのがいいのかもしれない・・・
うーん、まだまだあきらめきれないなぁ。
HTMLエディタにMacromedia Dreamweaver 8を導入しました。
Plannetのバージョンは5になり、（内容が伴っていませんが）随時ページをスタイルシート対応に変更しています。スタイルシートに対応させることによって、HTMLコードを効率よく記述することが可能となりますが、見た目にはほとんど変化がありません。
まさに広島のお好み焼き。
ソースが違います（言わなきゃ良かった）。
・・・ソースファイルが見やすくなってるんですね（汗
面白いことにスタイルシートというのは、これまでのDTPが目指してきた"WYSIWYG"の思想から一部逆行しているんですね。スタイルシートにのめりこめばのめりこむほど、コードへの直接的なエディットが多くなっていきます。ガリガリとページを作りこむ職人仕事のような面白さはありますが、デザイン面ではより抽象的に、コーディング面ではより原始的になっているみたいです。あまり詳しくは無いのですが、ポストスクリプトの生コードで絵を描いている感じといえばよいでしょうか。ここ10時間ほどスタイルシートをいじっているのですが、まだまだ使いこなすまでには至ってません。
会社の仕事より一生懸命やってるな(汗
とにかく、これまでの全てのページをスタイルシート対応にする必要があって、今から気が遠くなってます。少しづつやって行こうとは思いますが、いつまでかかるやら、さっぱり予想が立ちません。
今後の予定としては、
全ページスタイルシート化→フレームの廃止→サイトデザインの変更
となりますが・・・
サイトデザインをどうするは、和風スタイルを踏襲する以外は全くの未定です。
ブログツール"Movable Type"のプラグイン、StyleCatcherでスタイルを変えてみました。
おお、なんかよさげ(^o^)
アメリカ〜ンな（端的に言えば大味な）テイストの多いStyleCatcherのスタイルのなかでは、わりと観賞に耐えうるデザインです。
本家「どむや」ともちょっと似てますね。
--
以前、「cssなんつーブラウザ依存の激しい仕様は使わないほうが良い」なんてことを書いた記憶があるのですが、いつのまにかhtmlの流れはすっかりcssに移ったようです(苦笑)。サイトを巡ってみると、大手のサイトはほとんどcssを使っていて、凝ったデザインの割にはシンプルなコードで書かれています。スタイルを別シートに記述して、メインでごちゃごちゃと指定する必要が無いのがcssの利点なんですね。
cssだけではなく、サイトのデザインそのものにも流行があるようです。最新のhtml仕様では推奨しないフレームによる画面レイアウトのスタイルはすっかり廃れていて、テーブルを駆使して１画面にギュッと情報を凝縮するスタイルがトレンドのようです（ブログのデザインがまさしくこれですね）。確かに、当方のサイトを改めてしげしげと見てみると、なんつーかまあ非常に古式ゆかしいデザインで。
和の心っちゃあ心なんですけど(^^;)
亭主の使っている"Dreamweaver 4(2000年発売)"も、参考書にしている「HTMLタグ辞典(第１刷・1996年発行)」も、今となってはすっかり時代遅れになってしまいました（でなければ-588点なんていう得点はたたき出さない）。最新のhtml/cssに対応した"Dreamweaver 8"は、ライセンス新品ならば\50k、アップグレード版ならば\26kと、なかなか気軽に買える値段ではありません。現在所有しているVer 4.01は充分に元を取るだけ使いましたが、まだまだ次のバージョンを買うほどの余裕もありません。
Dreamweaverのアップグレードはさておき、レイアウトだけでも新しくするか、それとも一からサイトを作り直すかは一考の余地がありそうです。ちなみにPlannet（当サイトのメイン・プロジェクト名）のバージョンが4.5なのは、次のステップを見据えてのことだったりします。コンテンツの充実もですが、サイトのデザインもこれからどんどん変えていきたいところです。
乞うご期待(^o^)b
MacOSX safariユーザさんの要望で、本サイトの全ての日本語フォントを"MSPゴシック, Osaka"に統一しました。これまでは「和」の心を重視して"MS明朝, 細明朝体"にしていたのですが、Mac OS Xでは細明朝体はビットマップフォントのようで、safariでブラウジングすると、お粗末なぎざぎざフォントが表示されるようです。ついでにsafariは漢字入りのフォントファミリは認識してくれないので、アウトラインフォントで英字のOsakaならばとりあえず動作。
当サイトのポリシーのひとつに「徹底したローカル主義」があります。地域、ジャンル、趣味趣向などあらゆる面でローカル性を重視する当サイトが、ブラウザのローカル性をオロソカにしては本末転倒です。Windows, Macどちらの環境でも快適に閲覧できるサイトを目指していますので。「見られないよ〜」とお困りの方はぜひ掲示板、メールにてご指摘ください。皆さんのご期待に沿えるようなサイトにしていきたいと思っています。
え？Linux？(汗
とっ、とりあえず"aliastt-gothic-jis0208.1983-0"あたりでしょうか。CSSでも導入しないと、フォントの変更だけでもかなりの労力ですね・・・って、CSSに対応してないブラウザに対応させる必要もあって(以下聴取不能)
--
ともあれ(~-~)
--
当サイト(Plannet)黎明期において、htmlコードは全て亭主の手書きでした。現在はMacromediaのDreamweaver 4を使用しているのですが、Dreamweaverの生成するコードはとにかく効率が悪くて、エディタなどでコードを見ていると、死ぬほど繰り返されるFONTタグに思わず頭痛。編集のやりやすさと、コードの美しさは両立しないのかなぁと。
htmlのコードがどれだけ文法にそっているかをチェックするツールです。文法は常に新しくなっているので、昔は正しかった文法が減点対象になる場合も・・・
あ、うちのコードは採点しないでくださいね(^^;)
最近のコメント