column

フェリカテクニカルアカデミー「東京・池袋」求職者支援訓練|Webサイト制作科|受講生の作品で紹介されました

CATEGORY TQS宣伝広告 TAG, ,

投稿日:2013年6月19日 更新日:

執筆者:

フェリカテクニカルアカデミー「東京・池袋」受講生作品で紹介されました。

求職者支援訓練|Webサイト制作科|受講生の作品

http://www.felica.info/kikin/web/works.shtml

受講生作品Tokyo Q Studio

WEBクラス卒業生

Tさん

在学中に制作したポートフォリオサイトです。デザイン性が高く、javascriptも効果的に使用出来ており、スキルを十分にアピールできています。ページを実際にご覧になればわかりますが、デザインがよにかくいいですね。とても素晴らしいできです。サイトを見る

被リンクを調べていたらリンクされていました。

とても嬉しい事です!

製作背景

製作時は様々なパターンのトップページを製作しました。

3パターン目にParallaxを試していたら閃いたと言う感じです。

 

構成は

  • Parallaxトップページ
  • Adobe Muse使用のポートフォリオ(Web・DTM・リンク集)
  • WordPressブログサイト

の3部構成です。

 

何故この様な形にしたかと言うと、WordPressをトップに持ってくるとPlug-inを増やして行くごとに表示スピードが格段に落ちると言う事です。

これではトップページから表示速度が遅く離脱率が上がります。

トップページは通常のHTMLで作っておくことでスマホでの表示も軽くなり、ブログを見たい人はその後の展開と言う事です。

その為WordPress側はカテゴリーフィルターを搭載したテンプレートを選択しています。

背景やデザインの方向性を同じにすることで違和感が無く、尚かつ自分がどこにいるかも明確になりやすいと考えています。

同じレイアウトだと飽きるかも知れないと考えました。

 

  • トップはあくまでも「about」的な存在
  • ポートフォリオは動き込みで見やすい構成
  • ブログは見やすく読みやすいシンプルで検索がしやすい構成。

 

これが私の考えるわかりやすいWebサイトだと思っています。

 

Parallaxの導入経緯

昨今Webでは企業サイトに標準化されるような動きが多いように思えました。

動きも少なく情報のみを見やすいレイアウトで見ていても面白味がない。

その方が良い部分は多いのは理解しています。

しかし、私は今後はCSS3の標準化で動きを伴った「見やすいサイト」が生き残る要因になると考えています。

実際動きや企画の面白さで若い会社がドンドン排出され世の動きを加速させる起爆剤になっているように思えます。

日本を今一度元気な経済状況に戻すためにもこの様な動きは必要であると考えます。

なので立体的に見えるParallaxを導入し、1ページごとに部門を分けた構成にしました。

スマホ対策も忘れてはいません。

スマホで次ページに移れなくなる仕様なのでボタンをスマホ用にCSS3で書き換えています。

スクリプト上最上部からスクロールしてしまいますが、そこは後日勉強が進みましたら修正致します。

 

Adobe Museの導入経緯

Web製作はスピードが命です。

その為通常のコーディングだけでは時間的に難しい案件も出てくるであろうと考えていました。

事実世の中にはコードが書けなくてもWebページを製作することは可能なアプリが沢山あります。

その中でもAdobe MuseはIllustrator等Adobe製品を使うことが出来ればかなりの事が出来るようになっていました。

ソースコードでのアウトラインもほぼ合わせることが出来、十分にアクセス数は稼いでいます。

VersionがCCになればParallaxも出来る仕様になり、可能性はもっと増えてきます。

時間と費用対効果を考えMuseを使えるようにしたかったのです。

WebFontにも対応しており、デザインWebサイトを作る際には楽しく作業出来ます。

 

WordPressブログの立ち位置

WordPressブログではスマホから投稿出来るシステムを組み、後日カテゴリーやタグを編集することでSEO対策を施します。

内容はWeb関係・家電・PCパーツ等のテクノロジーを中心にニュースサイトから転載しています。

素早さが全て。時間の少ない現代社会で移動時間だけで3〜5投稿出来れば更新が終わったも同然です。

1日1回以上投稿することで頻繁に更新していることがGoogleに通知されます。

SEO的にも動きが多いとアクセスも増える。

表示順位も重要ですが、入口を増やし入りやすくするのが目的です。

実際、「iPhone5s スペック」でGoogle・Yahoo!共に常に上位ランカーです。

ブログを始めて3ヶ月で1324記事。

818記事/1,324記事中がGoogleで1ページ目に表示されています。

1ページ目へのヒット率60%以上。

素晴らしい結果だと思いませんか?

上記の理由で製作致しました。

Webは言われて作るだけでは今後難しいと考えます。

自分から率先して考え、盛り込めるようなスキルを付けて行きたいと思っております。


コメントを残す

関連記事

PREV

Tokyo DTM製作で1位!

NEXT

CSS3でギザギザの線をかくテクニック

フェリカテクニカルアカデミー「東京・池袋」求職者支援訓練|Webサイト制作科|受講生の作品で紹介されました

side bar

メニューはこちら

メニューはこちら