2010年10月8日金曜日

googleのサービス利用によるHPの制限事項


県HPはgoogleのサービス利用を利用し、HPを制作しています。

●現在の仕組み



プロバイダのサーバ: 目次部分 ( index.html および メニューの HTML)
googleのサーバ: コンテンツ部分 ( Blogger、 Calender、Youtubeの動画)
の2種類に分類できます。

ホームページとしての容量制限は


1)プロバイダのサーバの使用可能なディスク容量: 30MB (Yahoo!domainでのオプション契約の場合)

2)googleのサーバの利用状の制限について (無料で使用できる範囲)

現在の投稿されているコンテンツは大半が google Blogger (チームブログ)を利用して行われているが、利用規約から ひとつの googleアカウントあたり、下記の制約があります。

画像関連 PICASA albumへのアップ制限 : 2GB
動画(youtube へアップ制限): 10分以下の動画  本数はよくわからず 

詳細については
googleアカウントでの制限
http://www.google.com/support/blogger/bin/answer.py?hl=ja&answer=42348&ctx=cb&src=cb&cbid=1jf689y31bhpn&cbrank=5
Blogger利用による制限
http://www.google.com/support/forum/p/blogger/thread?tid=0502d55ad566638a&hl=ja
googleのサービスの利用(たとえばgoogleのBloggerに写真を表示させるとすべて PICASAのサーバに保存されます。無料で使用できる範囲は これで制限されます。
http://picasa.google.com/support/bin/static.py?page=guide.cs&guide=16027&topic=24015



一googleアカウントあたりにどれだけ利用しているか確認ができます。

youtubeへアップする動画の制限
http://www.google.com/support/youtube/bin/answer.py?hl=ja&answer=71673
本数の制限: よくわからない
http://www.google.com/support/forum/p/youtube/thread?tid=15a043acac871484&hl=ja


移行について


A)プロバイダのサーバ: 目次部分 ( index.html および メニューの HTML)
B)googleのサーバ: コンテンツ部分 ( Blogger、 Calender、Youtubeの動画)

の2種類に分類できます。


ここでに検討はgoogleのサービスを利用することを前提に、考えた場合は、googleアカウント間での移動ということになります。

1)Bloggerのデータの移行
http://www.google.com/support/blogger/bin/answer.py?hl=ja&answer=41448
2)PISCAアルバム(画像)の移行
http://picasa.google.com/support/bin/answer.py?answer=189356&hl=ja
3)Youtube(動画)の移行
4)Calendarの移行
googlei以外のサービスの利用への変更について 移動先のブログ等の仕組みによると思う。

googleの最近の政策、ニュース 機能強化

A) Blogger navBarの非表示設定
   以前必須だった navBarが非表示設定可能になった。
B) googleプライバシーの統合
C)

2010年10月5日火曜日

HP運営のためのFAQ

(現在作業中 ! )

コンテンツ作成関連



Q. HP(コンテンツ)作成は、まず何からはじめるのか。

Q. 過去のコンテンツ(たとえば去年の大会の形式等)を利用して新規に作成できますか?

Q. 表形式のコンテンツはどのようにして作成するのか
Q.ワードファイル、Excelファイル、PDFファイルの表示は可能か

Q. 沢山の写真を掲載したい。

Q. HPに個人名(試合の入賞者等)を記載するのは 個人情報違反か。

Q. HPに写真(試合の様子)を掲載するのに何に注意しなければいけないか

Q. 公開中のHPのページを変更できますか。
Q. どの時点で公開されるのか



Q. カレンダーへの追加はどうやるのか

Q. 動画が含むコンテンツの作成はどのように行うのですか?
Q. 動画撮影の注意点は何ですか
Q. 動画の編集はのやり方を教えてください。
Q. iPhone (iPad)で動画がされない場合がある。コンテンツ作成上の注意は?

Q. Bloggerの編集画面が表示できないためコンテンツ作成が出来なくなった。対処は

Q. 音声付きコンテンツの作成はできますか?

Q. マップに活動場所等のマーキング()できますか?



システム関連他

Q. BT協会のHPでは web管理者、blog管理者 コンテンツ投稿者に区分しているのはなぜか

Q. 一般公開、限定公開、非公開の区別は?

Q.  ホームページのコンテンツの数と容量の制限はないのですか。?

Q. 大容量の写真データの受け渡しをしたい。簡単な方法は
            Gmail、 dropbox 等が便利かな?

Q. ホームページの引越しは出来るか?
Q. ブログの引越し はできるか

