自分史上最大級の同窓会準備!

みなさん、こんにちは。WEB担当の桑原です。

今回は、来年(2020年)に、高校の同期のみんなで主催することになった2020年「東京楡の会」総会の、ホームページ制作を楽しんだお話です!

来年、たくさんの人たちが集まるかなぁ。ワクワクします♪

まずは、先輩のホームページをチェック!

地元(北海道)から、遠く離れた東京。

毎年、同じ高校を卒業した同窓生が一同に集まる、スーパー同窓会イベントが開催されています。

今年(2019年)初めて参加したのですが、参加者なんと500人弱!

老若男女、みなさん楽しみにしている、年に1回のパーティーです。

来年(2020年)の開催は、私の高校同期の代が主催するらしく、告知用のホームページを作る係になりました。

まずは、先輩のホームページでお勉強です。

2018年に主催をご担当された先輩は、Wixという無料のホームページ作成 サービスで、ホームページを作られていました。

札幌北高39期同期会(東京)
本会では札幌北高39期の、主に関東在住者が集まり、親睦を深めています。

めっちゃイイセンスです!

今年(2019年)の先輩は、なんと、WordPressを使って、Webサイトを運営されていました!

2019東京楡の会 「灯(ともしび)-受け継がれる伝統-」
2020年の総会は9月19日TKPガーデンシティ品川で行われます!2020年の東京楡の会総会は北高41期幹事のもと、9月19日(土)にTKPガーデンシティ品川で行われます。2020年東京楡の会総会のサイトはこちら!  2020年東京楡の会総

めっちゃスゴイです。 この時点で、かなりのプレッシャーが(笑)

さてと、どうするかな。。。

 

ホームページを作る前に、サイトマップを準備します。

こちらの同窓会の運営委員会のホームページを作成するのですが、何年ぶりなんだろうというぐらい、久しぶりにあった同期みんなのプロジェクトチーム型で進めていくことになります。

という訳で必要な機能や決め事を整理して、みんなで情報共有しておいたほうが良さそうでした。

まずは、今年の先輩のスーパーホームページと、引継ぎ会での引継ぎ事項参照にして、サイトマップを作ります。

41期への引継ぎ会を実施しました
8月31日(土)、都内某所にて40期から41期へ、実行委員会の引継ぎ会を実施しました。40期からは各チームリーダーが13名、41期からは15名ほど、42期からも5名ほど参加いただきました。まずは40期総務より、総括説明を行った後、各チームリ

 

最初は、この辺を決めなきゃいけないかな。。。

1、トップページ

2、イベント開催案内ページ

3、運営委員会の紹介(委員長挨拶)

4、新着情報(お知らせ、活動報告 等 ブログページ)

5、関連リンク

6、お問い合わせ受付

7、同期のみんなに呼びかけるページ

8、個人情報保護方針

先輩のホームページを参考にして、文言や表現等マネさせて頂けるところは、極力マネさせて頂いています。

先輩、ありがとうございます! めっちゃ助かってます。

そして、この後、同窓会会報に掲載して頂く広告掲載のお申し込み受付メインの同窓会イベント案内とお申し込み受付を追加していく予定です。

【広告出展のお申し込み受付】

1、広告掲載のご案内

2、広告掲載のお申込み受付

3、広告掲載して頂いた方へのお礼(一覧)

【同窓会イベント案内とお申込み受付】

1、同窓会イベント開催のご案内

2、イベント参加のお申込み受付

3、イベントに参加して頂いた方へのお礼(報告)

イイ感じですね。かなりの覚悟がいるかも(笑)

 

デザインに必要な「テーマ」と「ロゴ」をみんなで決めました。

同窓会の運営委員会、なんとみなさんボランティアです。

伝統的に各チームに分かれて、いろいろ準備していきます。また、東京の同窓会と、地元(札幌)の同窓会と、それぞれ年に1回、イベントがあるのでそれぞれで、運営委員会が結成されるそうです。

みんなで、楽しくやろうね(笑)

ということで、「テーマ」については、東京チームの企画案で、「ロゴ」については、地元(札幌)のセンス良いデザイナーの方のデザイン案で、共通「テーマ」「ロゴ」として決まりました!

めっちゃイイ感じです。楽しくなってきました♪

 

ホームページを制作していきます。いろいろセットアップ!

ホームページを制作するにあたって、次の世代に引き継ぐことも考えて、最小限のコストで制作・運営することにしました。

今まで、私の個人ブログを運営している経験とノウハウを生かして、今年と同じWordPressを使ってホームページを制作していくことにしました。

IoT BoY Shinagawa
【新着記事一覧】 【ごあいさつ】 みなさま、はじめまして。IoT BoY Shinagawa に、ようこそおいでいただきました。 流星が、ある日突然、「ぼく、プログラミングの習い事やってみたいんだよね」と、学校からもらってきた、LITAL

