雅勒の散歩路

能面師「雅勒(がろく)」が 能楽・能面及び、花木や野鳥・蝶等に関するHP番外編の記事を
“散歩”のような気軽な気持ちで、不定期に掲載しています。

PC活用法

Web頁のVr.up 4

HP 『 雅勒の庵 』を開設したのが2009年の8月

HTML5のWeb頁



当時独学で

HTML(
Hyper Text Markup Languageの略)を習得して

なんとか皆さんに公開出来る
Webサイトと成り、

継続更新をしています。


この頃は HTML4.01 のバージョンでした。


2014年に HTML5 が勧告され、

現在では、ほとんどのブラウザ
 ( IE8以降、MicrosoftEdge、GoogleChrome etc. )

対応しています。


PCを新しくしたのを契機に、

使用するメインブラウザを

Microsoft Edgeにして『 雅勒の庵 』も

HTML4 から HTML5 へ移行していくことに

決めました。


この歳で、

Webの最新技術を習得するのに躊躇しましたが

この先のライフワークと、

ボケ防止を兼ねた脳トレにと ・ ・ ・

少しずつです。



まずは、

雅勒の庵 』のメイン
Webページの

Webサイトのメイン頁


ドキュメント宣言(DOCTYPE) の変換から

<
!DOCTYPE HTML PUBLIC "-//W3C//DTD
  HTML 4.01 Transitional//EN" "
     http://www.w3.org/TR/html4/loose.dtd"
>
       ↓
  <
!DOCTYPE html>


文字コード指定も

  
<meta http-equiv="Content-Type"
   
content="text/html; charset=utf-8">
     
  ↓
  <
meta charset="utf-8">

こんなにシンプル化されます。


スタイルとスクリプトのtypeは

  <
link rel='stylesheet' type='text/css' href='style.css'>
  <
link rel='stylesheet' href='style.css'>
       

      不要


とにかく、記述がかなりシンプルになります。



HTML4.1スタイル





  HTML4の
    記述 



               


HTML5スタイル



後は、本文の記述で

フォント(font)や色指定(color)部分の属性を

少しずつ変更していきます。





NewPC(Windows10)5

今現在、

Windows 8.1 のデスクトップPCを使ってますが

分解掃除の際にちょっとしたトラブルが生じ、

PC修理専門店で色々調べてもらった時、

