タイトルはパンくずリストなんですけど、パンくずリストを紹介する記事ではありません。でも、パンくずリストを自分で作ってみると分かるんですけど、パンくずリストのコードには、WordPress でのサイト構築のノウハウが詰まっているなーって思います。なのでパンくずリストを作りながら、WordPress でのサイト構築の考え方みたいなものを紹介する感じの記事になっています。 WordPress でブログじゃない Web サイト構築をするとき、サイトの構造によってはサイドバーなどを自分でカスタマイズしなくてはいけません。例えば固定ページを作ったら、親ページでは子ページへのリンクを表示したりとか、逆に子ページでは親ページのリンクを表示したりとか …。もちろんリンクだけじゃなくて、アイキャッチ画像なんかも一緒に表示したいこともあったりします。一般的な Webサイトを WordPress で作ろうとすると

wordpress3.0から導入されたカスタム投稿タイプが気になって仕方なかったので、ちょっとずつ触っていたのですが、単発的な知識ではなくて、サイトを作成する上で必要なことを纏めて知りたいなっと思い、サイトを作ってみました！ 胸をはって正しい使い方をしているか…というのは言えないのですが、こうしたい時にはこれが使えるよ！ぐらいの豆知識にはなるかもしれませんので、カスタム投稿に関する事以外でのサイトを作っていく過程で必要だった事柄もまとめてレクチャーしようと思います！ 今回の制作の流れ サイト設計をしよう！ サイトをデザインしよう！ サイト構造を把握してコーディングしていこう！ wordpressテンプレートタグへ変更しよう！ 実際に投稿＆運営しよう！ サイト設計をしよう！ 注意事項 今回はカスタム投稿を利用することを前提にしているので、それを念頭にサイト設計をします。 また、カスタム投稿

WordPressブログでのSEO対策について、ページ上でできることとソーシャルメディアでできることを説明しています。ブログを始めるとどうしても気になるのがアクセス数。そしてSEO・・・。WordPressでのオンページSEOの具体例とソーシャルメディアを使ってのSMOについて少し触れています。海外ブログの翻訳記事です。 wpbeginnerにMust See SEO Guide for All WordPress Bloggersという記事があります。WordPressでのSEOについてまとめた記事ですが、その中からチェックしておきたい部分を翻訳してみました。抜粋ですので全文を読みたい人は元記事：Must See SEO Guide for All WordPress Bloggersをどうぞ。 拙い翻訳で、間違いもあるかと思いますが、どんどん突っ込んでもらえるとうれしいです！ ブログ

とても長い記事になってしまいましたが、WordPress を使って、コーポレートサイトのサンプルを作ってみました。WordPress はブログだけじゃなくて、色んな Webサイトが作れますよね！今回は、私が WordPress でサイトを作る時にやっていることをまとめてみました。 今までこのブログの中で、いろいろな WordPress の Tips を書いてきました。でも WordPress を使った Webサイトの作り方そのものは、今まで書いた事がありませんでした。そこで今回は、 WordPress を使ってブログじゃない Webサイトをまるごとひとつ作って、私なりの作り方をまとめてみました。 今回のサンプルサイトでは、WordPress の固定ページ機能はもちろん、カスタム投稿タイプやカスタムタクソノミー（カスタム分類）を使って作っています。 ページを表示する為に使っているテンプレート

私は毎日使っている Adobe Photoshopですが、まだまだ使いこなせてません ...。 初心者だったころは今以上に分からないことだらけでした。 今回はとても長い記事になってしまいましたが、初心者だった頃分かりにくかったなーと思った Photoshop の機能についてまとめてみました。 私が Web制作をするときに、いつもお世話になってるのが Adobe Photoshop。Photoshop は Webデザイナーでなくても、DTP デザイナーさんやカメラマンさんなど、職種を問わずいろんな所で使われていますよね。もちろん仕事で使っていないけれど、趣味のことに Photoshop を使っている … という人もたくさんいると思います。 Photoshop はとっても高機能でいろんな機能がついていて、分からないことだらけ …。難しい用語もあったりして、取っ付きにくいなーと思ってる人も多いは

最近になって急に盛り上がってきているZen-Codingをみなさんご存知ですか？ Zen-CodingはHTML/CSSをショートカット＋スニペットで簡略化してコードを書くことができるライブラリです。 独立したテキストエディタソフトではなく、既存のHTML/CSSエディタにプラグイン的に導入するものです。 Zen-Codingというのもがどういうもので、どんなすごいものなんだ、というのはこちらの動画を見てください。 ※音が出ますのでご注意ください。 Zen Coding v0.5 from Sergey Chikuyonok on Vimeo 一体何がおこわれているのか？という感じだと思われますが、今回の記事ではこのZen-Codingの導入方法と使い方の一例を紹介します。 Zen-Codingに対応しているエディタは色々あるのですが、今回は弊社の開発環境しているAptana Studio

