架空メディアサイト「256times Media」(256timesで制作)

架空メディアサイト『256times Media』

<トップページ>
https://dotinstall-playground.s3.ap-northeast-1.amazonaws.com/production/urjsroc68jp4/711998/1691470887/index.html

 

<記事ページ>
https://dotinstall-playground.s3.ap-northeast-1.amazonaws.com/production/ri2gpd6vdwlh/711998/1691471692/index.html

256timesで制作

担当内容

HTML・CSSコーディング

経験

HTML・CSSコーディング / JavaScript実装(jQuery)

概要

オンラインのプログラミング勉強会を手掛ける 256times が、初学者向けのメディアサイトを始めることになりました。

IT用語をやさしく解説するためのメディアサイトです(ニュースサイトやブログのように、記事が並んだサイトです)。

レイアウトなどを参考にしたサイトは以下です。
<Qiita>
https://qiita.com/

レスポンシブに対応しました。

クラス名は、CSS設計方法論のBEMを参考にしております。

制作期間

4日間

制作にかかった時間

7時間20分

制作のポイント

メインコンテンツ

・PC版レイアウトは、参考サイト「Qiita」を例に3カラムにしました。
・記事一覧を先に読み込ませるため、マークアップではサイドバーより先に記述し、
 CSSのorderプロパティで順序を設定しました。

右サイドバー

収益化のため、バナー広告を縦に並べてみました。

制作費用の見積もり

WordPress化も制作したと仮定しての見積もりです。
シミュレーターを使用して計算しました。

・ヘッダー 5,000円
・フッター 5,000円
・記事 30,000円
・オリジナルテーマ制作 40,000円
・検索機能 30,000円
・お問い合わせ機能 15,000円
・お知らせ機能  15,000円
・ブログ機能 15,000円
小計 165,000円
消費税 16,500円
合計 181,500円

PAGE TOP
タイトルとURLをコピーしました