はてなブックマーク

Web制作の仕事をしていると、最近はクライアントから facebookページについての質問や相談を良く受けるようになりました。私自身、このブログのfacebookページをだいぶ前に作成して以来、facebookページについての勉強はほとんどノータッチでした。そこまで手が回らなかったというのが正直なところでした。ただ、最近はそうも言っていられなくなってきたので、今まで自分の仕事用の facebook ページというものを作成してきませんでしたが、そろそろ 自分の facebookページを作成してみようと思い、寝る時間をちょっとだけ削って時間を作りコツコツと作成してみました。今回は、この経験をここに残しておこうと思い facebook ページのサブページの制作フローをまとめてみました。尚、facebook は仕様が頻繁に変更になるので、ここでご紹介する情報が役に立たなくなる日が近い将来に来る事を

しばらく更新が滞っておりましたが、久々に更新再開致します。さて、各ブラウザも HTML5 や CSS3 に対する対応が進んできていて、大手企業のウェブサイトなどでも積極的にこれらを取り入れる傾向が強まりつつあります。そんな中、CSS3 を敬遠してきた方々が気軽に入っていけるコンテンツを書けたらと以前から思っており、今回はその初回としてロールオーバーを題材にして CSS3 に軽く触れてみたいと思っております。 CSS でふんわり光るロールオーバーを作る まずは、ボタンを div 要素で普通にコーディングしてみる CSS でボタンをコーディングしてみる CSS3 を使って、まずは輪郭を角丸にしてみる ボタンに影をつけてみる 文字に影をつけてみる リンクのテキストの前に ≫（矢印）をつけてみる マウス hover 時にボタンの光を強めてみる マウス hover 時に文字の光を強めてみる マウス

「sitemap.xml」は検索エンジンに効率よくアドレスを収集してもらうのに効果を発揮します。「robots.txt」は、検索エンジンロボットに収集して欲しくないコンテンツが含まれている時に利用する事で、特定のコンテンツをロボットからブロックする事が可能です。今回は、それらについての忘備録としてまとめてみようと思いました。 sitemap.xmlの書式と設置について sitemap.xmlの書式と設置について sitemap.xmlを簡単に作成するサービス sitemap.xmlの送信方法 robots.txtについて robots.txtについて robots.txtの書式と設置について 最初に、sitemap.xmlについてです 1. sitemap.xmlの書式と設置について 「sitemap.xml」は、拡張子からも分かるように、xmlファイルで作成します。まずは、サンプルコード

Webサイトを構築するにあたって、フォントの選択は非常に重要な要素になります。例えば、サイトの本文に使用するフォントはそのサイト全体のデザインなどのような見た目にも影響しますし、コンテンツの読みやすさなどのユーザビリティーにも非常に大きく影響を及ぼします。また、ロゴに使用するフォントは、そのブランドや会社のイメージにも深い影響を及ぼします。Webデザインをする上でフォントの選択は非常に重要な要素となっていますが、今回はそんなフォントについて少しまとめてみました。 Webデザインにおけるフォントについて 欧文フォントのセリフとサンセリフ 和文フォントの明朝体とゴシック体 プロポーショナルフォントと等幅フォント 文字コードについて フォントファミリーについて カーニングとトラッキングと行間について Webサイトにおけるフォントファミリーの指定 CSS3のWebフォントについて 1.欧文フォント

WordPressを使い始めて最初からオリジナルのテーマを一から作成できる人はそんなに多くないと思います。恐らくWordPress初心者のほとんどの人は、無料のテーマなどをインストールして使っているのではないでしょうか？それは、テーマを作成するにはPHPの知識とMySQL等のデータベースの知識が少なからず必要となるからです。また、それらの知識が多少あっても、テーマを作るにはどういった手順で作ったらいいのかが分かりずらい部分も多いと思います。今回は、そんな方々の為に自分の経験から制作フローだけでもご紹介できればと思っております。但し、PHPをかじった事もない方、データベースをいじった事がない方にはちょっと厳しいかもしれませんので、まずはそちらを少し勉強してからトライしてもらった方がいいかもしれません。 デザインテーマの制作フロー 開発環境を整える テーマの仕組みを理解する デザインを作成し、

ロールオーバーは、いまやWeb制作の際の必須の技術となっています。Webデザイナーさんにおいては、特にナビゲーション等を作成する時にはロールオーバーを必ずと言っていいほど実装している事かと思います。そんな当たり前の技術になったロールオーバーですが、実装するにはいくつかの方法があります。CSSスプライトを使う方法、javaScriptを使った方法など、それぞれの方法にはメリット・デメリットが存在し、どの方法を使うかは制作者の選択に委ねられます。それらの方法の中から、今回は3つの方法でナビゲーションメニューを実装する方法をこちらでご紹介したいと思います。 CSSでロールオーバーを実装 その１ 目次 ロールオーバーを実装する3つの方法 まず、CSSスプライトとは？ 実装方法について 1. ロールオーバーを実装する3つの方法 CSSスプライトを使う方法1（background-positionを使