長野県長野市・松本市ウェブ制作事業部 コンサルテイングFARM

苦労して実現していたものがCSS3で簡単に

ATFコンサルティングFARM

ATFコンサルティングFARM

マーケティングがあなたのビジネスの目標達成を支援します。

HubSPot+ ATFC担当に相談する

Internet Explorer 9の登場

今年の4月にInternet Explorer 9が公開されたことで、WEB制作現場において本格的にHTML5+CSS3の使用が浸透してきたことと思う。
HTML5やCSS3を実装することでよりダイナミックなWEBデザインが可能となり、HTMLはこれまではプログラム言語として認識されていたものが、WEBアプリ開発言語として様相を変えつつある。

レンダリングエンジンを有効活用

さて「2」から「3」へと進化したCSSだが、私はIE9デビュー以前から意欲的に導入していた。
と、言ってももちろんそれによってマークアップを激変させなければいけないような手法や、それひとつでブラウザによって著しく表示に差異が生じるもの、また本来デザインによって伝えなけれえばならないことがぶれてしまうような使い方はもちろんせず、あくまで「許せる程度」で、である。実験的にという意味合いもあり、いろいろ試してはきたが、今回紹介するのは「border-radius」だ。

既にCSSにおいてお馴染みとなっている「border-radius」だが、多くのモダンブラウザでは早くからHTMLレンダリングエンジンでサポートされていることもあり、あまり躊躇なく導入することができていた。角丸をフレキシブルなボックス等に容易に実装でき、ドロップシャドウなどと併用することで簡単におしゃれなボックスが出来てしまう。

-moz-border-radius: 5px; ←Mozilla
-khtml-border-radius: 5px; ←Safari
-webkit-border-radius: 5px; ←Chrome等
border-radius: 5px;

その昔は、上辺と底辺の角丸画像を入れたdivを2枚重ねにしたり、
角丸
こんな角丸画像を四方に置いたり、角丸にしたいがばかりに四苦八苦したものだった。

今後CSS3ではモジュール化が進みこれまでよりも、より自由度の高いユーザエージェントとの関わりを持たすことができる。
今までは「このくらいは…」という気持ちで使っていたものが、大胆に導入していくことができると思うとわくわくしてたまらない。

SNS

Share on facebook
Share on twitter
Share on linkedin

工務店様のサイトリニューアル

有限会社タカギプランニング様 採用Webサイトへ 安曇野市の工務店様のサイトリニューアルweb design (ウェブデザイン PC用) 住宅モデルハウスの完成に併せ、サイトリニューアルのご依頼をいただきました。モデルハ

ブログを読む »
ホームページで売上を上げる魔法の言葉

ホームページで業績を上げる魔法

よくWeb製作者の声を聞くとWeb 2.0だ、CGMだ、AjaxだとかWordpressやDB、そしてLPなどの言葉が聞こえてきます。しかし、そんな話はWeb屋さんなどの業界の話で、地方の中小企業の経営者やウェブ担当にと

ブログを読む »
DX

スマホを核とした小売業のDXこそチャンス!

スマートフォンを核としたDXはリテール(小売業)マーケティングとして他社との差別化・効果性・効率性・サービスの質の向上に役立ちます。それは、コトラーのリテール4.0 デジタルトランスフォーメーション時代の10の法則を読め

ブログを読む »
松本市ホームページ制作

工務店・リフォーム会社のお盆WEB戦略「このときユーザはホームページであなたの会社を探します!」DX推進してみましょう。

工務店・リフォーム会社のお盆WEB戦略 「このときユーザはホームページであなたの会社を探します!」今からでも遅くないDX ウェブ制作の仕事を長野県で初めて10年以上、Googleアナリティクス(アクセス解析)を観察してい

ブログを読む »