SitePoint: New Articles, Fresh Thinking for Web Developers and Designers PHPを使ってWebサイトやWebアプリケーションを構築する場合はデータベースも併用することが多い。そしてその場合に採用されることが多いデータベースのひとつにMySQLがある。PHPはすぐに利用できるようになるプログラミング言語といわれているが、MySQLやSQLはそうではない。堅牢で信頼できるデータベースを設計し、それを扱うSQLクエリを作成するにはそれなりの学習時間と経験が必要だ。 こうした話題がSitePointにおいてTop 10 MySQL Mistakes Made By PHP Developersとして掲載されている。PHPデベロッパが犯しがちな10のMySQLミステイクという内容になっている。どういった間違いをしてしまうか簡単に

毎日旬なネタを更新してくれる個人ブロガーとしても老舗の [N]ネタフルさん（http://netafull.net/）のバナー広告の最適化を実験的にさせてもらいました。 結果的には、最適化を行った個所のクリック率が2倍になりました。 今日は、このネタフルさんのバナー広告のクリック率を2倍にした方法を紹介させていただきます。 ブログの売り上げを上げる5つの方法ブログの売上を上げるには色々な手法があると思うのですが、 ■ブログの売り上げを最大化させる黄金の法則 「インプレッション　×　CTR（クリック率）　×　CVR（成約率）　×　単価　×　リピート率」 に当てはめ、5つの法則をお伝えします。 ■ブログの売り上げを上げる方法 ・インプレッション →ブログのPV数を増やす ・CTR（クリック率） →クリック率の上がるバナーを設置 ・CVR（成約率） →サイトとマッチし

題名の通りですが、これから Webデザインに手を出そう、 という方の為に日本語サイト で説明が凄く分かりやすい サイトと少しチュートリアル記事 の紹介です。 Webデザインを始めたいけどadobeのソフトは高額でなかなか手軽に始められません。まずはほぼ同等の機能を持ち、しかも無料で手に入るGimp（Photoshop代替ソフト）とInkscape（Illustrator代替ソフト）で様子見をしてみてはいかがでしょう。 使い方や実践チュートリアルを丁寧に説明してくれるサイトをご紹介します。「これなら触ってみよう」という気になれるかと思います。沢山あげられると選べずに萎えるので1，2サイトに絞りました。両ソフトのダウンロードもリンク先で出来ます。 プロも使ってるといわれるGimp。Webデザインをこれから始めようと思ってもなかなかとっつき難いかもしれません。ですので扉となってくれそうなサイトを

仕事の現場で、たまに紙媒体のデザイナーに関わる機会があると、発想の違いに驚くことが多々あります。私はもともとwebからデザインを始めたので、ラフデザインの段階ですでに構造的な配置の仕方を心がけているのですが、そのせいで視覚的効果にダイナミックさが足りな・・・仕事の現場で、たまに紙媒体のデザイナーに関わる機会があると、発想の違いに驚くことが多々あります。 私はもともとwebからデザインを始めたので、ラフデザインの段階ですでに構造的な配置の仕方を心がけているのですが、 そのせいで視覚的効果にダイナミックさが足りない、グリッドに捕われたデザインになっていることに気づきました。 絶対的配置で自由にレイアウトできる紙媒体とは違い、webにはもともとの制約・環境による差異・コーディングによる配置の難しさなどがあり、どうしても視覚効果によるアピールは紙に劣ってしまうのかな、と思います。 そんな中で

デザイナーではない方も趣味でサイトを作っていたり、デザイナーに頼むほどでもない画像を作ったりする機会があると思います。デザイナーはセンスでサクサクと制作するイメージがあるかもしれませんが、実はデザインというものは数々のルールによって成立しています・・・デザイナーではない方も趣味でサイトを作っていたり、デザイナーに頼むほどでもない画像を作ったりする機会があると思います。 デザイナーはセンスでサクサクと制作するイメージがあるかもしれませんが、 実はデザインというものは数々のルールによって成立しています。 そのルールの知識があればデザイナーレベルとはいかないものの、見た目がきれいなグラフィックは作れるはずです。 デザインという言葉の定義やソフトの使い方から始めてしまうとややこしくなるので、 今回はあくまでも「とりあえず見た目をキレイにする」ということに重点を置いて説明します。 記事内で

友人がブログを始めたのですが、 Web制作もデザインも全く経験が 無いけど、普通な感じがすごく嫌 らしく、知識が無くても加工出来る、 とか良いサイトとかソフトは無いのか、 と聞かれて教えたWebサービスや ソフトが、同じ境遇の方に役立つかも と思って記事にします。 普通に写真や画像を掲載するのではなく、ちょっと個性的な感じにしたい、出来れば無料がいい、でも自分でデザイン作業は出来ないから良いサイトとか無い？とのことでした。 どうしたいのか良く分からなかったので、あんまり一貫性は無いんですが、教えたのは画像加工ジェネレーターとかそういうのです。いくつか提案した中で、友人が喜んでたサイトだけまとめてみます。 BeFunky 画像を加工するジェネレーター。レトロっぽくしたり油絵っぽくしたり。エフェクトも豊富です。 BeFunky flauntR これも加工ジェネレーター。エフェクト以外にフレーム