2015年 3月 の投稿一覧

Bootstrap+αでポートフォリオ的な何かを作ったよ

スクリーンショット 2015-03-23 10.58.08
移転前のブログの記事のこの辺からこの辺とかこの辺の話なのですが、以前から言い続けてやや口だけじゃないかと言われかねない状況になっていたポートフォリオのページが、ややまとまってきたのでアップロードしました。
まだまだ未調整な部分もあるのですが、一応メールはここから送れますので、よろしければぜひご利用下さい。
Portfolio BowWorks

また後ほど、作業の間に考えたことと学んだことなどをまとめておきたいと思います。

JimdoとOwndの編集画面を覗いてみる。

Owndのようなサービスで、日本でよく知られているのが、WiXJimdoだと思います。
どちらも国産ではなく、WiXはイスラエル製、Jimdoは韓国製だそうです。

国産でもこういったサービスは、ひょっとすると既にあるのかもしれないのですが、サイバーエージェントのような大手IT企業がリリースしたサービスは、他にはないはずです。
そういった意味で期待が高まるOwndですが、実際の操作感は使ってみないとよくわからないと思います。
そこでKDDIがサポートしていて国内では多くのユーザーがいるJimdoとの編集画面と少しだけ比較してみましょう。

WiXを除外した理由は、レイアウトこそバリエイションに富んでいて綺麗なデザインのサイトが出来そうな期待はできますが、実は既存のテンプレートをチューニングして使うにしても、新しくデザインを起こすにしても、操作が煩雑で初心者には難しいと思えるからです(つまり初心者向けとは言いがたいと個人的には思いました)。

逆に言えば、OwndとJimdoは操作に不慣れな人でも、比較的簡単にコンテンツを編集できる様に思えるのです。

Jimdoの場合

jimdo_sample_002
前の記事でも少し書きましたが、Jimdoの場合、基本的に編集する画面は、全体に公開される画面とほぼ同じものになっています。
今回サンプルで紹介しているのは、僕が作らせていただいたサイトで、名古屋の池下にあるトルコ料理の食べられるスポーツバーのBlueStarさんのWebサイトです。
実際のWebサイトはリンク先を見ていただくとして、そのトップページを仮に編集してみた場合の操作を追って説明しましょう。

JimdoとOwndの共通するところの一つに、文章や見出しなどのパーツを、挿入可能な場所に挿入することで、ページを組んでいくという操作感があると思います。
Jimdoの場合、先に挿入したい場所にマウスを持って行くことで、画像のように「コンテンツを追加」という表示が出てきます。
一見自由度が低く見えるので「思った通りのページなんてできないんじゃないのか?」と思われがちですが、逆にその制限のあることで、コンテンツとして成立しやすくなるというメリットが存在します(個人的にWiXがチューニングしにくそうに感じるのは、この辺の問題もあると思います)。
これはOwndでも言えることです。

jimdo_sample_003
「コンテンツを追加」をクリックすると、画面のように追加できるコンテンツが表示されます。
この画像で表示されている他にもGoogleMapを追加したり、メールフォームを追加したり、様々なSNSへのリンクボタンを表示するなどが「その他のコンテンツ」と書かれている部分に隠れています(クリックで表示されます)。
実はHTMLを直打ちすることもできるので、やや細かい感じのカスタマイズできそうです。

jimdo_sample_001
逆にそのパーツを削除する場合や、位置を変更したり複製する場合は、画面上にわかりやすく操作パネルがありますので、それをクリックするなりドラッグするなりして操作ができます。

このように、初心者でもわかりやすく工夫されているため、試行錯誤していれば操作が身につき、自分で管理することでWebサイトへの愛着も湧きやすくなるというメリットも期待できるでしょう。
Wordpressの弱点は、こういった「取っ付き易さ」が足りないことで、これはオープンソースのCMSに共通する欠点だとも言えます。
最近ではconcrete5というCMSが比較的取っ付き易い感じには出来上がっているようですが(まだ僕自身は使っていないのですが、機会があったら試してみたいと思ってます)、まだまだJimdoのような操作感は実現できていないのではないかなと思います。

Owndの場合

こちらは、試しに制作しているものの管理画面のスクリーンショットです。
ownd_sample_001
Owndの場合は、Jimdoと操作の手順が逆になります。
まず、左のメニューから、追加したいパーツを選択します。
追加できるパーツ自体はあまり多くありませんが、興味深いのはAmazonや楽天の商品を挿入できることです。
楽天の方はちょっとわからないのですが、Amazonの場合はアソシエイトのIDをURLに追記すれば、アフィリエイトなども可能でしょう。
HTMLを直に書くことはできないようです。

ownd_sample_002
追加するパーツをクリックして、マウスを編集画面の方に持って行くと、パーツと同じアイコンがマウスに追随して動きます。
これは「今自分がどんなパーツを追加しようとしているか」がひと目でわかるので、使いやすい機能だといえるでしょう。
そして、その時になって、追加の可能な場所がわかる(追加可能な場所に「ブロックを追加」という表示がされるため)ので、これもわかりやすいです。

ownd_sample_003
パーツを削除する場合は、削除したいパーツにマウスを合わせると、右上にゴミ箱が表示されますので、それをクリックすると削除することができます。
また、画像を準備し忘れたのですが、パーツの上部中央にマウスを合わせると、「クリックして移動」という表示が出て、パーツを移動できるようになります。
これらのUIもとてもシンプルで、わかりやすいのではないかなと思います。

比べてみると……?

比較すると、OwndはJimdoよりも手軽ではありますが、できることは制限されているように思えます。
恐らくそれはターゲットとなるユーザー層の違いもあるのでしょう。
Jimdo自体も、パソコンのスキルやインターネットのスキルの高くない方向けのサービスですが、Owndは更に敷居を低くして、誰にでも利用できるようなサービスを目指しているのではないかなと思います。
ただ、その結果として「かゆいところに手が届かない」感じがするのも事実で、凝り始めるとJimdoの機能の豊富さがありがたく感じるかもしれません。

どちらも無料なので、使い比べてみると面白いかもしれませんね。

AmebaのOwndがリリースされたので、早速登録してみた。


偶然にもこのブログの最初の記事が、本日リリースされたAmeba Owndの話になるわけなのですが、実を言うと、先日サービスの話を知ってからOwndのことをすっかり忘れていて、偶然今日、「そういえば今日からリリースだったよね!?」と思い出した次第です。
で、早速登録して少しいじってみたのですが、操作感やターゲットはどのへんか的な話と、じゃあ今後Web制作はどうなるのか的な話を、ざっくりと僕の目線から書いてみようと思います。
続きを読む

Hello world!

WordPress へようこそ。これは最初の投稿です。編集もしくは削除してブログを始めてください !