気合をいれて(笑)、こちらをセットアップしていきます。

1、データを置く、サーバーを決定

2、ドメイン取得

3、SSL設定(セキュリティ対策)

4、設定用アカウント取得(@gmail.com)

5、サーバーにWordPressをインストール

6、WorfPressにデザインテーマを設定(Cocoon)

7、各種コンテンツ用データ(画像、テキスト)を準備

8、各種ページを制作、設定

9、WordPressのプラグインを設定(お問い合わせフォーム)

10、SEO対策で、検索エンジン上位に掲載されるようにガンバル
・Cocoonで表示を高速化(トップページにAMPを設定)
・WordPressのプラグイン設定
・Goole Analystics に登録
・Google Serch Console に登録

調子に乗って、楽しくめいっぱいやってしまいました(笑)

もちろん、コンテンツの制作は、同期のみんなと協力して、画像データや告知内容、あいさつ文をもらいなから、ホームページを制作しました。

みんなで協力したから、なんとか完成できました!

 

こちらのホームページで、設定ノウハウをまとめてます。

▼ ご興味のあるかたは、ご参考までにどうぞ ▼

エックスサーバーでオリジナルドメイン
こんばんは!もう少しで。2017年もおしまいですね。年末の火の用心の声も聞こえてきます。ことしもありがとうございました。オリジナルドメインすげぇいいじゃん!ブログをオリジナルドメインで運営できるとカッコイイですね。オリジナルドメインは、世界
ブログ戦記1 WordPressでブログしたいね
こんばんは。ブログをはじめて、1ヵ月が経ちました。子どもがIoTで楽しく遊んでいる様子をレポートするのは、ぼちぼち続けることとして、ブログをはじめて、いろいろと経験値がたまってきましたので、ブログ運営の話をのっけていこうと思います。Word
(3G)読込時間 3秒! WordPressテーマ「Cocoon」が凄いぞ♪
今日(3月27日)はサクラの日です。サクラの花、毎年キレイですね。 WordPressのテーマを「Cocoon」に変更しました!サイトの雰囲気を変えたいと思って、「Cocoon」の親テーマと子テーマをインストールして、ホームページをリニュー
超簡単!お手軽ロゴデータの作り方
こんばんは!先日のハワイと今日の誤報。誤報でよかったですね。一瞬ドキっとしましたが。大丈夫です。よかった♪よかった♪パワーポイントとペイントでお手軽ロゴデータが作れます!このブログで使っている、タイトルのロゴデータですが、画像データは超簡単
お問い合わせフォームを作ったよ! reCAPTCHA v3 でスパム対策もバッチリ♪
みなさん、こんばんは!明日はクリスマスイブですね♪ 気前よく盛り上がっていきましょう! オウンドメディアへの第一歩お問い合わせフォームを作ったよ♪実は皆さまのおかげ様で、今回なんと91記事目となりました。遊びに来て頂いている皆様から応援して
初めてのSEO設定!WordPressのブログで楽しんでいます。
みなさまこんばんは!昨日のトップページ表示の高速化に引き続き、今日は、WordPressのSEO設定で楽しんでいます。 トップページの表示スピードがなんだかとても早くなったぞ!昨日、EWWW Image Optimizer で、データを最適
3.2秒でトップページの高速表示に成功!オススメのWordPressプラグイン。 
みなさま、こんばんは!今日は突然の大雨とカミナリでびっくりでした。ギャラクシー★メテオがつくったバンブルビー(もちろん変形するぞ!)これは、バンブルビーです。ギャラクシー★メテオがレゴで作ったオリジナル作品です。このフォームは、クルマモード

このホームページの制作にめっちゃ役立った本をご紹介します。

いろいろな方にご協力を頂きながら、ホームページは無事セットアップ完了しました!

SEO対策もうまくいったみたいで、おかげさまで検索エンジンの上位に上ってきてます。

やっぱり、Googleさんと仲良くさせて頂くのがイイようです(笑)

 

また、最新情報を更新していく、こちらのページを作成しました!

サイドバーに、運営委員会ツイッターの最新つぶやきも表示されるようにして、みんなで楽しくやっていきたいと思っています♪

ワクワクするね!

 

最後に、このホームページの制作にめっちゃ役立った本をご紹介します。

この画像には alt 属性が指定されていません

こちらの本です!

WordPress の新エディター Gutenberg の使い方が、とても分かりやすく書いてあって、応用しやすかったです。

助かったなぁ。全力でオススメします!

 

最後まで読んで頂いて、ありがとうございます。

 

今回のレポートは、以上です。

引き続きよろしくお願いします。

コメント

タイトルとURLをコピーしました