チョモランマに登るには。

Androidアプリ開発の初心者が立派な開発者になるまで

初心者がおしゃれなサイトを目指してみた。

こんばんは。

早くアプリも作れるようにならないとなということで、開発環境を四苦八苦しながら構築してる私です。

最近色々と作業が雑になってやりっぱなしで済ませてしまっているので、少し振り返ってメモしておこうと思います。

 シャレオツなサイトを作りたくなった。

最近は就活のための個人ページを作っていましたが、本当の目的は「なんか自分もシャレオツなページ作ってみたいなぁ」というものでした。

jQueryやbootstrapを一通り使ってみると、なんかいけそうな気がしたんです。

でもそんなにアイディアもないし・・・じゃあ自分自身のサイトを作ればいいっか、ということで作り始めました。

自分にとってシャレオツなサイトとは?

1、なんか縦に長くてどんどんスクロールしていくサイト(パララックス)

2、画面いっぱいにおしゃれな写真が表示されてる。

3、その写真の上にでか文字。

 

1、パララックス

自分にとっておしゃれな感じ=パララックスでした。

「パララックス jQuery」で検索するといっぱいでてきました。例えばこちらのまとめとかすごい参考になりました。ありがとうございます。

無料のスクロール/パララックススクロール系jQueryプラグイン24 | co-jin

 

一通り見て、試してみて、これだ!と僕が決めたのは、こちら。

fullPage.js One Page Scroll Site Plugin

 

デモを触ったときに「おおっ!」と思ってすぐ採用を決めました。

で、すぐに「fullpage.js 使い方」とかで検索して先生を探しました。

jQueryプラグイン fullPage.js フルページスクロールするサイトを簡単につくる - Three.jsを使って、作ってみた

とてもわかりやすくて簡単に導入できました。ありがとうございます。

2、シャレオツな写真素材

これは、はてブを始めておいてよかったなと思いました。

毎日テクノロジーのカテゴリを見るようにしてて、そこで見つけた写真素材サイトのまとめをブックマークしていたんです。助かりました。

完全無料!ロイヤリティーフリーの写真素材をダウンロードできるサイト12個まとめ - Photoshop VIP

ここからとにかく自分の触角が動く写真をとにかく保存していきました。

3、でか文字

写真の上に白文字でデデーンと載ってるあれですよね。

でも<h1>ですら全く小さい・・・。

検索すると教えてくれる神様がいました。ありがとうございます。

Web サイトに巨大なテキストを描きたい | アカベコマイリ

 

完成

以上3つの個人的シャレオツ要素をまとめるとこんな感じになりました。

IEだとちょっと表示おかしいかもしれません。)

fullpageを使ったサンプル

どうですかね?シャレオツになってればいいんですが。。

 

web業界ってセンス問われるなぁと思うこの頃です。

ありがとうございました。