こんばんは～四ツ屋です。
さて、今回はWIXを使ったWEBサイト作成について、お話しようと思います。
ミトコンドリア110k文庫の灰島さん主催で、ホラーアンソロジー本を発行いたします。
mitochondria110k.com
告知や紹介などのサイトづくりをさせていただいたので、ざっくり説明します。
ちなみに四ツ屋のホームページ作成能力は下記程度。
・高校時代にタグ打ちしながらホームページ作成
・大学時代以降でブログ作ったり、CSSを使ったサイト作成
・一社目でテンポのホームページをDreamWeaverで更新作業
・三社目でWordPressでの更新作業
この程度なので、サイト作成は初心者の域を超えてません。
ざっくりと、アンソロ企画サイト作るまでのはなしです。
WIXってなんなん？
無料でWEBサイトを作れるサイトです。（ババーン）
ja.wix.com
記載されているように、プログラミング不要、サーバなどを借りる必要もないです。
必要なのは「どんなサイトを作るか？」ということくらいです。
準備するもの
WIXを使うにあたって必要なのは
・登録用メールアカウント
・サイトに掲載するコンテンツやサイトの名前
これくらいですかね。ほんとに何もいらないです。
ある程度はフリーで使える画像も準備されているのと、画像加工のツールもあります。
簡単な加工程度は可能なのでちょっといじりたい、くらいなら問題ないでしょう。
めんどくさかったこと
かなり簡単だったので、めんどくさかったことって本当に少しだけです。
覚えてるだけ書き起こしておきます。
いやー、これが一番面倒くさかったです！（笑）
試行錯誤しました。
基本的にTwitterへのシェア投稿箇所についてはタグ埋め込みの記事ばっかり。
WIXだとWordPressのようにタグを手打ちして埋め込みがぱっと出来なかったので、基本aタグの中身をごりごり書いてパラメータにほしい情報を埋め込むしか出来なかったです。
サンプルコードを下記に置いておきます。
http://twitter.com/share?text=【ツイート文】&url=【共有するURL】&hashtags=【ハッシュタグ】
めんどくさい第二位、ヘッダとフッタ
WIXではヘッダとフッタを設定して全ページにパーツ表示ができます。
しかしインデックスページには表示させたくない、その方法を探すのが大変でした。
方法ですが、ページ設定にヘッダ・フッタの表示/非表示を切り替える設定がちゃんとあります。
レイアウトのタブでスタンダードかシンプルが選択可能となっており、シンプルを選択すると、ヘッダとフッタが非表示になります。
この方法に辿り着くまでにかなり回り道をしまくったので、もしかしたら次はもっと時間をかけずにサイトが作れるかもしれません。
めんどくさい第三位、スマホサイト
スマホ！これも大概面倒くさかったです。
基本的にはWIXがPCサイトのレイアウトから最適化されたスマホ表示を自動生成してくれるんですが、それだとスマホでは見づらい。
なのでスマホ用のレイアウトで修正が必要になるのですが、できることといえば、
・各オブジェクトパーツの位置を変更する
・テキストのレイアウト位置を変更する
・テキストの大きさを拡大/縮小する（フォントや色の変更は不可）
・スマホの場合にのみ非表示にする
このくらいですかね。かなり制約されてしまいます。
とはいえ、スマホで大幅に変更しない限りはこれでも十分ですが。
サイトのページ名
サイトの各ページのページ名は設定したほうがいいです。
レイアウトと同様にページ設定の「SEO & Social」から設定が可能です。
初期値は入っていないようなので、ページアドレスの箇所を適切なページ名にしておくと良いと思います。
そのほか覚書
アクセス解析については、ドメイン接続してGoogleAnalyticsになるようです。
自前のツールはないようです。
ブログ機能
同じレイアウトで複数の記事をアップするならブログ機能がいいかもしれません。
今回使わなかったので、もし次回WIXを使うようなケースがあれば使ってみたいです。
今回はいいかーと思って放置していますが、必要なら直接提出するそうです。
美貌のために記事リンク貼っておきますね。
https://support.wix.com/ja/article/google-%E3%81%AB%E7%9B%B4%E6%8E%A5%E3%82%B5%E3%82%A4%E3%83%88%E3%83%9E%E3%83%83%E3%83%97%E3%82%92%E6%8F%90%E5%87%BA%E3%81%99%E3%82%8B
アンカータグ
画面の表示上、前方数文字しかデザイン画面に表示されないので、長い名前をつけるとあとで後悔します。（後悔した）
とはいえ、ドラッグアンドドロップでアンカーも好きな位置に移動できるし、リンク先にアンカー位置が簡単に指定できるのは良かったです。
トップページをオシャンティなロード表示したい
今回はjQueryを習得していないので断念したんですが、こう、映画の番宣みたいな感じでおしゃれなロード画面をつけてみたいなーって話を主催としてました。
結局実装してないのでわからないんですが、jQueryが習得できたらやってみたいです。
newstella.co.jp
なんかレイアウトが崩れるよ事件
そうそう。画面幅を変えるとなぜか一部のヘッダに置いてあるオブジェクトがレイアウトが崩れる事件がありました。
これは最終的に、ヘッダーに置いてたはずの一部のオブジェクトがヘッダに含まれておらず、グルーピングできてなかったことが原因でした。
オブジェクトをグルーピングするにはヘッダならヘッダ、フッタならフッタに置いた上でグルーピングする必要があります。
このとき、場所はヘッダっぽい位置にあっても実際はヘッダに含まれてないケースがあるので要注意です。
ところで余談なんですけど、「ヘッダー」？「ヘッダ」？どっちなんでしょう。
サーバーは「サーバ」プリンターは「プリンタ」派なのでヘッダかな、と思ってるんですがWEB業界のひとじゃないのでどちらが主流なのか。（笑）
とりあえず、触ってみると面白いよ！
今回、アンソロの告知ページなのでそこにコストかけるのもなーってことで無料のWIXを使ってみました。
いまのところ自前のサーバを持ってないので。
とはいえ、いつか自前のサーバ確保してWordPress構築してみたい野望もあります。
アンソロ告知だと簡単な構成でかつ変化がないこともあり、WIXでまぁ妥当だったかという気はします。
これがいまみたいな技術ブログとか、そういうものだとブログ機能でどこまで補えるのかによりますね。
今回、ざっくりと一通り構築してみたのでネタにしてみました。
よつやTipsで需要があるかはわかんないんですけど。（笑）
また何か面白いツールさわったら紹介しますね！
↓ホラーアンソロジー「Sanctuary」告知サイト
sanctuaryeldorado.wixsite.com