Q. なぜBloggerでHPを制作しているか
http://www.blogger.com/blogger.g?blogID=5176239788908302439#editor/target=post;postID=1353492137766635787;onPublishedMenu=allposts;onClosedMenu=allposts;postNum=23;src=postname

Q. 目次部分の編集権の移譲  (ドメインの移行)
http://btkanagawa.blogspot.jp/2013/12/yahoodomain.html

2010年7月2日金曜日

2010年5月19日水曜日

個人情報保護方針はどうあるべきか

HPを開設にあたり このポリシーを明確にすることは重要と思われる。

個人情報保護法のQ&A集です。



下記URLは体育協会の保護方針です。
http://www.japan-sports.or.jp/privacy/index.html


現在、HP運営にあたり、いくつかのgoogleサービスを利用している。



2010年3月10日水曜日

支部協会のページ例


簡単な支部協会のページ例:
http://docs.google.com/View?id=dccsg7n6_99f37pq8fz
凝った支部協会のページ例:

動画のページはどうやって作るの?




コンテンツ作成のながれ
1)デジカメで動画を撮影する。
2)その動画をyouTubeの動画サイトに投稿
3)HP(関連ブログ)に youTubeのリンクを「埋め込み」の形式で表示させる。




1)デジカメで動画を撮影する

撮影する場合使用する機器(デジカメ)の性能、基本的の操作に慣れている必要があります。
主なポイントは
撮影時の画質の選択 (HDだと後で圧縮処理必要かもしれません) 
ホワイトバランス(赤みや緑ぽい画像)
焦点のあわせ (最近は自動調整モードが多い)
ズームのやり方 
音声がどの録音できるか(デジカメのの場合は事前に調査しておく必要あり)

撮影のチャンスは2度とないわけですからちょっと事前に確認しましょう。
現在市販デジカメの動画の解像度は概ね下記

HD(1280x720 16:9 縦横比  8GBカードで33分  
WVGA (848x480   16:9  縦横比  8GBカードで72分
VGA (640x480  4:3縦横比) 8GBカードで88分

ちなみに上記映像はHDの半分の解像度( 360p)です。
圧縮、変換変換ツールhttp://explorer.crav-ing.com/で圧縮して軽くしています。


もうひとつ重要なことは、肖像権、個人情報の保護です。公開を前提にしたコンテンツの作成が目的ですから、撮影の技術は難しい。結論的には 雰囲気が伝わればいいという考え方で、特に女性のアップはやめよう 、出来るだけと遠目の写真ということです。特に多くの参加者がいる大会や講習会の場合は全員の許可を得ることは出来ませんので注意が必要です。撮影公開後、写真(ビデオ)の削除要望(クレーム)があった場合HP管理者としてはHPから削除することになります。

2)動画をyouTubeの動画サイトに投稿

事前準備として googeのアカウント取得することで誰でも自由にアップできます。



 詳細は下記URL参照
  あなたのサイトにyouTube: 
         http://www.youtube.com/youtubeonyoursite 
いくつかの注意点があります:
a)youTubeに登録時はHP掲載前提なので  「限定公開」にすると 不本意に公開されない。
  HP掲載の映像は「限定公開」で行ってください

b)埋め込み時には 関連動画を含めないようにしよう。
   (あまり好ましくない動画( 関連画像 )が表示されることあり 
c)埋め込みコードは 新バージョンがベター
旧バージョンではFlash対応前提のため はiPhoneやiPadで映像見れなくなります。)
  埋め込みについては下記参照
 http://www.google.com/support/youtube/bin/answer.py?answer=171780&expand=UseOldEmbedCode#oldcode


google PICAS A( 編集 管理ソフト) から  ビデオトリミングや youTubeへ投稿も可能 
PICASA については
http://picasa.google.com/support/bin/static.py?page=guide.cs&guide=16027


windows標準に付属しているムービーメーカでよりビデオ編集可能です。


3)HP(関連ブログ)に youTubeのリンクを「埋め込み」の形式で表示させる。


ブログ(Blogger)に動画を載せるためのヘルプ:
   http://www.google.com/support/blogger/bin/answer.py?hl=jp&answer=67428

埋め込みについてのyoutubeのヘルプ:
 http://www.google.com/support/youtube/bin/answer.py?answer=171780&expand=UseOldEmbedCode#oldcode




補足説明:

●動画撮影のための機器の仕様(マニュアルからの抜粋)

