アーカイブ

‘WEB制作’ カテゴリーのアーカイブ

モリサワフォント2009 とヒラギノ書体

2009 年 11 月 14 日 soratomo コメントはありません

今日のお昼に、モリサワパスポートのアップグレードキット2009が、郵便で届いたので早速インストール。新しいフォントは、リリース情報のとおり。ユニバーサルデザイン(UD)に対応したという新しいフォントがとても楽しみだったので、早速つかってみたのがこれ。

モリサワパスポート2009で

モリサワパスポート2009で

UD書体・・・・UD黎ミン / UD新ゴ / UD新ゴNT / UD新丸ゴ

コンセプトは「読みやすくて、わかりやすい」らしい。確かに、画数の多い文字でも、カタチの特徴から容易に、直感的に認識できるようになっているのが、よくわかる〜。WEB制作においても、魅せたいテキストやバナーに重宝しそう!Macintosh標準のきれいな使いやすいフォント「ヒラギノ」と比べてみた。

モリサワUD書体と、ヒラギノ書体を比較

モリサワUD書体と、ヒラギノ書体を比較

こうやってみると、UD書体は枠いっぱいみっちり使っているのがよくわかる。特に「ぼ」「ぽ」のあたり、ユニバーサル書体というからには!という優しさが感じられます。丸なのか点々なのか、よく迷うことあるもんなぁ。「り」も、カタチ重視で特徴的ですね〜。

あと、ほかにも秀英明朝というのが新しくあって、なんと100年も前から使われているフォント。モリサワのリュウミンより柔らかく、どこかレトロな雰囲気があって、長文はもちろん、WEBでもさりげなくメッセージを伝えたい部分なんかに使えそう。

いやはや、アップグレードキットが今日届くことを、まったく忘れていたというか、不意に届いたので、結構興奮してしまった。今回のアップグレードは盛りだくさんだ〜。

さっそく開けてみようかな

前触れもなく届いた

けっこうイロイロ入ってるなぁ

中身盛りだくさん

アップグレード内容がまとめられていた。おお~!わかりやすいぃ

アップグレード内容

新しいフォント管理ツールもある!と思ったら、ユキヒョウには未対応…残念。FontBookよりも、どう使い勝手がいいのか気になるなぁ

管理ツール


カテゴリー: WEB制作 タグ:

CSS 初期設定 リセット用スニペット

2007 年 11 月 22 日 soratomo コメントはありません

YUI:Yahoo User Interface ライブラリにある「fonts」のスタイルシートを利用し、IEとモダンブラウザ間のフォントサイズの差異を、ある程度に抑えれる。また、フロートテクニックとしてよく使う ClearFix なども入れ得。

/*2007.11.22更新
==================================================================Reset*/
body,div,
ul,ol,li,dl,dt,dd,
form,fieldset,input,textarea,
h1,h2,h3,h4,h5,h6,pre,code,p,blockquote,hr,
th,td {
margin:0;
padding:0;
}
body {
/*yahoo UI:http://developer.yahoo.com/yui/fonts*/
font:13px/1.22 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro W3', 'メイリオ',Meiryo, 'MS Pゴシック', Arial, verdana, sans-serif;
*font-size:small;
*font:x-small;
line-height: 1.5;
background-color:transparent;
text-align: center;
color: #666666;
min-height: 100%;
}
/*html:\66irst-child body {
font-size:12px; safari only \
}*/
a {
text-decoration:underline;
outline:none;
}
a:link {
text-decoration:none;
color:#3f75fb;
}
a:visited {
text-decoration:none;
color:#3f75fb;
}
a:hover,a:active {
text-decoration:none;
color:#ff0000;
}
a img,:link img,:visited img {
border:none;
}
/* delate dot boader of link for New Mozilla \*/
a {
overflow:hidden;
}
img,fieldset,abbr,acronym {
border:0;
}
table {
font-size:inherit;
font:100%;
border-collapse:collapse;
border-spacing:0;
}
/*ul,ol {
list-style-type:none;
}*/
th,caption {
text-align:left;
}
input,select,textarea{
font:99% arial,helvetica,clean,sans-serif;
/* for macIE5 \*/
font-family:"Hiragino Kaku Gothic Pro","Osaka","MS Pゴシック",Verdana,sans-serif;
font-weight:bold;
}
select option {
padding : 0 0.5em;
}
form label{
cursor : pointer;
}
input:focus,select:focus,textarea:focus{
background-color: #ccffff;
}
pre,code,kbd,samp,tt {
font-family:monospace;
*font-size:108%;
line-height:99%;
}
q:before,q:after {
content:'';
}
hr {
border:0;
height:1px;
background-color:#000000;
color:#000000;
}
address {
font-style:normal;
}
/* strict reset by uncommenting lines below */
address,caption,cite,code,dfn,em,strong,b,u,s,i,th,var {
/* font-style:normal; */
/* font-weight:normal; */
}
/*almost default*/
.iLeft {
float:left;
}
.iRight {
float:right;
}
.fObject {
width:auto;
height:auto;
line-height:0;
}
/*
<div class="cboth"><hr /></div>
*/
.cboth {
clear:both;
height:0;}
*html .cboth {
height:.1em;
overflow:hidden;
margin-top:-.1em;
}
.cboth hr {
visibility:hidden;
border:0;
}
/*float clear*/
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix {
display:inline-block;
min-height:1%;  /* for IE 7*/
}
/* Hides from IE-mac \*/
*html .clearfix {
height: 1%;
}
.clearfix {
display:block;
}
カテゴリー: WEB制作 タグ:
Get Adobe Flash playerPlugin by wpburn.com wordpress themes