WordPressのテーマ開発を初めて行う人に向けての制作フロー ｜https://wp.yat-net.com/name
WordPressでオリジナルのテーマを作成する際のフローをまとめました。サンプルも配布してるので、是非使ってみてください、 テーマ開発をやったことがない、それほどやってないという人でもなるべく分かるように書いていますので、手順通りにやっていただければ、テーマ開発をどうすれば良いのか？をわかってもらえると思います。 尚、執筆時点でのWordPressのバージョンは 4.8.2 です。 この記事を書くに当たり WordPress Codex日本語版と、WebDesign Recipes はじめてWordPressのオリジナルテーマを作るときの参考になればと思って書きました を参考にさせていただきました。 目次 テーマのデザインをパーツに パーツの種類 コーディング WordPressの環境構築 必要なファイル テンプレートの種類 トップページのテンプレート化 header.php の編集 i
Webデザイナーとは ｜https://wp.yat-net.com/name
このブログはWebサイトのデザインや制作に関することを中心に色々なジャンルに基づいて書いているのですが、そもそもWebデザイナーが何なのか？を書いたことがなかったので、今回具体的に書くことにしました。 Webデザイナーと一口に言っても、在り方が様々なので、人によっては該当しないこともあるかもしれませんが、この業界を目指す人にとっては一つの指標となると思います。 目次 Webデザイナーの仕事 ヒアリングとスケジュールについて 情報設計（IA・情報アーキテクチャー） UIデザイン モックアップ・プロトタイプの作成 ページのデザイン コーディング 仕事の分担 Webデザイナーの種類 インハウスのWebデザイナーについて Webマーケティング SEO SEM 広告運用 必要なスキルや知識 資格 Webデザイナーになるには スクールを利用する 職業訓練校に通う セミナーに参加する 独学で学ぶ Web
グラフィカルに伝えるインフォグラフィックの勉強に最適なデザイン参考サイト20個とツールサイトのご紹介 ｜https://wp.yat-net.com/name
2016年 01月 21日 グラフィカルに伝えるインフォグラフィックの勉強に最適なデザイン参考サイト20個とツールサイトのご紹介 カテゴリ： デザイン タグ：インフォグラフィック 情報を伝えるのに、文章では伝わりづらいことが多々あります。そんな時に必要とされるのがデザインの役割なのですが、中でも人が普段あまりみないような情報、専門性の高い情報などは、一層伝わりづらく、文章や数字を並べただけでそれを理解するには非常に敷居が高くなってしまいます。 そんなとき、グラフやビジュアルを使ってうまく情報を見せて伝えるのがインフォグラフィックという手法です。 目次 インフォグラフィックを作ることのメリット インフォグラフィックの参考に インフォグラフィックを作ることが出来るサービス インフォグラフィックを作ることのメリット インフォグラフィックを作ることのメリットは、上記で書いたとおり、伝えやすさにあり
配色を考えやすくするための様々なルール ｜https://wp.yat-net.com/name
色は、見た人に対して、そのものの意味を伝えることができます。そのため、色の選択を誤ると正しい意味を伝えることができません。 色とは、デザインを行う上で欠かすことのできない要素であり、プロジェクトの成功にも大きく関わっているため、デザイナーにとっては非常に気を使う要素といえます。 世の中には、何万色という色が存在します。デザイナーは、その中からパターンを組み合わせ、最適なものを選択しなければなりません。 しかし、デザインには意味がある以上、そこにはルールが存在します。そのルールに沿って配色することで、デザイナーは正しい選択ができます。 今回は、配色を行うために知っておくべき、知識やルールを解説したいと思います。 色の色相環と虹 配色と自然の関係 色相、彩度、明度 色調（トーン） 色の役割分担 色の意味 色を選んでみる まとめ 参考文献 1.色の色相環と虹 色の相関を表すのに「色相環」というも
[書評]「Web制作者のためのSassの教科書」 ｜https://wp.yat-net.com/name
「Web制作者のためのSassの教科書」を著者の平澤 隆さん（@hira）、森田 壮さん（@sou_lab）より頂戴しましたので書評を持ってお礼とさせて頂きます。 この書籍はCSSのメタ言語であるSassに関して「導入のメリット」、「導入方法（Windows、Mac）」、「実際の使い方」、「リファレンス」まで必要な事を細部にわたって掲載しています。 導入するにあたって気になるのは学習コストとそれに見合う効果だと思いますが、僕が実際に利用して便利だと感じるのはソースコード管理のし易さ、コーディングの時間短縮と冗長になりがちなソースコードの減量化、変数や四則演算が扱える効率の良さの3点が大きいです。 書籍を読めばそれらのメリットがどれ程のものかを知れるのは勿論、より詳しく便利に使う方法や快適に使えるツールなどといったSassに関連する幅広い知識を得ることが出来ます。 書籍は下記のような構成とな
![[書評]「Web制作者のためのSassの教科書」 ｜https://wp.yat-net.com/name](https://cdn-ak-scissors.b.st-hatena.com/image/square/4b5284bee55c04ba13d388ef455db4259746074a/height=288;version=1;width=512/https%3A%2F%2Fwp.yat-net.com%2Fyatblog%2Fwp-content%2Fuploads%2F2013%2F09%2Fsass_book_00.jpg)
一日のタイムスケジュール ｜https://wp.yat-net.com/name
すしぱくさん（@susipaku）さんから一日のタイムスケジュールを晒せという司令があったので晒したいと思います。 タイムスケジュールの円グラフデータ 現在こんな感じで活動してます。
レイアウトが考えやすくなるデザインのルール ｜https://wp.yat-net.com/name
デザインには意味があります。物を配置するにしても、なぜそれを配置するのか？なぜその色味なのか？なぜそこに置くのか？など、実に多くの事を考えてデザインは行われています。 そのためデザイナーが考える事は実に沢山有り大変なのですが、デザインには決められたルールという物が存在し、「こうしなければならないルール」、「こうしてはいけないルール」と言ったものが多数存在します。 デザイナーはそういったルールを知識として蓄えているので、考えるべき点を素早く整理し形にしていくことが出来るのです。 今回はそのルールについて少し述べたいと思いますので、デザインが苦手な人も是非そういったルールについて考えてみて頂ければと思います。 レイアウト ビジュアルは左、テキストは右 人間の脳は左側に配置されたものを感覚的に美しいと感じやすく、右側に配置されたものを理論的な思考で捉えやすくなっています。そのため上記のような写真
ローカル環境（XAMPP）にWordPressをインストールする手順 ｜https://wp.yat-net.com/name
すでに様々なサイトで紹介されていますがローカル環境へのWordPressインストール手順を記述します。解説はWindowsベースになっており環境はXAMPPを想定しています。XAMPPの導入については過去記事「WordPressをローカルで開発するためのXAMPP事始め＆WordBench神戸、大阪について」をご参照ください。 手順は以下の通りです。 WordPress本体のダウンロード ファイルの設置 データベース作成 WordPressの初期設定 WordPress本体のダウンロード WordPress本体をダウンロードします。記事執筆時点での最新版は3.5.1です。 http://ja.wordpress.org/ ファイルの設置 ダウンロードしたファイルを解凍し、ドキュメントルート（公開用）ディレクトリに設置します。僕はxampp/htdocs/になるのでそこにwp20130128
有名なフォント12種類の紹介とフォントの基礎知識について - YATのBLOG
2013年 01月 09日 今さら聞けない？有名なフォント12種類の紹介とフォントの基礎知識について カテゴリ： Font タグ：Font 新年明けましておめでとうございます。今年も色々と挑戦する年にしたいのですが、一先ずブログをしっかり書くというのをベースにがんばります。 早いもので、このブログも気がついたら3年が過ぎ4年目に突入していました。立ちあげ当初は辞めないことを目標にしていましたが、続けることが大事だなと今でも思っています。皆様本年もよろしくお願いします。 今回は自分がよく使っているフォントをまとめました。他にも使っているフォントはもちろんあるんですが、基本的なフォントやWebベースで使えるフォントあたりを紹介しています。 1.フォントリスト 2.フォントの基本 3.考察 フォントリスト 欧文フォント 1.Arial 2.GEORGIA 3.Myriad 4.Verdana 5
WordCamp大阪2012にスタッフとして参加します。そして喋ります。 ｜https://wp.yat-net.com/name
2012年 10月 17日 WordCamp大阪2012にスタッフとして参加します。そして喋ります。 カテゴリ： WordPress 交流 タグ：WordCamp こんにちはYATです。今回の記事は、2012年11月3日に開催されるWordCamp Osaka 2012のリレーブログの一つです。 前日（10月16日）のブログはたまさんの「東京人の私がなぜWordCamp大阪で実行委員なのか？というお話 ｜ tama’s memo」よりバトンを受け取ってブログを書いています。そして、明日（10月18日）担当の池田さんのブログWordCamp Osaka2012 まであと少し！ ｜ びわ湖のほとりでWEB屋始めました。へとバトンを渡します。 1.WordCampとは？ 2.参加することの喜び 3.実行委員として 4.登壇者として 5.WordCamp大阪に参加されるにあたって WordCamp
スーパーハッカソン2012に参加してきました ｜https://wp.yat-net.com/name
8月の終わりにいつも勉強会でお世話になっている横田さん（@yokotak0527）に誘われて大阪で開催されたスーパーハッカソンに参加してきました。 1.スーパーハッカソンとは 2.開会日（9月1日） 3.開発の1週間 4.発表日（9月8日） 5.考察 6.開発したアプリケーションについて 7.最後に スーパーハッカソンとは このブログをご覧の方は聞きなれない言葉かもしれませんので、少し解説したいと思います。 開発者たちが会議室やソファーがある場所にノートパソコンを持参してあつまり、みんなで一緒にソフトウェアをハックしたり新しいものを開発して、最後にプレゼンするというギーク向けのお祭りイベントの事をハッカソンといいます。大体が一日中行われるのが普通で、中には合宿をおこない、数日から1週間といった期間を設けて行うこともあります。 今回はこのハッカソンと言うイベントをもっと大きくしたもので、公式
フリーイラストサイト12点。商用利用OK・著作権表示不要・無料。 ｜https://wp.yat-net.com/name
2012年 04月 20日 フリーイラストサイト12点。商用利用OK・著作権表示不要・無料。 カテゴリ： フリー素材 タグ：イラストフリー素材まとめ作成支援ツール 会社内の資料を作成する際やブログを書く際にイラストが欲しい！と思うことは多々あるんですが、ひとつひとつイラストを書いてると膨大な時間が掛かってしまいあまり現実的では無いかなと思います。 なので、ちょっとフリー素材として使えるイラストを公開してくれているサイトをご紹介すると共に、シェアさせて頂こうと思います。 こういったものをフリーで公開していただけるのは非常に有難く頭が上がりませんね。尚、商用利用可能で、著作権表記が出来るだけ不要のものをご紹介させて頂きますがWeb上で公開したりする際は念の為、各サイトのポリシーや利用規約をご確認下さい。
デザインする上で要素を目立たせるという事 ｜https://wp.yat-net.com/name
デザインやコンテンツ制作の打ち合わせをしていると必ず出てくる「目立たせる」という行為。 人によって「赤くして」とか「大きくして」と言った抽象的な言葉で表現されますが、僕ら制作者はその言葉をそのままの意味で捉えるわけには行けません。 何故なら、依頼者が何か目的があってそこを赤くする必要がある、大きくする必要があるならばそれを取り入れば良いです。ですが、その目的がその要素を目立たせたいという場合では話が変わってきます。 そうなると、本来の目的は「目立たせること」であって、決して赤くすることや大きくすることが目的では無いため、実際に赤くしたり、要素を大きくしても目立たなければ目的が達成されず満足されることは無いでしょう。 赤くして欲しい、大きくして欲しいと言うのは、依頼した人の中にある目立たせる事に直結したイメージである場合が多いので、実際に何を望んでいるのかを読み取ることが大事です。 1.要所
WordPressのお作法-テーマ作成時のテスト・デバッグについて WordBench大阪 ｜https://wp.yat-net.com/name
2012年 02月 29日 WordPressのお作法-テーマ作成時のテスト・デバッグについて WordBench大阪 カテゴリ： WordPress タグ：WordBenchWordPress 第2回WordBench大阪に参加してきました。その中でみやさん（@miya0001）がお話されていたWordPressのお作法に非常に興味を持ったのでシェアしたいと思います。 1.テーマのデバッグに関して 2.theme-checkプラグイン 3.テーマユニットテスト 4.参考文献 1.WordPressのデバッグに関して スライド「WordPressのお作法：by miyauchi」 WordPressのテーマはかなりの数がインターネット上に公開されてますし、自身で作ることも可能です。ですがそのすべてが安全という保証はありませんし、エラーの出ている物Web上に公開及び納品すると言った行為は良い
食品販売サイトで重要な見るだけで食べたくなる質感「シズル感」 ｜https://wp.yat-net.com/name
シズル感のある写真を使ったECサイトでは通常の写真よりも購買意欲が注がれます。実際僕自身過去にECサイトで販売していて売れなかった商品も、写真を撮影し直すことで売れたという経験もあります。 それを体験しているからこそ、僕自身ECサイトで写真は大事だと考えています。飲食関係に至ってはとくにこのシズル感が出ているか否かは非常に大きなポイントになってきます。 同じ食材を販売するにしても、訪問したユーザーの多くは「美味しそう！」と感じるから買おうと思うのであり、ただ安いからという理由で買うわけではありません。 ただ安いから買うというのは、その商品をすでに知っているから買うのであって、まだそれを知らない人からすれば安いという理由だけだと「なぜ安いのか？」という考えを引き起こす事になり得ます。 ユーザーが商品を見て、買いたいと思うまでにいかに余計なことを考えさせないか。これは購買意欲を購買につなげる大
売れるECサイト・ネットショップにする為に必要な事 - YATのBlog
インターネット上には沢山のECサイトが存在します。その中には当然「売れるサイト」と言われるサイトがありますし、サイトを立ち上げるなら無論皆さんはこれを目指すと思います。 では、売れるサイトを作るにはどうすればいいのでしょうか？ Index 1.売れるサイトに必要なこと 2.他のサイトとの差別化 3.最も大事なこと 1.売れるサイトに必要なこと そもそも売れるサイトとはどういうことでしょう？アクセス数が沢山あって、月に数千万円売れれば売れるサイトでしょうか？それは確かに売れるサイトと呼べるかもしれませんが、もしかするとそのサイトは運営側にとって離脱率や直帰率がまだまだ高く、また、数千万円売れていても赤字で売れるサイトととは呼べないかもしれません。 僕自身が考える売れるサイトとはユーザーが買いたくなるサイトを指すのではないか？と考えます。訪問者数が少なくても「買いたい」と思うユーザーが沢山入れ
WEBデザイナーを目指す人へお勧めしたい記事・サイトまとめ ｜https://wp.yat-net.com/name
最近僕の周りでWEBデザインの勉強やコーディングの勉強を始める人が多く、そんな方々向けに読んで欲しい、見て欲しいサイトをまとめる機会があったのでブログにポストします。 ブログに置いておけばこれから先また誰かに伝える機会があってもURL一つで教えれるので便利ですよね。 Index 1.WEBデザイン全般 2.色彩・配色 3.レイアウト 4.ユーザビリティ 5.文字・文章 6.フォント 7.コーディング 8.著作権 9.グラフィックツール関係 10.チュートリアル等 1.WEBデザイン全般 [連載]Webデザイン入門（1日目）：Stocker.jp [連載]Webデザイン入門（2:スケッチしよう）：Stocker.jp [連載]Webデザイン入門（3:光とボタン）：Stocker.jp サンプルデザインでわかりやすく見る。プロデザイナーが使うセオリー10のこと。：MAKA-VELI.COM W
ブログを運営している上でインストールしている全プラグイン20個 [WordPress] ｜https://wp.yat-net.com/name
2011年 08月 29日 ブログを運営している上でインストールしている全プラグイン20個 [WordPress] カテゴリ： WordPress タグ：WordPressWordPressプラグイン ブログをリニューアルしました。それに伴ってプラグインを整理したのですが、「ん？これなんだっけ？」ってのが結構あったので、後々の事考えてインストールしているプラグインを書き留めておきます。結構便利なものも多いので今からwordpressをやろうと考えてる人には役に立つかと思います。 尚、紹介する順番はアルファベット順となっております。（管理画面がアルファベット順な為） Akismet http://wpdocs.sourceforge.jp/プラグイン/Akismet コメント内容をチェックするスパム対策プラグインです。結構な数のスパムコメントが入ってくるので重宝しています。 Another
![ブログを運営している上でインストールしている全プラグイン20個 [WordPress] ｜https://wp.yat-net.com/name](https://cdn-ak-scissors.b.st-hatena.com/image/square/c6ea928f5e1876a88c89ea38311e1848fe38b09a/height=288;version=1;width=512/https%3A%2F%2Fwp.yat-net.com%2Fyatblog%2Fwp-content%2Fuploads%2F2011%2F08%2Fwordpressplugin_00-1.jpg)
制作会社、WEB担当者も知っておくべきSEO用語集 ｜https://wp.yat-net.com/name
SEO業者の方々とやり取りをする際や、クライアントへの説明が必要な際に知っておくべき用語をピックアップして意味を調べました。どの技術が有効で何がブラックなのかというのは基本的に記述していません。あくまで専門用語の解説として活用してください。関連する情報を解説しているサイトのリンクも付けていますので、詳しく知りたい方はリンク先のサイト等を参照してください。 ホワイトハットSEO 検索エンジンのルールに従いサイト制作を行うことです。 White Hat SEO （ホワイトハットSEO）とは – 海外SEO情報ブログ ブラックハットSEO SEOにおいて悪質な手法を駆使して検索上位に表示させる手法・技術のことです。上記ホワイトハットSEOと対極の言葉でもあります。 ブラックハットSEO – IT用語辞典バイナリ サテライトサイト SEO対策や集客を目的として本サイトとは別に作られたサイトのこと。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
光とサウンド×水槽で織りなす艶やかなアクアリウム「アートアクアリウム」に行って来ました ｜https://wp.yat-net.com/name