HDD
(ハードディスクの使用時間が 27,926hr と

通常の限界時間 1万hr を遙かに超えているのに

驚きました。 😲(゚ω゚)


HDDのオーバーホールを考えたのですが、

5~6万円ほどかかるようなので ・ ・ ・


PCの新規購入を決めました。

01.NewPC_梱包







02.NewPC_開封










手のひらサイズの分離型です。


03.NewPC_サイズ比較
  (左) 旧PC(Win8.1)   (右) 新PC(Win10)


旧PCと比べると 1/4 の大きさと重量ですが

04.NewPC_スペック

性能はアップしています。

特に、

ストレージは256GBのSDDをカスタマイズしたので

起動時間は抜群に早くなっています。

さらに、騒音は全くしません。


早速、ツールの登録を ・ ・ ・

11.ツール登録履歴


次は、旧PCのファイルの移行

12.File移行履歴

10.ファイル転送
     共有フォルダーにファイル転送中
 


新PCの(c):ユーザーのパブリックに

PC間アクセスFile用の共有フォルダーを

作り、そのフォルダーを媒体にファイルの

受け渡しで全ファイルの移行が完了です。


最後に、

新旧のPCのフォントの一致化です。

13.フォント(旧PC)_江戸勘亭流P



  旧PC

  江戸
  勘亭流




12.フォント(NewPC)






 新PC



15.フォント移行
    フォント移行リスト



まだ、若干問題を残していますが

これで、新PC(Windows10)が使えますが

31.デスクトップ(NewPC)_2
    
新PCのデスクトップ画面

暫くは、

2台のPCを併用しながら新PCのスキルUpを

40.NewPC_設置完了

していきます。




ブラウザの移行準備 4

Webサイトを閲覧するために使うソフト、

ブラウザ の移行を検討中です。



Windowsパソコンの標準で入っている

マイクロソフト社のIEロゴ

「Internet Explorer(IE)」

を永らく使ってきましたが、




使用時間の限界を超えている

ハードディスク(HDD)のオーバーホールと

今使っているOS(Windows8.1)の

サポート終了時期も考慮に入れ

そろそろ、

PCも買い替え時期になったので

Windowsサポート


IEも別のブラウザに替えようかと思っています。



Windows 10 に標準搭載されている
Edgeロゴ
「 Microsoft Edge(エッジ)

を使うか?




性能重視で、

ブラウザのベンチマークa

Chromeロゴ

「 Google Chrome(クローム)

を使うか?



迷うところです。


いずれにしても、IEから

Edge か Chrome に切り替えは必然ですので

自前のHP『雅勒の庵』、ブログ『雅勒の散歩路』や

Facebook、YouTube 等の動作確認を進めて

います。


Facebookでは、

カバー画像のレイアウトの違いが有り

IE11の表示
 IEでの
 表示









  プロフィール画像は、左下


Google Chromeの表示
   Edge
   での表示







                プロフィール画像は、中央


早速、修正を余儀なくされています。



YouTube は、

Chrome が推奨ブラウザとされており

Edge で見ると低速な表示になって

しまいます。


等々、色々な問題も出てくるでしょうが、

次のPC(Windows 10)購入時に戸惑いが無い様

Edge や Chrome に

慣れていくしかないようです。 




PCモニター買い替え 5

10数年使ったPCモニターを

新しくしました。


PCは6年前に買い替えたのですが、

モニターは、

そのまま古いものを使い続けていました。

Fujitsu(VL-19WM1)_ワイド19型(1440x900)












       19型ワイド  解像度1440x900

輝度も落ちてきたようにも思えます。



新しいモニターは、


iiyama(ProLits XU2292HS)_21.5型

21.5型、1920x1080のiiyama製

P6022440













PCとの色の統合(黒)も出来ました。

iiyama(ProLits XU2292HS)_21.5型(1920x1080)



何よりも良かったのは、

画像の拡大表示(100%→125%)で

文字も大きくなり


表示100%




    
 通常の
 100%
 表示⇒





表示125%






  125%
 表示





老体の眼には優しい画面になったことですね~ 



今まで使っていたモニターも

もう少し使えそうなので、マルチモニター

マルチモニター


で使おうと思っています。





HPの機能アップ 5

    「雅勒の庵」_四季の庭_薔薇の園サムネ


今まで撮り貯めていた薔薇の画像を整理しつつ、

ホームページ(HP)の機能をアップしています。



今までは、

薔薇のサムネ画像と、サムネからリンクする


サムネからのジャンプ







   従来の
   別画像の表示





一枚の別画像のみの表示でしたが、

サムネ画像からWebページにリンクさせて

表情のいい画像を複数表示 するようにしました。

四季の庭_薔薇の園の詳細頁










四季の庭_薔薇の園の詳細頁(2)
四季の庭_薔薇の園の詳細頁(3)










更には、

マウスポインタをサムネ画像の上に合わせたとき

画像を ” ゆるーく ” 動かす機能も追加しています。


HTML_Style定義

たった一行の定義をするだけで、可能でした。


機能アップの結果のHP操作の動画を、


 


参照して下さい。


本ブログ「雅勒の散歩路」から

HPへのリンクは

ブログ右上の 「 雅勒の庵 」 をクイックすれば

ブログからHPへのリンク








別ウインドウで開けますよ!


是非、お立ち寄りください m(__)m



ハンパないインクの消費 5

  仕事がら、

インクジェットプリンターでの印刷をすることが

P7131531a











多いのですが、

インクの消費量が ハンパない量 になります (>_<)


特に、

黒インクの消費は他の色の3、4倍の補充が必要

P7131532b









インク使用状況















です。


そこで、

能面の型紙に付属させる参考資料の画像を

正面画像側面画像












黒の背景から白の背景に画像修正して、

少しでも、黒インクの消費量を抑えることに

しました。


ツールは、フリーソフトの PhotoFilter を使用

背景微修正


黒の背景部を白色に塗りつぶした後の

稜線の微細処理が大変ですが、コツコツと ・ ・ ・

   


こうして、

1画像数日を掛けて完全な白背景の資料を

作成していきます。


出来上がりがこれです 


正面画像_白背景




 











側面画像_白背景















型紙は、

型紙型紙2












黒の背景のままです。


型紙補足資料













型紙 (2)












これで、

インクの経費50%が削減できます。 





久々のHP更新 5

水戸千波湖畔の 『 とう粋庵 』 さんでの

能面展示のホームペイジ(HP)アップに為、

久々にHTML(ハイパーテキスト・マークアップ言語)を

使いました。


もうこの歳ですと、記憶力と根気がなくなってきて

いるので、苦労しましたぁ~ 



まずは、

HPに貼り付ける画像の編集から始まります。


画像編集









画像編集_2
















次に、更新対象のHTMLを開き、

Information










Information_ソース













文章・画像定義の入力をしていきます。

ビルダーツールを使えばもっと楽に出来るかも

しれませんが、

100%手作りのHPなので ・ ・ ・


何とか、

『催しもの情報』のHTMLが入力出来ました。

Information_画像


次は、FFFTPを使って

HPのプロバイダーのサーバーに情報転送です。

FFTP



正規のHPを開いて、更新結果のチェックです。


更新履歴ソース










更新履歴_画像












更新履歴_画像a (1)


何とか、正常にアップ出来た様です。 




最新の 『雅勒の庵』 の「催し物情報」を御覧下さい。


       こちら ☞ HP 「 催し物情報 」



写真集の編集 3

第15回 能面展 も終わり、ゆっくりとしたいところですが

まだまだ、

関連の作業が何故か? 雅勒 だけ ・ ・ ・


写真集の編集作業です 


前回の写真集は、Word で編集した為、

作品画像が小さくなってしまいましたので、

今回は Excel を使った台紙で編集をしました。


表紙&背表紙











 



入選作品
















記念の能面展でしたので、

展示面数も75面と、過去最高の面数です。

それにより、

写真集のページ数も40頁となり、

編集作業も一苦労です。 (>_<)


何とか、ゲラ版も出来上がり

ゲラ製本












 表紙



表紙の見開き










 見開き





P4190427









 




次の教室の日に各自のチェックを受けて

最終的には、ネットで印刷サイトに発注です。


これで、終わりではないんです~ 

次は、

奉名帳













奉名帳の整理で、

200名以上の住所・氏名を、これまた Excel

データベースに転記していく作業が待っています。


なまじ、PCが使いこなせると

仕事が増えて大変です。 (>_<)



ポスターの画像処理 

水戸の 偕楽園 では、

20日から120回記念の梅まつりが始まります。


梅が終盤を迎え、そろそろ桜の咲く頃に

水戸偕楽園公園センター

第15回目の 定例の能面展 が開催されます。


それに先駆けて、

ポスターや立て看板のデザインの作業を開始

しました。

今年のポスターを飾る面(おもて)は、

青木講師の狂言面 【 嘯吹(うそふき)

P2130155a


金沢能楽能楽美術館 「 現代能面美術展 」 で、

金沢能楽美術館館長賞 を受賞した作品です。



ポスターの背景画像に能面の画像を

張り付ける為には、能面の画像を透過モードに

加工する必要があります。


まずは、

面の背景を白抜きして

背景の白抜き処理





 PhotoFiltre 7
 を使用



画像処理_背景抜き


 この髭の
 処理が大変
 





次に透過処理をします。

背景の透過処理









P2130155c










 透過処理
 された画像

 png の拡張子




この透過画像(png.)をポスターの背景に


背景に貼り付け









     Excel
    を使用

 


貼り付けます。


後は、

必要情報を文字入力して完成です。



立看板_A2(正方形)









  変形A2サイズ
     の立看板用




ポスター_A4













 A3サイズの
 ポスター用






印刷は、

A2サイズはネットで防水加工の印刷依頼し、

A3サイズは自分で印刷してラミネート加工が、

P2180196





  





出来るので安上がりです。 






HPの専用ドメイン取得 3

ホームペイジ 『 雅勒の庵 』 をアップデートしていると、

突然、

サーバーの容量制限オーバーのメッセージ 


エラーメッセージ




もともと、今使っているプロバイダーの

無料のCGIを使ってのホームペイジでしたので

いつか、この時が来ることも予想されていました。


何しろ、無料ですので50MBの容量しか使えません。

急遽、

有料で+30MBを容量追加をして何とか収めました。



将来的には、80MBもいずれ満杯になるので

この際、別のホームペイジサービスを探して

移転しようと思い、

無料の1GBで “ 専用ドメイン ” の使えるところを

探しました。



早速、

専用ドメイン の登録をして、ホームペイジのデータ

をFTPで転送すると、

Image05465






Image05560














エラーメッセージの続出 



原因は、

各社で採用しているサーバーシステム(UNIX)の

違いによる使用文字制約に掛っていたのです。


現プロバイダーのシステムでは、

スペース(半角)やカッコ( ) 等が使えていて

画像の名称等に多用していたものが、

使えなくなってしまいました。


この忙しい時期に ・ ・ ・


一旦は、

ホームペイジの移転を断念したのですが、

数日を掛けて、なんとか移転作業が終わりました。 



そんな訳で、

専用のドメインのホームページが完成しました。 


Image05770
 旧URL
 (
http://www.net1.jway.ne.jp/k_garoku/index.html
            ↓

Image05690


 新URL
 (
http://garoku.jp/ )



Image05315




   アイコンも新しく



Image05615















中身は変わっていませんが、

アクセスカウンター と 「雅勒へのメール」は

変わりました。


今後とも、よろしくお願いいたします。 <(_ _)>


記事検索
月別アーカイブ
プロフィール

雅勒

メインHP ⇒ 『 雅勒の庵 』 

- - - - ’20 ( R.2 )- - - -
11/24 「作品展示室」に《泥虎》をアップ
8/17 柏原氏の《白式尉》をアップ
7/12 皆川氏の4面をアップ
2/9 「催し物情報」を 更新
2/6  柏原氏の《平太》をアップ


- - ’19 (H.31、R.1) - -
12/28 松本・柏原氏の《野干》をアップ
10/9 「作品展示室」に《野干》をアップ
 6/29 「薔薇の園」の グレードアップ
 5/29 「橘教室」の 新作7面を アップ
 5/28 「催し物情報」を 更新


お時間があれば、こちらもどうぞ


12月の能と花のイラスト
コロナ鬼も退治出来るかな?


― 能「土蜘蛛」(能絵)-

能「土蜘蛛」 ☞ こちら     



― 寒椿 -
イラスト「十五夜」 より☞ こちら    
アクセスカウンター
  • 昨日:
  • 累計:

       ( UUを表示 )

訪問有難う御座います ♪♪

雅勒の勝手な、お気に入り
能面師 中村光江 さん
 「能面の世界」

能面アーチスト 柏木裕美 さん
 「能面の世界」

和あらかると 岩田晶子 先生
 組紐教室

ノビタ さん 
 「ノビタの釣り天国」

シャンソン歌手:日野美子 さん
 ♪日野美子の日記♪

シャンソン歌手:別府葉子 さん
 葉子通信

小森真理子 さんの公式HP
 琴 ー 感動

ポピュラーピアニスト namiさんの
 咲花/nami ブログ

ROUGE(ルージュ) さんの
 額 ~薔薇の国星~

音霧 忍 さん
 季(とき)の庭

房総のままちゃん
 ご飯の後。

暇人haru さん
 趣味の歳時記

パラグライダー人生 稲垣 さん 
 「パラグライダー人生」

- - - - - - - - - - - - - - - - - - -
QRコード
  • ライブドアブログ