m-School (エムスクール)は、駿河台学園グループが運営する
法人向け研修トレーニングセンター、およびレンタル教室・会議室です。

2018年08月24日

日本語フォント「ゴシック体」「明朝体」の違いって?

こんにちは。
WEBデザイナーのシーナ👀です。

本日は「フォント」の話をします✨。
日本語フォントには主流になっているものに限ってお話しますと、
大きくわけて2つの書体があります。

「明朝体」「ゴシック体」です。

どちらも聞いたことのある言葉だと思います。
2つ書体の違いはなんでしょう⁉
また、どちらをどういうシーンで使うと効果的なのか。そんな話をしたいと思います🐱。

見た目の違い
大まかな見た目の特徴は画像の通りです。
ゴシック体と明朝体、見た目がだいぶ違います。

01.PNGゴシック体
特徴・長所
全体的に太さが同じで装飾のない書体です。明朝に比べて視認性が高く遠くからでも読みやすいです。
タイトル・見出し・強調したい箇所に利用するのに向いています。
またスマホやPCなどでは明朝体よりも圧倒的に利用されています。

短所
太さが均一で装飾がないので、字面がのっぺりとしてしまい、
長文になると読みづらいです。
感情が伝わりにくく、小説などには向いていないとされいます。

02.PNG明朝体
特徴・長所
筆で書いたようにトメ・ハネがあり、線の太さは均衡ではなく、強弱があります。
教科書などを除けば、書籍のほとんどで明朝体は使われています。
先に述べたとおり、装飾があることでリズムができるので読んでいても疲れにくく、飽きずらい。
線の太さに強弱があるので、感情を表すのに向いた書体と言えます。

短所
線の太さに強弱ある明朝体は、
背後が発光しているディスプレイでは細い部分の視認性が低くなりがちなため、敬遠されてしまう傾向にあります。


プレゼン資料などを作成する際、スクリーンに大きく映すことも多いため、
ゴシック体を利用することが多いと思いますが、感情で訴えたいシーンがあった際には
フォントサイズの大きな明朝体で、アピールするなどの手法も有効かもしれません。

いかがだったでしょうか✨
なにかのヒントになりましたら幸いです♥✋
posted by シーナ at 11:41
Web制作 | コメント(0)
2012年03月14日

キミのFirefox 11は divを3Dにできるか!?

「アドオンで最高にいかしたカスタマイズができるブラウザー」でおなじみの
Firefoxバージョン11にアップされました。

■Firefox 11 リリースノート

HTML5に対応など追加要素がありますが、たいちょ勝手に決めた今回の目玉は、
ページインスペクタの 3D ビュー機能です。


【使い方】

「Ctrl+Shift+I」を一発押すか、メニューから[Web開発]-[調査]を選びます。

なにやら暗転しますが、気にせず右下にある[3D]ボタンを押しましょう。


すると…

Firefox 11 で3D表示

HTMLの構造に従い、3D表示できる!

そんでもって、マウスでグリグリ動かせる!


長いブログだとStar Warsのオープニングごっこもできる!!(トレンチ突入ごっこでも可)
Firefox 11 で Star Warsのオープニングごっこ


まあ、どう使いこなせばいいのか現段階では若干不明ですが、

・一見なんてことないホームページだけど、3Dにすると別のデザインが出てくる
・世界一 div が飛び出るサイト(←※論理構造がもとなのでdivだけじゃありません)
・一切飛び出ない、完全平面のサイト

とか、いろいろ出てきそうな予感…!?ひらめき
posted by たいちょ at 21:14
Web制作 | コメント(0) | トラックバック(0)
2011年03月08日

Adobe Wallaby(ワラビー:アドビ純正Flash→HTML5変換ツール)を試してみたよ

Flashファイル(.fla)をHTML5にコンバートするツール、Wallaby(ワラビー)のpreview 1が、Adobe Labsにて公開されました。

■ Adobe Wallaby (Adobe Labs)

Flashコンテンツが動かないiPhoneやiPadなどでも『せっかく作ったSWFを見てもらいたい!』というWeb制作者のみなさま待望の純正ツールが、ついに登場ですね。

で、さっそく試してみました!
以前にFlashで作成したデジタル年賀状コンテンツを、Wallabyで変換したものがこちら左斜め下です。

