CSSの話：border-spacing
表の枠線について、border-collapse:separate;を指定した時のみ意味を持つプロパティです。隣接したセルの枠線をどの程度離して表示するか、数値で指定します。
数値をひとつだけ（border-spacing:5px;のように）指定すると、上下左右に５ピクセルの幅を空けて枠線を表示します。数値をふたつ指定した場合（border-spacing:5px 3px;）、上下に5ピクセル、左右に3ピクセル幅を取って表示します。
CSSの話：border-collapse
表の中のセル（コマ）の枠線に関して、隣り合ったセルの枠線をどのように表示するか指定します。
collapseとseparateの2つの値を指定でき、collapseでは、隣り合った枠線を重ねて表示（セルとセルがくっついている表示）、separateでは、隣り合った枠線を分けて2本として表示します（セルとセルが離れている表示）。
仕様では、初期値はcollapseですが、一般的に、ブラウザの初期設定はseparateになっているものが多いようです。
CSSの話：table-layout
表の横幅について指定するプロパティです。指定する値は、auto、fixedの2つです。
autoは既定値で、表の中身によって、セル（表の中の1コマ）の横幅を変えて表示します。
fixedを指定すると、セルの横幅を固定として表示します。セルの横幅を指定していない場合、内容の長さにかかわらず、表の横幅を均等に分割して各セルに割り振ります。
fixedを指定すると表示が早くなりますが、中の要素がセルからはみ出してしまう場合など、大きくレイアウトが崩れる原因にもなります。
CSSの話：caption-side
表のキャプションの位置を指定するプロパティです。top（上）、bottom（下）、right（右）、left（左）のいずれかで指定します。
当然、captionタグで表にキャプションを付けていない場合は、何の効果も表れません。
また、ブラウザが古い場合は、right、leftは対応していない場合があります。
CSSの話：表に関わるスタイル
表（table）に関するタグは、HTMLの中でも表示と大きく関わる部分なので、リストと並んで、スタイルの指定もやや特殊なところがあります。
キャプションの位置決め、枠線の処理、中身が空のセルの表示に関してなど、以降の数回は、表のための特別なCSSプロパティについてお話をしたいと思います。
CSSの話：page
ホームページの印刷設定に、あらかじめ名前をつけておき、その名前で設定を参照するプロパティです。
まず、@page insatsu{size:landscape; marks:crop;} という風に、ある名前（ここでは「insatsu」です）に、印刷用のスタイルを定義します。
そして、body{page:insatsu;} のように、pageプロパティを使って定義した印刷用スタイルを呼び出すことができます。
同じ印刷設定を使いまわすときに便利です。
CSSの話：orphansとwidows
ページを印刷するときに、1ページに印刷するテキストを最低何行にするかを設定するプロパティです。
orphansは、ページ最下段の段落に入るテキストの最低行数を、widowsは、ページ最上段の段落に入るテキストの最低行数を、数値で指定します。規定値はともに2です。
例えば、20行分の余白があるところへ、テキスト21行分のページを印刷する場合、widowsが2（最上段の段落に最低2行印刷する）なら、1枚目に20行、2枚目に1行という分け方をしないで、1枚目に19行、2枚目に2行と分けます。
長いテキストを印刷するときに、このプロパティで分け方を調節すれば、最後の紙にほんの数文字だけ印刷される、というような事態を避けることができます。
CSSの話：marks
ページを印刷する際に、トンボ（トリムマーク）と呼ばれる線を表示するプロパティです。トンボとは、紙の裁断や、位置調整の際に基準となる線のことです。
値は、crops（裁断トンボを表示）、cross（調整トンボを表示）、none（トンボを表示しない）から選びます。
ただし、トンボの表示位置は、ブラウザに依存する仕様なので、どの環境でも完全に同じ印刷結果にはならないようです。
CSSの話：size
印刷時のページサイズを指定できるプロパティです。縦横の数値を指定できる他、auto（プリンタの設定に従う）、portrait（紙を縦に使う）、landscape（紙を横に使う）という指定ができます。
あまり厳密にサイズを指定してしまうと、印刷する側の環境に合わないことがありますので、特別な理由が無ければ、既定値のautoにしておくのが無難でしょう。
CSSの話：page-break-inside
このプロパティも、印刷時の改ページを制御するものです。page-break-beforeとpage-break-afterは、改ページを挿入する場所の指定に使われますが、このpage-break-insideは、要素の途中での改ページを禁止するのが主目的です。
page-break-inside:avoid;を指定することで、その要素の途中に改ページが入らないようになります。autoを指定すると、用紙サイズに合わせて、要素の途中でも改ページされます。
たとえば、1ページにまとめて印刷させたい表などに、このプロパティを指定することで、表が２ページにまたがって、途中で切れてしまうような事態を防ぐことができます。
CSSの話：page-break
ホームページを印刷する時の、改ページを指定するプロパティです。page-break-before（要素の前に改ページを入れる）と、page-break-after（要素の後に改ページを入れる）の2つがあります。
プロパティの値には、always（常に改ページを入れる）、avoid（改ページしない）、left（次のページが左側のページになるように改ページ）、right（次のページが右側のページになるように改ページ）があります。
長い文章を主なコンテンツにしているホームページを印刷する時には、このような改ページを設定するプロパティが有効です。
CSSの話：印刷用プロパティ
ホームページを印刷して見る場合、印刷用のスタイルを、画面表示用とは別に指定することができます。
視覚的な表示なので、基本的なプロパティは画面表示に使うものと共通ですが、印刷専用のプロパティも存在します。例えば、改ページ指定、ページサイズ指定などです。
また、文字の大きさをpx単位で指定していると、印刷の際に、画面と比べて文字サイズが非常に小さくなってしまう、ということがあります。
こういった、画面と印刷結果の見栄えの違いを避けるためには、画面表示用と印刷用でCSSファイルを分けて、文字サイズ等の部分を調整するのがいいでしょう。
CSSの話：speak-header
テーブルのセルを読み上げるときに、関連するヘッダを読み上げる際の設定をするプロパティです。
値はonceとalwaysの2つで、onceの場合は最初に1度だけ、alwaysを設定すると、セルの読み上げの度に、関連するヘッダ情報を読み上げます。
CSSの話：speak-numeral
読み上げの際に、数字の読み方をどうするか指定するプロパティです。
値は、digitとcontinuousを選びます。例えば、「123」という数字の列について、speak-numeral:digit;を指定した場合、読み上げの発音は、数字をひとつずつ区切って「イチ・ニ・サン」となります。speak-numeral:continuousを指定した場合は、一つの数として読むので、「ヒャクニジュウサン」という風になります。
Yahoo!japan 堂々の一位
やはり気分が良いですね。一位は。
横浜 ホームページ制作
このキーワードで、検索をすると堂々と、１位に表示される、アイエムシーのホームページ。
不思議なもので、二位の時とは気分が違います。
SEO対策をやりますと、５０位や６０位の会社から言われても、説得力が無いですよね。
その点アイエムシーは実績勝負です！
CSSの話：speak-punctuation
区切り文字を発音するかどうかを指定するプロパティです。code、もしくはnoneを指定します。
例えば、「a;b」という文字列があった場合、speak-punctuation:code;を指定してあると、「エー、セミコロン、ビー」と読み上げます。speak-punctuation:none;の場合は「エー、ビー」となります。
プログラムのコードなど、記号を読み上げさせたい時に使います。
CSSの話：声の抑揚に関するプロパティ
文章読み上げに際する、抑揚を調整するプロパティをまとめて挙げます。全て、0〜100の数値で指定します。
pitch-rangeは、読み上げ時の声の高さがどの程度上下するかを指定します。
stressでは、アクセントをどの程度強く付けて発音するかを指定します。
richnessは、声の豊かさを指定します。大きい数値ではよく通る声、小さな数値では平板な声になるようです。
それぞれ、抑揚に関するものですが、言語によって表し方が大きく異なるものなので、細かい仕様は定められていません。
大きくすれば大仰な話し方、小さくすると平板で機械的な話し方になる、という感じです。
CSSの話：voice-family
文字の種類を指定するfont-familyプロパティがあるように、読み上げの声の種類を指定するvoice-familyというプロパティがあります。
既定値として、male（男の声）、female（女の声）、child（子供の声）の３種類がありますが、ソフトが対応していれば、他にも様々な種類の声を指定することができます。ソフトの対応次第で種類が増えるところも、font-familyとよく似ています。
CSSの話：pitch
ホームページを読み上げる時の、声の高さを設定するプロパティです。指定する値は、180Hzや1kHzのように周波数を数値で指定する方法、また、x-low（低い）、low（やや低め）、medium（普通）、high（やや高め）、x-high（高い）という指定する方法があります。
理論的には、細かく指定することで、歌のように音程を付けた読み上げが可能です。
必要な設定が細かすぎて実用的ではありませんが。
言われたデザインだけすればよい？
今風のデザインをしようとすると、お客様は意外と、
ちょっと前に流行ったデザインを指定してくる事があります。
そんな時、親切なWEB会社としては、どうしたら良いでしょう。
横浜のホームページ制作会社アイエムシーでは、そんな時は、気を使いつつも、
ズバリとお伝えします。
「昔、流行していましたね。でも、今そのデザインをすると、ちょっと先ではもう使えないとい事になりますよ」
という感じです。
ホームページ作成と一言で言っても、お客様とユーザーありきですので、
こちらの思い通りに作れば良いというわけには行きません。
デザインによるコミュニケーションを日ごろは意識をしますが、
口頭によるコミュニケーションも大事ですね。
＃この頃、風邪が流行しているので、うがいをしましょー。
CSSの話：speech-rate
読み上げの速さを指定するプロパティです。早口にしたり、ゆっくりにしたりできます。
指定方法は、1分間に何語話すか、という単位で、数値を入力する方法と、遅い順にx-slow、slow、medium、fast、x-fastで指定する方法、faster（現在より1段階早く）、slower（現在より1段階遅く）で指定する方法があります。
CSSの話：elevation
読み上げソフトで、声の聞こえる方向を指定するプロパティです。azimuthでは水平方向の角度を指定するのに対し、elevationでは縦方向の角度を指定します。
入れられる値は、-90～90のdeg（角度）指定、below（真下から）、level（水平から）、above（真上から）、higher（+10°）、lower（-10°）です。
CSSの話：azimuth
読み上げブラウザで、音声が聞こえる方向を指定するプロパティです。-360deg～360degの数値で角度を指定するほか、left-side（左側）、right-side（右側）、behind（背後）等の指定ができます。
会話文等で、話者を聞き分けやすくするのに便利ですが、細かい指定は特にスピーカーの性能に依存する部分が大きいかも知れません。
CSSの話：play-during
音声読み上げブラウザでホームページを読み上げる際に、BGMを設定することができます。BGMとして流す音声ファイルは、URLで指定します。BGMの繰り返し設定もできます。
また、親要素のBGMを流したままで、そこに更に音を重ねることができます。親要素で繰り返しのBGMを流し、その中の1部で効果音的に音を入れることが可能です。もちろん、BGMを消すこともできます。
任せておけば大丈夫。心配なら他の業者へどうぞ。
アイエムシーの満足ホームページは自信満々です。
弊社には、ホームページを作りたいという方が、メールや電話で、
毎日のように相談にいらっしゃいます。
相談だけしたいという方も多いので、無料相談を使っていただければよいと思いますが、
中には、ホームページやインターネット活用について、自説を延々と述べたがる方が
いらっしゃいます。
つまり、アイエムシーの成功方程式に不安があるのでしょう。
そういう方は、悪い事を言わないので、他社にご依頼いただくか、
弊社のサービス、アットビルダーで簡単にホームページ作成される事をお勧めします。
社長は、ハッキリと話すので、好みが分かれるかもしれませんが、
効果がある、ない、やってみないとわからない。という事もハッキリと言っています。
それを聞いて、不安ならばやらない方が良いのです。
たとえばSEO対策でもそうです
Googleから上位表示される、ロジックが公開されていないのに、
「必ず上位表示されます」
と約束できる業者は、ペテンかハッタリの会社でしょう。
成果報酬という会社は、軟弱か卑屈です。
古今東西、優良企業に成果報酬などという企業は無いでしょう。
横浜のホームページ制作会社アイエムシーは、王道のサービスを提供しています。
うちのサービスは、○○円、メリットは○○、デメリットは××。で、あなたは買いますか？
と、単純明快です。
アイエムシーの拘りのポイントは、明記されているので、それに任せるなら、任せる。
任せないのなら、勉強をして細かく自分で設定をする。
それでも、嫌なら、他社の良さそうに思えるサービスを利用する。
Simple is BEST!
CSSの話：cue
音声読み上げブラウザに適用するプロパティで、音声ファイルを指定することで、要素の前後に効果音を鳴らすことができます。使い方によって、ラジオのジングルのような効果をあげることができます。
指定方法は、background-imageプロパティ等と同じく、url(指定するファイルのURL)と書きます。
cue、cue-before、cue-afterという3種類があり、cue-beforeでは、要素の前に鳴らす音を指定、cue-afterでは、後に鳴らす音を指定します。cueでは、前後に鳴らす音声ファイルをそれぞれ指定します。
見た目と機能の関係
ソフトウェアは、見た目が悪いと、それだけで機能が悪そうに見えます。
しかし、実際には、見た目を良くすると、それだけ問題が起こる可能性が上がるのです。
一番よいのは、コマンド入力・・・・なんて事になりますが、それでは使い勝手が悪くなる。
ここらへんのバランスのとり方がとても大事な点ですね。
横浜のホームページ制作会社アイエムシーでは、見た目と機能を絶妙なバランスでとっています。
CSSの話：pause
読み上げる際、指定した場所の前後に、「間」を指定します。pause、pause-before、pause-afterがあり、pauseでは指定した部分の前後の間を、pause-beforeは前に入れる間、pause-afterでは後の間を指定します。
指定できる時間の単位は、s（1秒）、ms（ミリ秒）、%（平均的な 1単語に要する時間）です。
ゲリラ雨の威力
横浜は凄まじい雨でした！
前ぶれがほとんどなく、突然降りだしました。
ほとんど皆が傘をもっていないので、一斉にダッシュをして、
慌てて転ぶ人やぶつかったりと、横浜駅西口の広場は、騒然としました。
私は運よく、ダイヤモンド地下街から地下から出て、事務所に戻ろうとしたタイミングでしたので、
ふたたび地下に戻り、ビニール傘を買えたので、事なきを得ました。
こんな時、あわてて走る人。
ずっと雨宿りする体制の人。
鞄を頭に、進むしかない人。
あきらめた笑顔で、歩いている人。
用意していた傘を、出して油然としている人。
様々な人間模様が見られます。
備えあれば憂いなし。
でも備えてばかりでは、潤いもなし。
攻めるタイミング、守るタイミングを見極めつつ。
横浜のホームページ制作会社アイエムシーでは、
ゲリラ雨ならぬ、ゲリラマーケティングの展開にも、対応して、
意味のあるホームページ作成をします。
CSSの話：speak
アルファベットの読み上げに関する指定をするプロパティです。none（読まない）、normal（既定値：通常）、spell-out（テキストのスペルを 1文字ずつ）で指定します。
例えば、WHOという文字列が、「誰」という疑問詞で「フー」と読むのか、「世界保健機構」の略で「ダブリューエイチオー」なのか、読み上げる時にはっきり分かるようにすることができます。
社長・・・我々の職を奪う気ですか？
アットビルダー・・・・
アイエムシー社の総力を挙げて、取り組んでいる、自動ホームページ制作プロジェクトですが、
正直言って、これは凄すぎます。。。。
会社案内や簡単なネットショップなら、これで充分すぎるのではないでしょうか。
私たちが日ごろ行っている作業を、分解して、プログラムにしてしまいました。
一生懸命やっているSEO対策のノウハウも、アットビルダーに全て詰まっています。
こんなモノが出回ってしまうと、私たちの技術は要らないのではないでしょうか。
人件費の安く人海戦術が取れる、中国やベトナムに勝つには、
我々のノウハウをプログラム化して、自動生成するしかない。
との話ですが、ターミネーターみたいですね。
WEB業界のターミネーターにならなければ、良いのですがｗ
先日も、某大手ホームページ制作会社の、統括営業から、止めて欲しいと申し出を受ける程のアットビルダー。
しかも、止めて欲しいと、クレームを受けた時に、社長が見せていたのは、
まだまだ未完成の「ベータ版」です。
ひえー業界から抹殺されそうですねー。
横浜のホームページ制作会社アイエムシーは、横浜だけでなく、経済の動向を見ながら、
長期的な視野にたって、ホームページ制作業そのものを、捕らえています。
目先だけの利益を追求して、パイを奪い合う世界に終止符をうつ、切り札となるのでしょうか。
横浜一安いホームページ制作会社アイエムシー。
そして、横浜一高いホームページ制作会社アイエムシー。
「ヤヌスの鏡」の様な、サービス展開にスタッフも目が話せません。
CSSの話：volume
音声読み上げブラウザの音量を調節するプロパティです。値は、0～100までの数値（基本は50）、パーセント指定、またはsilent（無音）、x-soft（レベル 0）、soft（レベル 25）、medium（既定値：レベル 50）、loud（レベル 75）、x-loud（レベル 100）で指定します。
むやみにx-loudやx-softを多用すると、聞き取りづらいページになってしまうので、気をつけましょう。
資本主義的にヤフーの表示が変更？
ヤフーで検索をすると、検索結果の上部にスポンサーサイトという項目があります。
今までは、検索をすると、薄い黄色で表示されていたので、そこに検索結果が出ている人は、
「お金出して場所を買った人」という感じで見分けていたので、SEO対策とは別の場所という感じで見れていたのですが、
なんと、そのエリアが、SEO対策の結果と同じ、白く表示されているではないですか。
一般の人には、スポンサーサイトだろうと、SEO対策の地道な結果であろうと、違いがわからないと
思うので、お金出して場所を買った人が有利になる。という事になりそうです。
横浜のホームページ制作会社アイエムシーでは、SEO対策だけに頼るのは危険なので、
PPC広告（お金を出してエリアを買う）も、あわせてお勧めしていますが、こういった変化の時に、
方針が正しかったと確信が持てます。
ホームページを作成するだけなら、誰でもできます。しかし、効果的にユーザーの目に入れるには、数々のノウハウが必要となりますので、横浜のホームページ制作会社アイエムシーのコンサルティングを有効にご活用ください。
CSSの話：音声へのスタイル適用
今まで、スタイルシートの視覚的効果を主に説明してきましたが、スタイルシートを使うことで、聴覚に関する部分でも細かい指定ができます。
例えば、読み上げソフトを使ってホームページを読んでいる場合に、読み上げの声の大きさ、速さ、また、区切りの場所等をCSSによって指定できます。
ホームページ制作の際には、視覚的なデザインだけを中心に考えてしまいますが、ユニバーサルデザインの観点からすると、こういったスタイル指定も知っておくべきでしょう。
CSSの話：first-line擬似要素
first-lineは、指定した要素の中の最初の1行にのみスタイルを適用するものです。
この擬似要素の面白いところは、改行の位置によってスタイルの適用範囲が変わってくるところです。
あくまでも「最初の1行」にスタイルを適用するので、ウインドウの幅が狭くて1文の途中で改行されてしまった場合など、ひとつながりの文でも改行の前と後でスタイルが変わることがあります。
HTMLの意味とは無関係に、見出しのような表示をさせたい場合には便利かも知れません。
実際にはなかなか上手い使い方ができないのですが、アイディアとしては面白いと思います。
CSSの話：first-letter擬似要素
first-letter擬似要素を使うと、ある要素の中の、最初の1文字だけにスタイルを適用することができます。例えば、pタグで囲まれた段落の中の、最初の1文字だけを大きく表示するということが可能です。
上手く使うと、クラスやID、spanタグ等を使わなくても、スタイルを効果的に見せることができます。
このfirst-letterは、多くのブラウザで（最新バージョンならば）対応しています。
« 2008年11月 | | 2009年1月»
