SKILL MEMO: 2008年アーカイブ

各ブラウザの初期設定のCSSをクリアにするなどの、基本設定をするためのCSSです。
ホームページを新たに制作する際の基本CSSとしてまず最初に読み込ませる様にします。

ブラウザ毎の見た目の違いを最小限にするための設定です。
(Safariは除く)
無駄な箇所も若干ありますが、W3CのCSSチェックも問題なくクリアするCSS設定になっています。参考までに。

standard.css

先日の「SKILL MEMO07 CSS font-familyについて」の時にいろいろと試し確認したフォントの問題ですが、しばらくはこのままで行く事に決めました。

Mac環境のFirefoxでは全角の記号、とくに「や(を使用する際に微妙な隙間ができてしまいちょっと嫌な感じだったり、なんか文字が小さかったりとありますが、まあ、仕方ないんじゃないでしょうかって事にいたしました。
ご了承ください。

結局、Ms系のフォントがインストールされているMac環境ではヒラギノではなく、Ms Pゴシックで表示される様になっていると思いますが、比較してみるとどうもヒラギノってどうなの?と思ってしまいました。
文字サイズにもよるのかもしれませんが、弊社のサイトの文字サイズには微妙だったような気もいたします。

と、言うことでこのブログのフォントも一部環境の方に対しては変更いたしました。

本体サイト同様、Macの一部の方には変わってしまったかと思います。
ご了承ください。

と、言うのもここにきていきなり無視できなくなったGoogle発のChromeの影響が正直、大です。

インターネットに慣れている方にはかなりおすすめのシンプルさでいい感じです。
個人的には。

今更の話ですが、ホームページってやつはブラウザによってテキストの見え方がかなり違います。

魅せるタイプのデザインの場合にはあまり気になりませんが、文章が多く読ませるタイプのWEBサイトでは、その見え方の違いがかなり大きな問題になってきます。

 

WEB制作においてHTML+CSSのコーディングを行いますが、IEの場合、背景に画像を配置する際に1ピクセルずれる、という問題があります。

たかが1ピクセルですが、その場所によっては致命的なデザインの崩れになることもあり得ます。

CSSハックはあまり使いたくないという基本姿勢もありますので、普及率の圧倒的に多いIEに合わせて作り、Mozilla FirefoxやSafariについては我慢していた部分もありましたが、やはり許せずにCSSハックを使用している今日この頃です。

こんな感じに。

----------------------------------------

/* ズレ修正IE6以下 */
* html body {
padding-left: 1px;
}

/* ズレ修正IE7 */
*+html body {
padding-left: 1px;
}

----------------------------------------

エラスティックレイアウトとはレイアウトを決める際に、ピクセルやパーセントで幅・高さを指定するのではなく、『em』値で指定する方法です。

最も有名な例としてはYahoo! JAPANがあげられます。
文字サイズを変更(大きく)していただければイッパツでご理解いただけると思います。

リキッドレイアウトとも含めアジャスタブルレイアウトなどとも呼ばれる様です。

 

ホームページを制作するにあたって、ここ数年特に耳にする言葉のひとつが「WEB標準」ではないかと思います。

既に一般の方の認識も強く、打ち合わせの際に「WEB標準で作って」と言われる事も何度かありました。
簡単に言うと正しくホームページを作りましょうっていう話(簡単に言いすぎ?)なのですが、実際はどの程度のホームページ制作会社が実施しているのでしょうか?

今更かもしれませんが、Googleのローカルビジネスセンターに登録してみました。

Googleマップに確実に登録されるだけでなく、検索結果に出る時などに任意に入力したちょっとした解説や事務所内の写真などが掲載されます。
よかったら見てみてください。

現在、去年の今頃に制作したWEBサイトのリニューアルと更新作業に取り掛かっています。

まだ一年しか経ってないにも関わらず、データの作り方の無駄の多さに我ながらツッこみつつの作業となっています。

WEBデザイン、WEB制作の進化(変化)スピードって相変わらず速いですね。

当時の技術としては(世間一般的にも自分自身でも)普通にやっていたはずの事が、今見返すと『んっ?』だったりしています。
もっと要領良くスマートなソースになるのに、という箇所だらけですね。

現在、久しぶりのリキッドレイアウトデザインのWEBサイトを製作中です。

大昔、まだテーブルレイアウトが当たり前だった頃にも時々取り入れていましたが、閲覧者の環境を考慮した場合、やはりリキッドレイアウトデザインの方がやさしいのでしょうか?

実作業としてはフルCSSになった今の方がずっと簡単なので良いのですが。

19インチや21インチといったやや大きめのモニターが一般的になってきたとは言え、現在管理しているいくつかのWEBサイトのログを見る限り、いまだに1,024×768ピクセルの解像度が大半をしめているようです。
企業相手がメインのサイトはなおさらその傾向が強い様です。

業種、業界によっては古い環境からの移設が難しいのも現実。
クライアントによって使い分ける、というのが無難でしょうか?
どっちにしろ、制作の前提条件を決めるのは大切な事だなぁと改めて思うのでした。

という事で本日は本題であるはずの新サイトの制作は全く手付かずです...。

名古屋のデザイン事務所(WEBデザイン、グラフィックデザインを軸としたクロスメディアデザイン事務所)
株式会社シンクポートのウェブサイトをご覧いただき、ありがとうございます。

株式会社シンクポート
〒461-0004 名古屋市東区葵一丁目12番1号 オフィス布池3階
TEL : 052-939-5270 FAX : 052-939-5271

※JavaScriptを使用しています。ブラウザの設定で有効にしてください。
※最新のAdobe Flash Playerをインストールしてください。Adobe Flash Player 6 以上が必要です。

Adobe Flash Playerをお持ちでない場合は、下記バナーよりダウンロードしてください。
Adobe Flash Playerダウンロード