ぱくたそ - フリー写真素材・無料ダウンロード人柄あふれる店主が握る江戸前寿司「寿司幸」のフリー素材 東京都中央区日本橋、大都会の中心に店を構える江戸前寿司「寿司幸」さんとコラボレーションし、豊洲・築地から仕入れる旬の食材を使用した「お寿司」のフリー素材を提供します。人柄あふれる店主が一つひとつ丁寧に...
blog-entry-7.html
Webデザイン、Webサイト作成の流れ、Adobeソフト操作のちょっとしたコツ、SEOなど、ホームページを自分で作りたい初心者の方に分かりやすく解説します。 こんにちは！急に暑くなりましたが皆さまいかがお過ごしでしょうか？ 第4回目の授業は、WEBサイト作成における大切な作業、ラフデザイン作成についてです。 ラフデザインとは、WEBサイトをブラウザで見た時のイメージそのままを、PhotoshopやIllustrator、Fireworksなどデザインソフトで作った静止画のことです。 また、このラフデザインを元にコーディングを行うための、設計図であり部品でもあります。 今回は、コーディングの一段階手前であり、コーディングで無駄な苦労をしないための、ラフデザインの作り方を考えていきたいと思います。 WEBサイトを作る、と聞くと、その作業のメインはHTML、CSSのコードをカタカタ入力すること（
Slicing Images for Your Website with Photoshop
2014年8月17日 Photoshop, Webサイト制作 印刷物のデザインではそのまま印刷すればいいのですが、Webサイトの場合は出来上がったデザインをパーツごとに画像をスライス（分割）し、HTMLとCSSで組立ててWebサイト上に表示します。「実践で学ぶWebサイト制作ガイド」5回目ではそのスライス作業に注目！私は普段Fireworksを使ってスライスしていますが、ここでは前回と同様Photoshopを使ったスライス方法を紹介します。実践に入る前に、いくつかのポイントもおさえておきましょう。 ↑私が10年以上利用している会計ソフト！ 実践で学ぶWebサイト制作ガイド：その5 目標：コーディングしやすいパーツ画像を用意できる 必要なもの：Adobe Photoshop 対象レベル：Photoshopの基本的なツールの使い方がわかる 目次 誰のため？何のため？Webサイトを作り始める前に
Webサイトの作り方のまとめ！番外。
サンプルサイトの制作を通して、「Webサイトの制作手順」についてまとめてみました（の番外です）。 前回の記事では、トップページのデザイン制作と、勢い余ってスライスまでしてしまいましたが、その後、依頼主からデザインの修正依頼がありました。この記事では、トップページデザインの修正と、下層（コンテンツ）ページのデザイン制作について書いてます。 目次です。クリックするとその項目へ移動します。 トップページデザインの修正 依頼主からの返答 改善案を考える 修正案を制作する ちょっと寄り道：ロールオーバー時の見せ方 サイトの役割を再確認 サイトの構成を決める サイト構成図を制作する ちょっと補足：サイト構成図？サイトマップ？sitemap？ 下層（コンテンツ）ページの制作 各ページに入れる内容を整理する レイアウトを考える 下層ページのデザイン制作 スライスしてWeb用に書き出し トップページデザイン
Webサイトの作り方のまとめ！デザイン制作からコーディング手前まで。
話し合い Webサイトの制作に向けて、まず最初にする事は、依頼主についての情報を収集することです。依頼主と話し合い、どんなサイトにしたいのか、方向性を決めてゆきます。 依頼主との話し合いでは、以下の2点について、しっかりと決めておく事が大切です。 サイトにどんな情報を入れるか、どんな人に向けて発信するか、サイトをどう活用していきたいかなど、サイトを立ち上げる目的は何かを確かめる。 どんな雰囲気のサイトにしたいか、理想とするサイトや、希望・要望を聞きながら、どういうデザインにするかイメージを固める。 また、同業他社のサイトを片っ端から見まくる事。今回の場合、喫茶店やパン屋さん、ケーキ屋さんなんかが参考になるかもですね。他のサイトではどんなコンテンツがあるか、どんな見せ方をしてるかとか、この業種だとどんな色遣いのサイトが多いのかとか、たくさんみる事で、刺激になったり、イメージが掴めたりします。
【保存版】Webエンジニアが見るべきテックブログ一覧
皆さんはどのような方法で最新の技術や、コードのTipsを収集していますか？ はてなブックマークやTwitter, GitHubなど様々あると思います。 私はテックブログを使った情報収集をしています。今回はエンジニアが見るべきおすすめのテックブログをいっきにご紹介します。 テックブログとは？ ご存知の方も多いと思いますが、テックブログとはWEBサービスやゲーム等を提供している企業が、自社で使っている技術や開発手法を紹介するブログです。デベロッパーブログとも呼ばれます。 エンジニアが持ち回りで書くことが多いので、そこで働いている人のこともわかっちゃいます。 普段使っているサービスがどのような言語でできていて、どのようなフレームワークを使っているか、どんなツールを利用して開発しているのかが載っているのでとても刺激的な内容ばかりです。 転職、新卒の会社選びにも役立つ!? 転職する際に気になるどんな
ダメディレクターからの卒業、Webサイト企画＆制作時に必ずおさえておきたい「5W2H」
ダメディレクターからの卒業、Webサイト企画＆制作時に必ずおさえておきたい「5W2H」 2013.02.26 | この方法お勧めです！ | 考える。 | 覚えておきたい 密かに近所のスーパーで、高齢者と数少ない吹雪まんじゅうの争奪戦を繰り広げています。 もうちょっと仕入れてくれればいいのにな〜。 こんにちは。和菓子大好きグリーンです。 代理店の営業さんやディレクターやと打ち合わせしてて 「制作中に内容がコロコロ変わる」 「話を聞く度に違う事言ってる」 なんて経験ありませんか？ 「俺が侍だったらこの場でお前を切り捨ててるぜ」なんて妄想で乗り切るのもしんどいような時ないですか？ サイトの方向性やコンセプトがあいまいなまま進めるとこうなっちゃうんですよね。 Webサイトの企画・制作時におさえておくととっても便利な「5W2H」という考え方をご紹介します。 「5W2H」とはアルファベットの頭文字をと
WordPressをカスタマイズするなら絶対覚えておきたい条件分岐やカスタム投稿タイプなどいろいろ
WordPress をカスタマイズするなら覚えておきたい条件分岐タグと、カスタマイズにとっても便利なカスタム投稿タイプについて、簡単にまとめてみました。 WordPress をカスタマイズするなら、必ずと言っていいほど使うのが条件分岐タグ。ブログとして Webサイトを構築するなら、とってもよく使う … というほどではないかもしれませんが、一般的な Webサイトを WordPress で構築していくとなると、動的な Webサイトであればあるほど、条件分岐タグはよく使います。 また、話は変わっちゃいますけど、WordPress 3.0 から本格的に採用された新機能、カスタム投稿タイプも、WordPress でのサイト構築にはかなり便利です。おなじみの条件分岐タグから、カスタム投稿タイプ、タクソノミーまでを、メモっぽくまとめてみました。 WordPress サイト構築 Tips 目次 WordP
Web系フリーランスをモンスタークライアントから守る契約書【テンプレートあり】
契約書なしの口約束でお仕事を受けてませんか？ 自分はまだ駆け出しのフリーランスだから…… クライアントへ契約の手間を与えてしまうから遠慮しちゃう…… 契約とか法律とかよくわからないから…… などなど、理由は様々あるのかもしれません。 でも、契約書なしで案件を受けていると必ずいつかトラブルが起きますよ。 例えば、代金以上の労働を求められたり、お金を払わず逃げられたり。 ボクも12年間、ウェブ制作業に関わってきてますが、残念なことにこうした契約に関わるトラブルをいろいろと経験しました。 確かに、契約書を自分で作るのは難しいです。行政書士へ契約書の作成を依頼するとかなりお金がかかります。 でも、契約書がたった１枚あるだけで、クライアントと友好的な関係を長く築けるのも事実です。 この記事のタイトルには「モンスタークライアントから守る」と書きました。 実際は、契約書は制作を受ける側のあなただけを守る
デザイン時に注意したい角丸の使いかた - Design Color
もくじ 大きな角丸はあまり使わないほうがいい理由 要素によって角丸の大きさを使い分ける理由 大きめの角丸でもおかしくない場合は？ 角丸の大きさを後から調整するPhotoshopプラグイン はじめに なんとなくで使っていたけど、一度ちゃんと考えてみよう！と思わせてくれたきっかけは、こちらのスライドでした。 今回は、こちらのスライドの角丸についての部分に沿って考えていこうと思います。 少ない手間と知識でそれなりに見せる、ズルいデザインテクニック 大きな角丸はあまり使わないほうがいい理由 「ズルいデザイン」のスライドでは、「角丸は5〜6pxくらいが最も無難でキレイ」とのこと。また、下記のようにも言われています。 「R半径が大きい角丸は、野暮ったいデザインになりやすいので、あまり使わないほうがよいです」 引用元：少ない手間と知識でそれなりに見せる、ズルいデザインテクニック たしかに、私も以前に、デ
WordPressをカスタマイズするなら絶対覚えておきたいテンプレートファイルの使い方
WordPressを使い始めた頃は、テンプレート階層、テンプレートファイルの上手な使い方などは、全く考えずに Webサイトを作ってました。 いまではもっと効率的に、もっとスマートにサイトを構築できるようになったかも！そのためにちょっと覚えておきたい、テンプレートファイルについてのあれこれをご紹介します。 WordPress というと、ブログ構築のための CMS（コンテンツマネージメントシステム）というイメージが強いですけど、一般的な Webサイトを作るの時にもとっても便利です。私も仕事で Webサイトを作る時に、WordPress で作成することがとても多いです。 WordPress はバージョンも 3.0 になって、カスタム投稿タイプやカスタムメニューなど、さらに CMS としても充実してきたように思います。 ブログと違って一般的な Webサイトは、そのサイトによって仕様が様々です。コン
FICC ナレッジブログ | FICC | ブランドマーケティング
ビジョンラダー：ブランドパーパスとプロフィットを両立し、理想を現実に変えるためのフレームワークブランドパーパスブランディングビジョンラダー ビジョンは組織の共有する目標であり、人々を束ね、活気づけるものです。ビジネスの理想の形の定義であると同時に、持続的な成長の原動力にもなり得ます。この貴重な資源を最大限に... 続きを読む 逆境のいまこそ見直したい、ブランドの「設計図」とは？：ブランドホロタイプ・モデルの基本ブランドホロタイプ・モデルブランディング この異常な状況の下で、多くの人が通常どおりの広告に多少ながらの違和感を感じていると思う。パンデミックによって私たちの環境は劇的に変化し、広告の大半がその文脈から外れてし... 続きを読む パーセプションフロー・モデルとは？10年以上の経験に基づくナレッジパーセプションフロー・モデル マーケティングは複雑なチームプレーを要する企業活動であり、個
テキストのメリハリをつける方法7つ
私のデザイン修正で一番多い指示が、「メリハリをつけてください」で、以前はどうすれば良いかわからず困っておりました…。(今も時々わからなくなりますが…) 最近ようやくどうすればメリハリがつくかわかってきたので、その方法をまとめてみました。 「メリハリをつけてください」の修正意図は、目立つべきところが目立っていないので、重要な部分を視覚的にはっきりさせてください、ということだと思います。 例として、以下のような見出しとテキストをもとに考えてみます。 （メリハリをつける場合、サイト全体のバランスをみてつけることが必要ですが、ここではわかりやすくするため、見出しと説明文のみで考えています） （引用：Wikipedia: カメラ http://ja.wikipedia.org/wiki/%E3%82%AB%E3%83%A1%E3%83%A9） 私の場合、メリハリをつけるのは以下7つの方法が多いです。
[ブログ]webから得たものをwebに返すということ
11月、これまでの感謝を綴ります 以前記事のどこかで「ブログを書くのはwebから得たものをwebに返すことだ」みたいなことを言ったことがありますけど、その頃はまあ大それた考え方かなとも思ってたんですね。でも最近、わりと真面目にそんな風に思ってます。先輩に飯をおごってもらった分を、その先輩にではなく後輩に同じ事をすることで応えるような。 11月はネタ帳のやまださん( @Yamada_nt )の制定した「好きなブログを告白する月」らしいので、それにちなんで、これまで読んできて特に何かのきっかけになったブログやお世話になったブログを紹介していこうと思いまーす。 ブログをはじめる前 まずはブログをはじめる前。ここに挙げた以外にもコリスやDesignWalkerはやはりよく読んでました。 ホームページを作る人のネタ帳
![[ブログ]webから得たものをwebに返すということ](https://cdn-ak-scissors.b.st-hatena.com/image/square/59fc4b8cf1c794158aa358a703d709cadeff33bf/height=288;version=1;width=512/http%3A%2F%2Fwebcre8.jp%2Fwordpress%2Fwp-content%2Fuploads%2F2011%2F11%2Feyecatch-collection-150x150.png)
ヤバイくらい簡単にプロフェッショナルなサイトが作れるStriking.lyが凄い | バンクーバーのうぇぶ屋
追記：【割引コードGET！】ヤバイくらい簡単にプロフェッショナルなサイトが作れるStrikingly.comが割引コードくれた！ | バンクーバーのうぇぶ屋 上記追記ですが、このStrikingly.comのデイビットさんと話をして、クーポンコード貰えたんでご紹介記事が上になりますー！ 以下より本記事本文 いやー、今日まで散々”簡単にサイトが作れるん時代っすよねー”的な事を色々書いてきましたが、もしかしたらこれは今までご紹介したどんな簡単WEBサイト作成サービスよりも凄いかもしれません。 超シンプル、超簡単、超楽、超綺麗。 無料版でもそのクオリティの高さにはちょっとビックリですが、有料版にすればA/Bテストにカスタムドメインまで全然オッケーとか色々ヤバイ高機能。 例えば、こんなサイト1時間も掛からず作れちゃう。簡単だけどレスポンシブ可もされてるし。使い方も説明が必要か迷うレベルで簡単。 S
Basic Process to Apply CSS to Your Website
2014年8月17日 CSS, Webサイト制作 CSSでレイアウトを組むのは、最初はすごく難しく感じるかもしれません。私も何度も挫折しかけました。。でもよく使うプロパティを理解し、少しずつ組み立てていくと自然と慣れてきますよ！今回はサンプルファイルも用意したので、ダウンロードしてコードをじっくり見てやってください。連載企画「実践で学ぶWebサイト制作ガイド」、CSSでラストスパートです！ ↑私が10年以上利用している会計ソフト！ 実践で学ぶWebサイト制作ガイド：その7 目標：CSSでレイアウトが組める・基本的な装飾ができる 必要なもの：Windows メモ帳 や、Mac OS Text Editなどの文章エディタツール。もちろんAdobe DreamweaverなどのWeb系オーサリングソフトがあるならそれでOK 対象レベル：CSSの基礎知識がある・基本的なCSSが手打ちで書ける 目次
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
初めてWordPressのカスタム投稿タイプを使うときに参考になるサイト構築実例
新着記事
新着記事
http://www.cmmntr.com/m/58