!注意!
HTML5版は「Safari(PC、iPadなど)」または「Google Chrome」でしか正しく表示されません。
IE、Firefox、Operaでは動作しません。


■ Flash(.swf)版 年賀状

■ HTML5版(上記のFlash版をWallabyで変換)

  JavaScriptファイルを見ると、Webkit特有の指定があるようです。
  そのため現段階ではSafariとChromeだけのようです。
  (変換後のファイルでは、SVGやjQueryを利用しています)
  まずはiPad/iPhone対応に全力、ということでしょう。

ちなみにHTML5への変換は、ワラビーにFLAファイルをドラッグ&ドロップして、コンバートボタンを押すだけです。簡単ひらめき

比較すると…
・音が出ない
・クリックなどが効かない
・アニメーションがやや不安定
などがありました。

しかし「preview 1」というファーストバージョンでこの動きなら、なかなか期待できるのではないでしょうか。
iPadでも動作を確認しましたが、PCのSafariと比べるとちょっとアニメーションがもたつく感がありました。透過やメモリ、フレームレートとかの調整すればスムーズになるかもしれません。
クリックなどもActionScriptを調整すれば、動くようになるのかもしれませんね。

以上、速報でした!たいちょ

たいちょ たいちょ@Twitter
posted by たいちょ at 18:22
Web制作 | コメント(1) | トラックバック(0)
2010年07月08日

Yahoo! 検索サービス全体のアップデートを実施

Yahoo! 検索サービス全体のアップデートが実施されたようです。

■Yahoo!検索をはじめとした検索サービス全体のアップデートを実施しました。(Yahoo!検索スタッフブログ)

「システムの大幅改良」と銘打っていますね。Japan独自の更新のようですが、つい先日インデックスの大幅更新などが行われたばかりなので、SEOなどにどんな変化が現れるのかが注目です。

たいちょ
posted by たいちょ at 21:29
Web制作 | コメント(2) | トラックバック(0)
2009年05月27日

ヤフー!アクセス解析(Yahoo!版Google Analytics)

Yahoo! Japanより、簡単にWebサイトのアクセス解析を行えるサービスYahoo! アクセス解析が公開されました。

■Yahoo! アクセス解析(ヤフー!ジャパン)

ひとことで言えば、Google AnalyticsのYahoo!版ですね。
以前からベータ版で実施されていましたが、本稼働スタートとなりました。

Google Analyticsが広く利用されている現在、乗り換えユーザーがどれだけ存在するかがキーでしょうね。圧倒的な差別化がないと、Webマスターもちょっと躊躇しちゃうかもしれません。ひらめき たいちょ
posted by たいちょ at 16:54
Web制作 | コメント(0) | トラックバック(0)
2009年05月21日

Yahoo!(YST)検索インデックス更新?

まだWeather Reportは出ていないようですが、Yahoo!(ヤフー)のYSTインデックスが更新された?模様です。

結構順位の上下移動が激しく、いきなり圏外になったり上位にきたり…という感じがあります。Japan独自の順位変動でしょうか??

あと検索結果画面のレイアウトが調整され、見やすくなっていますね。
■Yahoo!検索の検索結果画面を改善いたしました。(Yahoo!検索 スタッフブログ)

(2009年5月22日追記):アルゴリズムがアップデートされたとYahoo!公式ブログで報告がありました。

■Yahoo!検索 アルゴリズム Update(Yahoo!検索 スタッフブログ)

たいちょ
posted by たいちょ at 11:41
Web制作 | コメント(0) | トラックバック(0)
2009年02月12日

『続きはWEBで!』

Yahoo!の公式ブログで、おもしろい記事が掲載されていました。

■「続きはウェブで!」の最強キーワードを探せ!その1(Yahoo!検索 スタッフブログ)

最近ではすでに食傷気味とも思えるTVCMなどの『続きはWEBで!』ですが、キーワードの選択しだいではまるっきり効果がない事態になるようです。

この例はTVCMに限らず、チラシやティッシュなどの紙媒体でも応用が利きそうですね。まあサッと流れてしまうテレビと違い、紙媒体は手もとに存在しているケースが多いので、それほど気をつかわなくてもよさそうですが…。電車の中吊りとかが近い感じですね。

