アミアンインターナショナル

貴社の売り上げアップをとことん支援します。オンラインショップ専門コンサルタント

CMS css コンテンツ 新着情報

cssで2段組にする方法 ⇒ トップページの作り込み7

投稿日:

さらにコンテンツを増やす

引き続き、コンテンツを加える。

このブロックは、2段組にする。

<div id="amiens-07" class="amiens-black">
<div class="amiens-1060w">
<h2>あなたのショップが成功しない理由</h2>
<div id="amiens-07-wrapper">
<div id="amiens-08-01">
<h3>成功しているショップのマネをしても売上が上がらない理由</h3>
本を買って読んだり、インターネット上の情報を集めていろいろ試しているのに、売上が伸びない。それは、当然です。なぜなら、本の中に方程式はないからです。

ユニクロが大企業に成長しましたが、今から同じ事をしたらユニクロと同程度の企業を作ることができるでしょうか?成功体験を知ることは大切ですが、それを真似ても成功するとは限らないのです。ですから成功しているショップのマネをしても、売上は上がりません。

</div>
<div id="amiens-08-02">
<h3>コンサルタントが有効な理由</h3>
成功企業の軌跡には、その企業独自の事情やその時代だったからこその環境要因が大きく作用しています。ですから単純に真似てもダメなのです。大切なのは、成功したエッセンスを理解すること。その上で、成功する確率の高い施策を実行し続けることです。

まずはあなたのショップに通用する成功の方程式を見つけること。そして、それを継続していきましょう。そのお手伝いをするのが、コンサルタントです。

日々の仕事が忙しいショップスタッフには、なかなかこうした事は難しいのが現実です。ルーチンワークでないことはプロに任せて、ショップスタッフはお客様対応に全力を注ぐべきなのです。

</div>
</div>
</div>
</div>

wrapperで包んで、flexboxにする。

cssはこちら。

.amiens-1060w h3{
box-sizing: border-box;
border: 1px solid #ccc;
padding: 1em 2em;
margin: 100px 0 30px;
text-align: center;
width: 100%;
color: #aaa;
}
#amiens-07-wrapper{
padding: 0 1em;
}

タブレット表示の時に、2段組にする。

@media screen and (min-width: 600px){
#amiens-07-wrapper{
display: flex;
}
#amiens-07-wrapper div{
margin: 0 0 50px 0;
width: 50%;

}
#amiens-07-wrapper div:first-child{
margin-right: 20px;
}
}

次のブロックは段組を解除し、600px幅で表示。

<div id="amiens-08" class="amiens-black">
<div class="amiens-1060w">
<h2>他社のコンサルティングがうまくいかない理由</h2>
<div class="amiens-600w">

世間には「モノやサービスを売る」経験のない人がコンサルタントと名乗っているケースをよく見かけます。これではうまくいくはずがありません。

ホームページ制作でも同じです。学生時代に友人からセンスがいいと褒められ、デザインが大好きで専門学校に進学し、新卒でデザイン会社やweb制作会社に就職した。そんなデザイナーが、たくさんいます。確かに、きれいなホームページを作ってくれます。最近流行のデザインを取り入れ、見た目に華やかなホームページができあがってきます。

でも、全然売れないのです。

なぜでしょうか?

当然です。社会経験が足りないのです。確かにデザインの知識は豊富でしょう。専門学校で理論を学び、多くのデザインに触れ、センスもあるのでしょう。でも、それだけです。モノやサービスを売る、という経験が皆無か、圧倒的に少なすぎるのです。もちろんマーケティングの知識もありません。

こんなデザイナーが作ったページで、売れるでしょうか。商売は、そんなに甘いものではないのです。

こうしたケースは、とても多いのです。きれいな、けれど売れないホームページを押しつけられて悩むショップを見る度に、胸が痛みます。高額な制作費用を支払った上に、赤字続きのショップを運営するしかない。なんと悲惨なのでしょうか。

それもこれも、コンサルタントと名乗りながら、単なるサイト制作でお茶を濁しているコンサルティング会社がほとんどだからです。ひどいところになると、住所や電話番号さえ自社のホームページ上で公開していない会社があります。これは詐欺ですよと、自分で言っているようなものです。こんなコンサルタントに騙されてはいけません。

</div>
</div>
</div>

表示に変化を付け、文字だらけのページのテンポを変える。

これで少しは読む気になるかも知れない。

-CMS, css, コンテンツ, 新着情報
-,

執筆者:

関連記事

フェイスブック

Facebookページのiframe化にチャレンジ

Facebookでビジネスをするのに欠かせない独自タブを作るには、従来はstaticFBMLを使ってきた。 これはこれで簡便で使いやすかったのだが、3/10で使用できなくなる。 これからはstatic …

Evernote

evernoteにwebページをクリッピングする便利な手法

みんな大好きevernote! 数あるクラウドサービスの中でも、特に利用者が多いと思われるのがevernoteだ。 片っ端からメモしていけるので、私はなんでもかんでもブッ込んじゃってる。 Everno …

jetpack関連記事

jetpack関連記事とwordpress関連記事タイトルの修飾 ⇒ STINGER8設定その13

修飾を合わせる コンテンツエリアを見ると、jetpack関連記事とwordpress関連記事タイトルが手つかずになっている。 これをH2と同じフォーマットにする。 ついでに全てレスポンシブ対応にする。 …

中小機構セミナー

高松でセミナー講師として8月7日登壇します

下記要領で開催されるセミナーの講師として、登壇することとなりました。 GMOメイクショップ株式会社代表取締役社長の向畑憲良様と一緒にお話しさせていただきます。 今回はまだネットショップをオープンしてい …

fontawsome

ピクトグラムでアイキャッチfontawsomeで簡単設定 ⇒ トップページの作り込み3

ピクトグラムとは 東京オリンピックの話題でも取り上げられていたが、近年はピクトグラムの重要性は増すばかりだ。 ピクトグラム(英語: pictogram)あるいはピクトグラフ(英語: pictograp …