タグ

ブックマーク / webdesignrecipes.com (10)

  • CSSは分かるけど jQuery は苦手 … という人が jQuery に親しんでくれるといいなーと思って書きました

    Webデザインをしていると、HTMLCSS だけではできない表現ってありますよね。そんな時によく使うのが jQuery。今回は jQuery っていまいちよく分からない ... っていう人が、jQuery に少しでも親しんでもらえたらいいなーと思って、知ってる事をまとめてみました。なので jQuery 初心者さん向けの記事です。 とっても当たり前なんですけど、Web サイトは基的に HTML で書かれていて、デザインは CSS で装飾されていますよね。最近では CSS3 の登場で、簡単なアニメーションも CSS で作れるようになりました。でもクライアントワークでは、まだまだ CSS3 を使える部分が限られているし、Webデザインに少し動きなどをつけたい時などは、まだまだ jQuery を活用する事も多いです。 私は Javascript が苦手で、jQuery もどちらかというと苦

  • Webデザインの1pxを作るためのPhotoshopのレイヤースタイルいろいろ

    色んな Webサイトを見ていると、1px にこだわって作られたキレイなデザインがたくさんあります。私は Photoshop を使っているので、Photoshop のレイヤースタイルを使って、1px の細かい所を作る Tips をまとめてみました。基的な操作ばかりなので、これから Photoshop で Webデザインをやってみたいなーという人向けの記事です。 色んな素敵なデザインの Webサイトを観察していると、1px の細かいところまでこだわって作られてるデザインってとても多いですよね。1px … Webデザインでは一番小さいサイズ。「神は細部に宿る」という言葉もあるけれど、1px までしっかり作られたグラフィックはとても美しいですね! 今回は Photoshop を使って、いろんな 1px を作ってみました。とは言っても難しいグラフィックデザインを作るわけではなくて、レイヤースタイル

  • 初心者の頃分からなかったWeb用語:フレームワーク … CSSからHTML5、WordPressまで

    Webを見ていると、フレームワークっていう言葉をよく目にします。初心者の頃は、このフレームワークっていうものがどんなものなのか、いまいち分かりませんでした。今回は、色んな例でフレームワークというものを紹介してみました。なので、フレームワークって何だろうっていう人向けの記事です! Web制作関連のブログを読んでいると、ときどきフレームワークっていう言葉がでてきます。例えば CSSのフレームワークとか、HTML5 + CSS3 のフレームワークとか …。 今でこそ、このフレームワークって何だかわかりますが、初心者の頃は、このフレームワークっていう言葉が何だか難しそうで、意味の分からないものでした(私だけ?)。何となく雰囲気で、使ってみると便利なのかなーという感じはしましたけど、そもそもフレームワークという言葉自体の意味が分かっていなかった頃は、使ってみよう!というところまで行きませんでした。

  • はじめてHTML5でコーディングする時に注意したいアウトラインとかいろいろ

    先日このブログを HTML5 で作り直しました。その時に思った、HTML5 でコーディングするときの基的な注意書きです。なので、HTML5 をこれからやってみようかなーという人向けです。canvas、video、audio などには触れていません。もっと基の文章構造、アウトラインについての記事です。また、後半は実際に HTML5 でコーディングする時の tips になってます。 先日このブログ – Webデザインレシピを、HTML5で作り直しました。HTML5 … クライアントさんのページでは、まだ一度も使ったことがないし、勉強のためのサンプルはいくつも作ってみたんですけど、実際に運営しているページで試したいなーと思い、思い切って HTML5 にしました。 とりあえず作ってはみたものの、まだまだ分からないことだらけ。これから HTML5 でコーディングをする時に、とても大事だなーと思っ

  • これからPhotoshopでWebデザインをしたい初心者さんのためのツールパネルとかいろいろ

    Webデザインをするときにいつも使っている Photoshop ... あまりに高機能なので、ツールパネルだけでもボタンがいっぱい。はじめて Photoshop に触れる人にとってはちょっと難解なインターフェイスかもしれません。Photoshop を始めたばかりの初心者さん向けの、ツールパネルのまとめです。 Webデザインするときに、いつも使っている Photoshop。でも当にはじめて Photoshop を使い始めた人にとっては、Photoshop の画面に並んだ、たくさんあるボタン類からして意味がわからないんだと思います…。そー思ってツールパネルのボタンを端から見ていくと、自分でもコレなんだっけ?っていうのがいくつか …。 実は最近友達が Photoshop を使い始めました。全く Photoshop を使ったことのない彼女に使い方を教えてあげるって約束しちゃったので …。 そんな

  • デザインの基礎力をワンランクアップしたい私(Webデザイナー)の注意書き

    Webデザインは、紙の上のデザインと違うところも多いと思います。でも同じデザインですから、歴史ある DTP デザインから学ぶことはいっぱいあります。デザインの基礎の基礎、レイアウトについて、デザインするときに気をつけたい基礎の部分の注意書きです。 毎日インターネットを見ていると、素敵なデザインの Webサイトに出会います。ときにはひと目惚れしちゃうようなこともあります。そんなデザインにあったとき、どうして素敵なのかなーと考えるのも勉強のうち。そう思って素敵なデザインはストックしておいて、自分なりにそのデザインが素敵な理由を考えてたりします。 デザインの理由 どうしてそういうデザインをしたのか … デザインには理由があります。気まぐれに色を選んだり、要素を配置したりしないからです。なので自分のデザインの理由、どうしてそういう風にしたのかということを、口で説明できないとダメだと言われます。もち

  • CSS:初心者の頃にハマったスタイルシートのあれこれ … IE7多め

    CSS、スタイルシート。初心者のころには CSS のスタイルがうまくいかなくて、半日や丸一日悩んだこともいっぱいありました。最近では、やっとひと通り覚えて、思うようにできるようになったかなーという感じです。今回は初心者だったころ、ちょっと悩んだことなどをいくつかまとめてみました。 Webサイトの見た目をデザインしていくのに欠かせない CSS。度々これってどうやるんだろうとか、どうしてこうなっちゃうの?というものに遭遇します。また、今までは IE6 をターゲットに含めてましたけど、そろそろ IE7 からをターゲットにすればいいのかなーと思うこともあって、過去のスタイルシートの書き方の習慣を変えようかなとも思っています。 スタイルシートを書いていて、今まで遭遇した不具合やその回避方法、また今まではこうしてたけど、これからは変わるかもしれないなーといものをまとめてみました。もうそんなことしてない

  • サイト設計をする時に覚えておきたいポストタイプの特徴などいろいろ

    WordPress で Webサイトを構築する時に、設計の段階で知っておきたい投稿のタイプ(ポストタイプ)について、その特徴などをまとめてみました。とても長い記事になってしまい、うまくまとめられなかったかもしれません ... WordPress ... 奥が深いんだもん ... Webサイトを作るぞーってなってから、アップロードして公開するまでには、当にたくさんの色んな工程がありますよね。まず発信したい情報があって、誰に見てもらいたいとか考えて、設計してデザインして、コーディングして … 。 Webサイトを作るとき、いきなりデザインやらコーディングから始めるってことはありませんよね。今回は実際にデザインを始める前の段階、サイトの設計やワイヤーフレーム作りをする段階のお話。WordPress で Webサイトを作る時に、設計の段階で知っておくといいかなーと思う、ポストタイプ(’post_t

  • Illustrator(Photoshop) のペンツールできれいなパス、ベジェ曲線を描くためのコツ(私流)

    Illustrator や Photoshop のペンツール。 初心者の頃は、きれいな曲線が描けなくて悩んだものでした。そんなペンツール、パスの初心者さんのための、ペンツールできれいなベジェ曲線を描くコツを、一連の操作方法とともにまとめてみました。 ペンツールに挫折しちゃった人も、もう一回チャレンジしてみるきっかけになればうれしいです! ペンツール初心者さんが対象の記事です。 Photoshop や Illustrator のペンツール … はっきり言って私はへたっぴーです。ペンツールは切り抜きをするときやイラストを書く時など、絶対に使いこなしたいツールですよね。ペンツールで描く曲線をベジェ曲線、アンカーやハンドル(後述)も含めてパスって呼んだりもしますが、この曲線が初心者さんにはとにかく難しい …。初心者さん向けの Illustrator のや Webサイトを見ても、ペンツールできれい

  • WordPressをカスタマイズするなら絶対覚えておきたいテンプレートファイルの使い方

    WordPressを使い始めた頃は、テンプレート階層、テンプレートファイルの上手な使い方などは、全く考えずに Webサイトを作ってました。 いまではもっと効率的に、もっとスマートにサイトを構築できるようになったかも!そのためにちょっと覚えておきたい、テンプレートファイルについてのあれこれをご紹介します。 WordPress というと、ブログ構築のための CMS(コンテンツマネージメントシステム)というイメージが強いですけど、一般的な Webサイトを作るの時にもとっても便利です。私も仕事で Webサイトを作る時に、WordPress で作成することがとても多いです。 WordPress はバージョンも 3.0 になって、カスタム投稿タイプやカスタムメニューなど、さらに CMS としても充実してきたように思います。 ブログと違って一般的な Webサイトは、そのサイトによって仕様が様々です。コン

  • 1