シンプルでなかなか使えそうなイラストレーターの散布ブラシを 見つけたので紹介します。 これは、ちょっとオススメかも。
シンプルでなかなか使えそうなイラストレーターの散布ブラシを 見つけたので紹介します。 これは、ちょっとオススメかも。
バタバタと仕事が忙しく、久しぶりの記事になりました。 今回は小さくかわいいボタンをきれいに作る方法。 単純だけれど、ポイントを押さえながら解説します。 これさえ覚えておけばWEBを作る際にボタン作りは大丈夫。 簡単にきれいなボタンを作れます。 要点を覚えよう。 まずはシェイプ機能を使ってボタンを作る。 多少は角が丸まってるほうがかわいらしい。 通常の矩形だとなんだかとがった感じになる。 次にグラデーションをかける。 ここはボタン作りにはあまり関係ないので好きにすればいい。 でも、光の影響を受ける現実世界に完全なる単色は無いので軽くでもグラデーションを当てるとよい。 このさりげない部分が実は大事だったりする。 今回はここが要点だと思う。 ボタンに限らず、縁にたった1ピクセルさりげなく濃い色を入れるだけでボタンを引き締める効果がある。 上が縁なし、下が縁あり なんとなく上の縁なしはのべっとした
IEのアドレスバーの履歴を個別に削除する方法とやら…ファイル名を指定して実行で「regedit」と入力して「OK」し、この階層まで行けば、個別に削除可能。HKEY_CURRENT_USER→Software→Microsoft→Internet Explorer→TypedURLs アピアランスの活用 文字の縁取り-失敗例 文字の縁取りをする際に単純に、塗りと線だけでは、太い縁取りをする際には上記のようになってしまいます。(テキスト48pt、フォントはArialBlack、トラッキング(文字間)は100、線幅は5ptに設定しています。) しかし、アピアランス機能を使えば、この問題は解決することができます。 文字の縁取り-アピアランスを活用 縁取りしたい文字を入力します。上のメニューより「ウインドウ」「アピアランス」を選択します。(Shift+F6でも可。) 文字を選択してから、アピアランス
「ウェブリブログ」は 2023年1月31日 をもちましてサービス提供を終了いたしました。 2004年3月のサービス開始より19年近くもの間、沢山の皆さまにご愛用いただきましたことを心よりお礼申し上げます。今後とも、BIGLOBEをご愛顧賜りますよう、よろしくお願い申し上げます。 ※引っ越し先ブログへのリダイレクトサービスは2024年1月31日で終了いたしました。 BIGLOBEのサービス一覧
さりげない光沢感のあるシンプルなボタンの作り方。 特に難しいことをするわけではないけれど、 デザインの1つのパターンとして覚えておけば役に立つでしょう。 作り方は簡単。 レイヤー効果の設定を組み合わせるだけ。 まずはシェイプを使って好きな形を作る。 今回はスタンダードにボタンの形。 まずは光沢感を付けてみよう。 光沢感はグラデーションを利用する。 するとこんな感じになる。 次に、周りを内側の光彩を入れる。 すると、こんな感じでほわっとしたボタンの画像になる。 これだとなんだかしまりが無いので、軽く枠線をつけてボタンとしてしまりを付けてあげよう。 出来上がったボタンがこちら 簡単にシンプルできれいなボタンができた。 あとは好きなテキストを載せればホームページやブログで使えるボタンが簡単にできる。 他にもこちらのチュートリアルもよかったらどうぞ ちょっとした工夫でかっこいいボタンが簡単に作れて
「ウェブリブログ」は 2023年1月31日 をもちましてサービス提供を終了いたしました。 2004年3月のサービス開始より19年近くもの間、沢山の皆さまにご愛用いただきましたことを心よりお礼申し上げます。今後とも、BIGLOBEをご愛顧賜りますよう、よろしくお願い申し上げます。 ※引っ越し先ブログへのリダイレクトサービスは2024年1月31日で終了いたしました。 BIGLOBEのサービス一覧
「Adobe Illutrator」を"Webデザイン"の現場に導入したいけれど「肝心の使い方がわからない!」とお困りの方に向けて、Webデザインに特化した基本的な使い方をお伝えする本連載。第4回目となる今回は、Illustratorの「効果」を用いて、Webサイトには必須の「ボタン」の作成方法を紹介します。 Webサイト上に配置された「ボタン」は、その先にある情報に閲覧者を導くという非常に重要な役割を持っています。閲覧者が「ボタン」として認識することができるのは最低条件として、感覚的に「押してみたい」と思わせるものにしましょう。 ■これまでの記事 【レポート】IllustratorでつくるWebデザイン・入門編 (1)ワークスペースの最適化 【レポート】IllustratorでつくるWebデザイン・入門編 (2)ペンツールの基礎知識 【レポート】IllustratorでつくるWebデザイ
2013年12月25日 Wordpress WordPressのオリジナルテーマの作り方について説明していきます。慣れると簡単なのですが、初心者には少し難しいWordpressのカスタムデザイン。Wordpressのテーマがどのように動くのか、スタティックのHTMLテンプレートにどうやってWordpressの機能をつけるのかを説明していきます。PHPの知識は必要ありませんが(もちろんあった方が楽ですが)、自分でデザインをするためのPhotoshopとCSSの知識は必要です。前回に引き続き、Nick La氏によるWeb Designer Wallを参照しています。 ↑私が10年以上利用している会計ソフト! ※これはWordpress旧バージョンのオリジナルテーマの作り方です。最新版Wordpressを使用してのオリジナルテーマの作り方は「WordPress オリジナルテーマの作り方 3.0+
WordPress のテーマを自作するときに、よく使っているコードのまとめです。主に functions.php に書いている基本的なコードばかりです。私は仕事で Webサイトを作っているので、後半はクライアントさん向けの Webサイト用コードです。 私、Evernote を使ってるんですけど、WordPress をカスタマイズするコード … たくさんクリップしてあって、ちょっとごちゃごちゃしてきたので整理しました … X( その中から一般的に使えるコードだけまとめてみました。個人的によく使うコードなど、一カ所にまとめておきたいなーと思ったのでメモ書きです。全部 WordPress 3.2 になってから、テスト済みです。 WordPress のよくあるカスタマイズ 目次 セッティング関連 ソーシャルボタンを追加 抜粋表示、the_excerpt 関連 タイトルの文字数を制限して表示する 特
Illustrator斜線入りwebボタンの作り方を説明していきます。 上図のようなグラデーションに斜線のかかったwebボタンです。様々なwebサイトで見るデザインですね。実践でも素材としてすぐに使える優れモノです。 webボタンの制作の流れとしては、①グラデーションとブレンドを用いてwebボタンの原型を作成する②クリッピングマスクで切り抜き斜線を表現する③質感を高めるため陰影を作成するです。どれも実践ですぐに使えるテクニックばかりですのでしっかりとマスターしてみて下さい。
おそらく架空のストーリ プログラマ「プログラムを更新しました」 テスター「いきなりエラーがでますよ!動作確認したんですか!」 プログラマ「え、私のところでは動くけど…、キャッシュクリアしました?」 テスター「キャッシュをクリアしたらエラーがでなくなりました」 テスター「でも、ユーザ全員にキャッシュをクリアさせるの?」 今日、JavaScriptやCSSの更新時にキャッシュから読ませない方法を知りました。 先人達は偉大すぎます。 <link href="common.css" rel="stylesheet" type="text/css"> この記述だとサーバ側の「common.css」を更新しても、 クライアント側のキャッシュの「common.css」が使用されて、 サーバ側の変更が反映されない可能性があります。 これをcssやjsにクエリー文字列を付加することで、 「common.cs
ロゴをデザインしたい。 そんなときにおすすめなのが、『45 Rules for Creating a Great Logo Design』。素晴らしいロゴをデザインするための45の法則だ。 以下にご紹介。 3つ以上の色を使わない。 絶対に必要というわけでないものはすべて除外する。 文字はあなたの祖母でも簡単に読めなければならない。 ロゴとはっきり認識できなければならない。 ロゴにユニークな形やレイアウトを取り入れる。 あなたの親や配偶者がデザインについて思うことを徹底的に無視する。 3人以上の人にロゴが魅力的に見えるかを確認する。 有名なロゴの要素を使ってオリジナルだと主張しない。 どんな場合でもイラスト集を使わない。 ロゴは白黒でもかっこよく見えるべき。 逆さにしても認識できること。 リサイズしても認識できること。 ロゴがアイコンやシンボル、テキストを含む場合、それぞれ良さが引き立つよう
フロートした子要素を内包するコンテナが高さを拡張しない問題を解決するためのテクニックはさまざまなものがあります。 その中から、overflowを使った方法とその際に生じる問題点とその解決方法を紹介します。 CSS: Clearing Floats with Overflow [ad#ad-2] 下記は各ポイントを意訳したものです。 はじめに Demo 1: overflow:auto; Demo 2: overflow:hidden; overflowを使って生じる問題点と解決方法 はじめに フロートベースのレイアウトをする際、ラッパーとなるコンテナがフロートしている子要素に対して高さを拡張しないことは、普通によくある問題です。 デモ:1 フロートをクリアする要素を配置して解消した例 しかし、この問題を解決するために、「overflow」プロパティでもできることを知っていましたか? これは
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く