現時点ではまだまだウェブサイトとしてはコンテンツが全く入ってないのでウェブサイトとしてはなりたっていませんが、見た目と形は少しずつ手を加えていっています。
既にこのAEDIタイムズのウェブサイトへのWordPressの導入は終えていて、このテキストもワードプレスから打ち込んでいるわけですが、WordPress前までのトップページのデザイン後のHTMLのモックアップがありますので下記のリンクからご確認ください。
(現在このウェブサイトは内容がまだ少ないですので少し変更しています。)
https://www.aeditimes.com/demo/home20160926.html
また、ここまでのウェブサイト制作のここまでのプロセスをみるとこの様な感じになります。
-
- ウェブサイトのデザインをする
- 紙に手書きのデザインをした後、Photoshopでデザインをブラッシュアップしてデジタル化します。
-
- PhotoshopからHTMLに
Photoshopのデザインを元に、このようなHTML + CSS + JavaScriptの本来のホームページの元となるこのようなウェブページを制作します。
-
- デスクトップ用のウェブサイトだけでなく、タブレット、スマホにも対応
- このページはウィンドウを拡大縮小してみていただくと分かりますが、デスクトップやタブレット、スマートフォンに対応したレスポンシブデザインを採用しています。
-
- WordPressへ
- このウェブサイト制作用のモックアップを制作した後はWordPressにこれを流しこんでいきCMSとして機能させるようにします。
今回はBootstrap V4 Alpha4での構築です。実のところBootstrap V4は初めてではありませんが、最近はV3ばかりでしたので、久しぶりにさわってみると戸惑うことが多かったです。先日V3の開発も終わったのようですので、これからはV4、そしてまずは自社サービスでV4をテストしながらクライアントワークへという感じです。
あとは見た目も今まで通り手を加えながら、コンテンツ(ここが肝心…)を入れてウェブサイトを作っていきます。