※iphone 4 の場合: 720p (1280x720画素 HDビデオ撮影可能) 固定
ファイルサイズは 一分間で 76MB  
フィル形式:MOV  (QuickTimeMotion JPEG:音声付動画)
※Panasonic DMC FZ28 の場合:
解像度は HD(1280x720 16:9 縦横比  8GBカードで33分
WVGA (848x480   16:9  縦横比  8GBカードで72分
VGA (640x480  4:3縦横比) 8GBカードで88分
※Canon PC1309  解像度は VGA (640x480  4:3縦横比) 8GBカードで88分 
実際使用するデジカメの仕様は添付マニュアルまたはメーカのサイトで確認してください。

ファイル形式:MOV(QuickTimeMotion JPEG:音声付動画)
注意:
AVCHD 1920×1080の フルハイビジョン画質対応している機器が発売されているが、現在とところ この形式は、HP用動画としては不向き? と思われる


圧縮、変換変換ツールhttp://explorer.crav-ing.com/
高解像の動画を圧縮する場合 上記ソフトを使用すると便利です。


●youTubeの一般公開と限定公開について
http://www.google.com/support/youtube/bin/answer.py?hl=ja&answer=157177


限定公開動画は非公開動画の一種です。「限定公開」にすると、動画のリンクを知っている人(リンクを送った友だちや家族など)のみが動画を再生できますが、限定公開動画は、検索結果、チャンネル、ランキング ページなどの YouTube の公開ページには一切表示されません。限定公開動画は、非公開動画とは次の点が異なります:

●写真(動画)掲載のマナーについて
http://btkanagawa.blogspot.com/2011/05/blog-post_06.html

支部協会のページは

下記2協会のHPを比較してみると方式が異なります。


ブログ利用を利用したHPは、TAG等の専門知識必要なく、自由かつ気軽にHPを作れるメリットがあるが、反面自由過ぎるという意味でまとまりがなくなるような気がする。 
一方、従来からのHP方式は特定の人に作業が集中する事や、HPの知識が要求されるため、かなり組織的に運営しないと困難になるような気がする。
支部協会は、上部協会主催の大会へ参加するための取りまとめや、支部協会自身の大会主催という側面の他、直下にサークルを持っている点から、ページの内容がより個人的になると思われる。逆にサークルや個人の参加する仕組みがないと不満も残るような気がする。

支部BT協会のページとしてブログだけでやる方式もありうると思うが、その欠点を補う意味で下記のページを作成してみた。


topPageはgoogleドキュメントで作成している。従来からのHP方式はプロバイダーとは契約していない点で「従来からのHP方式」とは異なります。
下記メニューバーを作成してみた。ここで一部は同一googleドキュメントにリンクするため「ブックマーク」で結びほかはURL指定でリンクしてみた。

注意しなければいけないことは迷子にならないように直前のページに戻れる仕組みを作る必要あると思われる。
ここで、上記市BT協会のページで付与している「戻る」ボタンの中身について説明する。

同一googleドキュメント内での移動:
メニュー/ツール/ドキュメントブックマーク管理で ブックマークを設定し、「戻り」のリンクにこのブックマークを設定することで実現している。

他googleドキュメントへの移動(行事・結果):
[戻る]
これはリンクでジャンプ元のURL("View?id=dccsg7n6_128drxpx589")を指定し HTML/HTMLで編集で 生成されたHTMLに target="CENTER" を追記して実現しました。

ブログへの移動:
 googleのブログの場合は [javaScript]を組み込める
href="javascript:history.back()">[戻る]

通常のHTMLファイル(協会カレンダー)への移動:
 
href="javascript:history.back()">[戻る] を追記して実現しました。
 ただし、自分で作成していないURLのジャンプの場合、相手のHTMLを編集できないので戻りボタンの付与はできない。

2010年3月5日金曜日

大会成績表

  1. ★★選手権大会 成績結果

大会参加者申し込み書(フォーム方式)

主催協会から各支部やサークルに対して参加者募集する際に利用する申し込みの例です
従来、参加申し込みは、協会事務局から支部協会(またはサークル)に申し込み書を郵送し、それを回収して大会組合せ表を作成していました。


申込書をこの共有書類にすることで、ネットワークを通じて、参加申し込みを受け、大会組合せ表を即座に作成できます。上記の googleフォームの場合は、googleの表(スレッドシート)に展開されます。

googleドキュメントのテンプレートも作成してみました。 
      ★★選手権大会参加申込書

2010年2月27日土曜日

googleの利用のKnowHow(videoで説明)

フォント サイズ

googleで、できること

写真掲載のマナー


下記は厚木市SNSへの写真掲載の論議です。


下記のサイトで写真撮影とそれに伴う下記の内容が解説がされています。



HPの仕組みと運営


一般的には、HPを開設するためにはホームページサービスを提供しているプロバイダーと契約し、このプロバイダのサーバに関係するすべての「HTML」ファイルや画像データ等を 転送することで実現しています。
今回の仕組みは、インデクス(目次)部分と個々のページの管理を分離し、インデクス(目次)部分のみをプロバイダのサーバに転送し、個々のページはgoogleのサービスを利用して作成し、そのページをリンクで結ぶ方式で実現しています。

みんなで公開ページ作成
googleサービス利用はTAGの知識不要のため、誰でも作成可能で、協会の関係者や各支部及び 多くのBT愛好者でHPを構築して行くことができます。

管理者の負担の減少
契約プロバイダーへの転送データが少なく、かつ構造がシンプルのため管理者への負担が少なく、各ページの作成はgoogleのサービスを利用するので管理者と切り離して行うことができます。

楽しいページの導入でアクセス増
動画やブログの導入で  「楽しい」 「わかりやすい」 ページを作ることができます。
   


googleのサービス利用によるページの作成

  BT協会ページを作成するために使用しているgoogleサービスは次の通りです。

◆HomePageを更新するために必要なgoogleアカウント                                               HP作成のためgoogleサービスを利用する場合このアカウントでログインが必要です。      
 パスワードについては県協会HP担当に利用を申し出てください。
  • 協会アカウント   Admin@kbta.jp
◆使用パソコンにインストールするアプリケーション
     協会HPはGoogleサービスを利用して作成されています。HPを作成する人は下記アプリを自PCにインストールしてください。
  • google Chrom (ブラウザ)
  • google PICASA         



googleサービス googleBlogger


 お知らせ(事業の広報)、大会情報(大会結果)等のページはこのサービスを利用して作成しています。






特徴
  • 無料
  • 広告無し
  • 強力なスパムコメントフィルタリング機能を装備(Gmail の技術)
  • 携帯電話からの投稿が可能(MailToBlogger)
  • スマートフォンからの閲覧に対応(モバイルテンプレート)
  • サーバー不要
  • HTML や CSS、JavaScript などコード使用も制限なし
  • 1 アカウントで、複数のブログを運営可能 
  • 複数のアカウントで、1 ブログを運営可能(チームブログ)

Bloggerについて情報満載されています。



②googleドライブ: 

大会のお知らせの「開催要項」や「申込書」はこのドライブに保存されリンクされています。使用例は下記

googleドキュメントやgoogleスプレッドシートもgoogleに保存されています。


   

    • 共有ファイル化することで複数の人で協働(コラボレーション、)作業が可能。
    • 既存のファイルの取り込み(word、 Ecxcel等から読み込み)作成可能
    • 表、画像、リンク、ブックマーク付与、各種の表示形式のサポート
    • 他のHPから Copy&Pasteで 書類取り込み可能
    • 表、画像、リンク、ブックマーク付与、各種の表示形式のサポート
    • 編集権限がある場合、HPから直接そのページの誤りの修正し公開が可能です。(この場合web管理者経由する必要はありません)
    • 変更履歴の表示


③PICASA(google)
利用例
コラージュ例

試合の写真等が大量にある場合 この写真管理が便利
    • PC上で大量の写真、動画を管理できる。(重複防止や修正可能)
    • 公開アルバムにアップアップすることで一挙に大量の写真公開可能(パノラマ等も可能)
    • 複数写真から コラージュすることが可能 (大小の写真を利用して一枚の写真を作りページ作成に利用)
    • ムービー(スライド)作成  youTubeへアップ し 利用可能

googleCalendar


利用例



協会の予定をカレンダーとして公開する
    • 共有カレンダー機能 (複数の人に書き込み権限付与可能)
    • 複数のカレンダーの重ね合わせ (個人、サークル、支部、国民祝日のカレンダー )
    • 予定として 題目、時間のほかに メモ(大会の概要とか)地図(会場の) 
    • webとして公開する。 得られたURLを web管理者へ連絡 (埋め込みは HTML ページ別途作成 要)
⑤Youtube(google): 






    ⑥google マップ

    県HPのサークル紹介のページでサークルの場所を表示するのに利用しています。




    より大きな地図で KBT_all を表示






    ⑦google Gmail
    特徴
    • パソコンとスマホで動作
    • 保存容量 ほぼ無制限
    ⑦google Chrom




    他の県協会のHPは



    現在公開されているHPの良い点を採用したい。
    東京都バウンドテニス協会:http://www.tbta.jp/

    都内のサークルの状況をマップで掲載している。  

    茨城県バウンドテニス協会:http://blog.livedoor.jp/ibarakibt/
    ブログで県協会のHP作成している。
    管理がすべて、ブログ側で行うので、協会側は書き込むだけでよい。一案か?
    宣伝が多いのが難

    広島県バウンドテニス協会: http://hbta.cool.ne.jp/
    体裁がきれい、 中身も充実していると思う。

    愛媛県バウンドテニス協会: http://www.nbn.ne.jp/~k-ohsita/
    動画を大量に掲載、愛好者にとってはありがたい。(技術取得の参考) でも ちょっとごちゃごちゃ

    山形県バウンドテニス協会: http://www.geocities.jp/musaochan/

    千葉県バウンドテニス協会:
    長野県バウンドテニス協会:http://www.geocities.jp/bt_nagano/
    静岡県バウンドテニス協会:http://www2.wbs.ne.jp/~b-tennis/
    石川県バウンドテニス協会:
    大阪府バウンドテニス協会: http://www.bound-osaka.jp/

    •  日本バウンドテニス協会(JBTA) :http://www.bound-tennis.jp/ このドメインが第三者に渡ったために各地区の協会のリンクがおかしくなった? ドメインの管理は難しい。(2011/6/8連絡)
    •  日本バウンドテニス協会(JBTA) :http://www.boundtennis.or.jp/

    (過去の全国レベルの結果等やBT啓蒙情報がほしい)
    神奈川県相模原市バウンドテニス協会 :http://www.geocities.jp/btsagami/
    船橋市バウンドテニス協会 http://www.funabashi-bt.com/
    一関市バウンドテニス協会
    バウンディジャパン株式会社 :http://boundy.net/
    バウンドの紹介(技術、歴史 。。)もっとも洗練されていると思う。
    できたらこの内容をそっくりいただきたいものだ!。
    この会社とヤクルトとJBTAの関係がわからない
    中身が濃い。かなり個性的!  「BT保健室」なんかいいですね
    こんなHPどうしたら作れるのかな?  
    でも 迷子になりそう  愛媛県協会もそう      
    長野アイキュウクラブ
    バウンド以外の協会HPの様子はどうか
    神奈川県バトミントン協会 http://www.h3.dion.ne.jp/~kba/
    競技人口が多い、 底辺が広い ( 小学校、中学校の 大会あり)
    バウンド以外は競技人口がけた違いに多いので、比較ができない。

    お役立ち情報(web管理者用)


    管理者になるため必要と思われる(または知っておいてほしい)項目です。

    ●独自ドメーン名の取得

    県BT協会のHP開設にあたり 「kbta.jp」というドメインを取得しています。これは「神奈川県バウンドテニス協会」いう名前で毎年更新の年契約で登録されています。
         http://domains.yahoo.co.jp/promotion/whatis.html

    もちろん、ドメインを取得しなくともHPは開設できます。そのときはプロバイダーのドメインを
    借りるという形になります。一言でいうと 一戸建てにするか 共同住宅に住むかの違いで 
    す。
    ホームページのデータを保存する物理的なサーバを用意が必要です。県BT協会のHPで
         はyahooのgeocitiesオプションを利用しています。
    http://domains.yahoo.co.jp/promotion/optionservice.html
    ホームページの更新はこのサーバに転送(ftp)して行います。
    このときのIDやパスワードの漏れると他人から改竄されることになります。
    逆に言うと何かトラブルが発生するとこれを知っているweb管理者が責任を負うことになりま
    す。


    ●ホームページの入門
         
         県HPのindex.htmおよびメニュー部分は、サーバに送られるトップページです。少なくとも
         web管理者としては中身の内容を理解しておくべきと思います。実際のコンテンツは
         google Blogger等で作成していますので、web管理者の守備範囲は上記のサーバ転送
         部分だけということになります。
         将来メニューの変更は考えられますが、現在の運用している htmlファイルの中身だけで
         それ以上のTAGの知識は不要と思います。
         以下のサイトは ホームページを自作している人たちのバイブル的なサイトです。(私だけが     そう思っているかも知れませんが)
         初歩的なタグ知識習得するのに役に立つと思います。
         http://www.tohoho-web.com/www.htm
    HomePageの入門 TAGの説明
    今回のHPのTree形式メニューは このJavaScript の関数を組み込んでいます。

             カラー見本です。bloggerのデザインでもこのコードで色指定できますので記載しておきまし
        た。
    http://www.tohoho-web.com/wwwcolor.htm
    ●google

    ●テストバージョンで使用しているwebサービス
         県のHPでは 2011/5以降はyahooのgeocitiesオプションに切り替えた使用していませ
         ん。ホームページのサービスとはこんなもんだよということで残しています。


    ホームページ開設やインターネットの危険性について
    いくつか有用なページがあったのでリンクしておきます。
    http://internet.watch.impress.co.jp/www/column/hpsafety/hps9.htm