inline-blockにした要素同士を並べると隙間が生まれる inline-blockを使うと、全体を中央や右へ寄せる事ができるのでとても便利です! 例えばul・li要素を使ってリストを作成して、中央寄せにする場合 & […]
2017年3月
CSSを使ってアニメーションさせる方法
アニメーションはCSSで作れる ボタンにマウスを載せた時に背景色を変える、文字色を変えるなどの変化を加える際、普通に作りこむとパッ!っと一瞬で色が変わりますよね。 例えばこんな感じ・・・ リンクボタン CSS a{ ba […]
h1要素の位置はどこがベストなのか
ロゴをh1にするのはもったいない h1~6の見出しを明記するHTML要素は、ページの構造をわかりやすくする上で重要な項目で、中でもh1要素の重要度は一番上になります。 これらの見出しタグはSEO(検索エンジン対策)を考え […]
レスポンシブWEBデザインはスマートフォンを優先
レスポンシブWEBデザインでホームページを作成する時、ついパソコン画面での表示に目がいってしまいます。 パソコンの様な大きな画面への配置を優先した「PCファースト」のデザインになってしまうんです。 もちろんWeb戦略的に […]
画像ファイル形式の違いについて
「JPG」「PNG」「GIF」「BMP」「TIFF」の5つの代表的な画像ファイルについて 写真や絵を画像にするには画像ファイルにして保存しなければなりません。 でも形式がいろいろあって迷うことはありませんか? 保存する画 […]
本当に使える!CSS疑似要素3つ
CSS疑似要素とは CSS疑似要素とは、HTMLではなくCSSを使って疑似的に作成した要素をページの指定した部分へ挿入することのできる便利なものです! ・・・よくわかりませんね。 実際にどんな事ができるのか見てみましょう […]
WDB形式との遭遇~JPG形式への変換
先日PowerPointで作成したファイルを頂いて、そこから画像を書き出したときに「.wdb」なんて拡張子の画像ファイルが出てきました。 WordやExcel、PowerPointから画像を抜き出すと「.jpeg」という […]
JPGやPNGを軽量化しよう
画像をさらに圧縮して、ページ全体の軽量化を図るメリット ホームページの大部分が写真やグラフィックといった画像ファイルになります。これは画像を埋め込んだ方が、デザインが伝わるからです。 画像を多用すればその分1ページ全体の […]
1ページのファイル容量はなるべく抑えよう
ページを表示させる速度は1ページに使われているファイル容量に依存する ホームページを検索して、しばらく待ってもページが表示されない・・・ 気になる画像を見つけたのに、なかなか表示されない・・・ こんな時はありませんか?「 […]
メールフォームのカナ入力欄について
カタカナ変換は難しい メールフォームを作るとき、まず最初に思い浮かぶ項目として「氏名」「フリガナ」「住所」「電話番号」「メールアドレス」「お問い合わせ内容」なんて内容があると思います。 でもちょっと待ってください! カタ […]
ホームページに人の顔を掲載する事で得られる効果
自分たちの顔を掲載しよう ホームページを見ていて、本当に信用できるのか不安になる事はありませんか? 実はそれ、人の顔が載っていないからかもしれません。 常識として「個人を特定できる顔と名前をインターネットに掲載してはいけ […]
人をダメにするエディタ、見つけました
入力を簡略化してくれる「VSCode」 HTMLの入力って、「<」「>」を入力するのが面倒だったり、開始タグと閉じタグで同じ文言を書く事が二度手間に感じたりしませんか? 実際にHTMLを入力していると、閉じタ […]
アクセス解析ツール「Googleアナリティクス」導入と設置について
自分のサイトのアクセス数が気にならない人なんていない!! 自分(企業)のホームページを作って公開したのはいいけれど、誰もがふと疑問に思うこと 「どれくらいの人が見に来ているんだろう・・・」 一度気になりだしたら止まりませ […]
「スタイリッシュに」という要望について考えるべきこと
「スタイリッシュなデザイン」という言葉は様々なところで耳にしたり目にします。 普段は「カッコいい」とか「キレのある感じ」とかそういう意味合いで受け取って、そんな雰囲気が出るようにグラフィックを試行錯誤していますが、この「 […]
文字を美しく見せる”カーニング”について
文字の隙間を整えて美しく見せる 文字を入力した時に、なんだか見た目がおかしいと思ったことはありませんか? 文字と文字の間が空き過ぎていたり詰まって見えることはありませんか? それはカーニング(Kerning)に問題がある […]
ファイル名やclass名にはアンダーバー(_)を活用しよう
アンダーバー(_)を使うことで選択が簡単になる ホームページを制作していると画像のファイル名やCSSのclass・id名に困ってくると思います。 実際に制作をしているとよく困ります・・・ Webサーバーにアップすると、画 […]
文面の見直しだけでできるユーザビリティの高いページ制作
単なる使いやすさ以外のユーザビリティを考えよう ユーザビリティとは操作性に配慮した作りを差しますが、それだけではユーザビリティが高くなるというものではありません。 相手の状況や心理にも配慮して、ボタンの名称を考えることや […]
Facebookのタイムラインをホームページへ設置する
Facebookのタイムラインを設置するには「ページプラグイン」を利用する SNSが爆発的に拡がり、Facebookのアカウントを持っている方も多いのではないでしょうか。 Facebookを使ったプロモーションの一つとし […]