以前であれば、マスに対する統計結果はアンケート集計などが主流で、キチッとした数値は出にくい傾向があったかと思います。しかしネットが基準となるとすべて数字で結果が出てしまうひらめきので、マーケティング界から見るとシビアな状況なんでしょうかね〜?

発注側としては、実数が出るので費用対効果が一目でわかり、効率よく広告を出稿できますね。たいちょ

(2009年3月6日追記)続きが掲載されました。
■「続きはウェブで!」の最強キーワードを探せ! その2
posted by たいちょ at 20:38
Web制作 | コメント(0) | トラックバック(0)
2008年12月04日

Yahoo!(ヤフー!)検索アルゴリズムが更新

Yahoo!JapanのWebサーチエンジン(YST)の検索アルゴリズムが更新されました。

■Yahoo!検索 アルゴリズム Update(Yahoo!検索 スタッフブログ)


今までのWeb制作の記事は▼こちらから
■Webマスターのかた向け「Web制作」の記事カテゴリー


おなじみのインデックス更新とは異なり、アルゴリズム更新なので大きな変動があるようです。実際にこのブログの関連ワードを確認しましたが、ビッグワードでも動きが見られます。

このところYahoo! Web検索では、ヤフオクやヤフーショッピングが画像付きで目立つ位置に表示されたり、Overtureの広告が通常の結果と同じように表示されたりといった、影響が大きそうな改変が行われています。

日本ではいまだ影響力の大きいYahoo! Japan。細かい変更はまだ続きそうですので、Webマスターや制作者は今後もチェックが必要そうですね。たいちょ

■Adobe Dreamweaver CS3 入門講座
■Adobe Dreamweaver CS3: Fundamentals
posted by たいちょ at 14:58
Web制作 | コメント(0) | トラックバック(1)
2008年05月30日

Yahoo! Japan(ヤフー!)YST インデックス更新

Yahoo! Japan(ヤフー!ジャパン)のサーチエンジンYahoo! Search Technology(YST)のインデックスが更新されました。

■Yahoo!検索 Index Update(Yahoo!検索 スタッフブログ)

すでに人によっては「シャッフルしているだけ」とも言われているYST。
SEOで悩んでいるWebマスターのみなさんも、ランク変動しても『まーいつものこと、また戻るだろ』と達観してるとかexclamation&questionたいちょ
posted by たいちょ at 11:56
Web制作 | コメント(0) | トラックバック(0)
2008年05月15日

ヤフー! サイトエクスプローラー 日本語版登場

ヤフー!サイトエクスプローラー(Yahoo! Site Explorer)の日本語版が公開されました。

■ヤフー!サイトエクスプローラー(Yahoo! Japan)

■やっとデタ。Yahoo!検索 サイトエクスプローラー公開(Yahoo!検索 スタッフブログ)
■ヤフー、インデックス情報を把握できる「Yahoo!検索 サイトエクスプローラー」公開(CodeZine)
■Yahoo! JAPANがウェブマスターツール相当の「サイトエクスプローラー」を日本語でβ提供開始(Web担当者Forum)
■ヤフー、ウェブマスター向けツール「Yahoo!検索 サイトエクスプローラー」公開(CNET Japan)

長らく英語版のみだったのですが、ついに日本語版が登場です。ヤフー!サイトエクスプローラーを利用することで、YST(Yahoo! Search Technology)にフィード登録してインデックスさせたり、インデックスされた情報を確認することができます。

一見すると英語版と大差がないように見えるのですが、「Yahoo! ブックマーク」のブックマーク数や「Yahoo! ブログ検索」での言及数など、日本語版独自の機能が搭載されているそうです。たいちょ

(追記)
■Yahoo!に自分のサイトを効率的にクロールしてもらえる「Yahoo!検索 サイトエクスプローラー」の使い方(GIGAZINE)
には、

ドメインに「_」(アンダースコア、アンダーバー)、「-」ハイフンなどが含まれている場合、サイトの認証ができない


ってあるんですけど、m-school.bizはいけてるんですよね。ベータなのでまだトラブルなどがあるんでしょうか。
posted by たいちょ at 11:02
Web制作 | コメント(0) | トラックバック(0)