CSS専門のスニペット共有サイト・CSSPop
コードスニペットを共有できる Webサービスは沢山ありますが、 CSSPopはCSSを専門としたコード 共有サイトです。なかなか珍しい し、結構便利な小技も見かけま した。 CSS専門のスニペット共有サイトです。動作デモも見る事が出来ますよ。 CSSのコード共有サイト。ユーザー登録も出来ますが、しなくてもコードを書いてデモを確認する事も可能です。 Findからコードを探せます。サムネイルがあるので探しやすい。カテゴリはdiv、input、buttonなどのDOM要素で分けられています。 Createでコードを書く画面に進みます。入力項目はHTMLとCSSで、書くと同時にプレビューに繁栄されます。あとはtypeと説明を書けばOKです。 結構見ちゃいますね。数も結構揃っています。 CSSPop
サイト構成 - かちびと.net
【２００９・５・３１最終更新日】 ※情報は非常に古いです。参考になさいませんようご注意ください。 かちびと.netはWordPressというオープンソースのCMS（コンテンツ・マネジメント・システム） で作成しています。WordPressにはテーマスキンを簡単に変更出来る事も特徴のひとつで、 私もあるテーマをベースに、かちびと.netのような独自のテーマスキンを作成しました。 そのカスタマイズ法を一つも隠さず書いて置きます。 もくじ カテゴリごとに違うsingle.phpを呼び出すカスタマイズ法 WordPressのテーマSEOハック 使用しているプラグインの解説 WordPressに関する雑感 便利な便利なブログパーツ Twitterが好きなんです かちびと.netは完成しない カテゴリごとに違うsingle.phpを呼び出す 通常、WordPressは記事にsingle.phpが割り当
WordPressのオリジナルテーマ作成フロー・基本マニュアル
初めてWordPressオリジナルテーマの作成にトライしたい、という方向けの基本のマニュアルです。マニュアルというほど大袈裟なものではありませんけど、ある程度敷居が低くなると嬉しいなぁという思いを込めて記事にします。 この記事の内容はあくまで基本中の基本で、初心者・ノンプログラマー向けとなっていますので応用的な情報は殆どありません。また、説明の仕方も分かりやすさ重視で、厳密的にはちょっと違う点もあります。 初心者さん向けに、もう少し情報があってもいいかなと思って、書いてみることにしました。僕もまだまだ初級レベルなので一緒に学んでいきましょう。初級者レベルでこんな記事書くなって話ですけども。 目次 目次です。各セクションで必要と思う場所から見るようにしてください。 はじめに 作成するWebサイトの目的と構造 テーマ作成前に用意するものと環境 テーマの構造を（触り程度だけでも）理解する HTM
WordPressを使ってWeb制作をする為の手順リスト・【改正版】+α - かちびと.net
以前書いたWordPressでWeb制作する際 の手順リストが少し古い情報込みだったり するので改正版を書きます。先日、WPも 3.2のリリースを迎えましたので、手順リスト もアップデートすることにしました。多少考え が変わっているので内容も少し変更有ります。 以前のリストの改正版です。加えて他の情報も一緒に載せておく事にしました。 【2011・07・11】 WordPressインストール サーバーを用意（PHP5.2.4 以上 / MySQL5.0 以上） DBを作成 WordPressをダウンロードし、解凍 wp-config-sampleをwp-configにリネームし、内容をDBに合わせて変更 プリフィクス（接頭語）を変更する（wp_→foodblog_） FTPソフト等でサーバーにアップロード サイト名やパスワード、IDを決める（adminは避ける） 作成したユーザー名でログイン
より早くcssやhtmlのコーディングが行えそうな情報いろいろ - かちびと.net
Web制作を少しでも効率化しよう と思って（今更）いろいろ便利そう な情報を探しました。既に使って いる情報の方が多かったのです が、折角調べたのでシェアしたい と思ってエントリーです。 コーディングをもっと円滑に、という旨の情報です。順不同。あんまり多いと逆効果なので量は絞りました。一応これでも絞りました。絞ったつもり。 zen-coding 話題になったzen-coding。だいぶ慣れて来た方もいらっしゃるのでは。 zen-coding（本家） HTMLコーディングが3倍速くなる？「Zen-Coding」 秀丸Zen- Codingマクロ コーディングの効率化を図るZen codingをDreamweaver cs4に入れる方法 WP Zen-Codingが凄く便利 初期設定とかTipsとか 制作前に知っておくと便利なコードとかTipsいろいろ。 css書く前にチェック。 もう、cla
2010年度版・とても参考になった国内のWeb制作関連エントリーまとめ - かちびと.net
少し気が早いですが、今年も残すところ あと僅かです。ここで、Web制作をする にあたって、個人的に、とても参考にな った素晴らしいエントリーをご紹介します。 基本的にまとめ記事が大好物なので、 まとめのまとめ、という形になってしまい ますがご了承願います。 まぁ、単なる個人的なメモです。今年はお世話になりました、という感謝の意を込めてリンク&トラフィックで返したいのと、自分の復習用リンク集です。来年もたぶんお世話になる記事だと思いますので、備忘録も兼ねて。順不同です。 尚、当ブログのエントリは御礼の場であるこの記事では割愛しています。後日、別記事にてまとめさせて頂きますので、宜しければ御覧ください。 デザイン 読み物系が多いです。正月とかで見直す用。 配色パターンからWebデザインを考える ウェブデザインでこれは気をつけたいの35のポイント デザインQRコードの作り方 非デザイナーのための
Web制作に役立つ、何度お勧めしても足りないくらい素敵なツール10選 - かちびと.net
Web制作時、個人的にかなり助かっ ているWebアプリやソフトウェアなど をご紹介。何度お勧めしても足りない 位、助けられています。低スキルな 自分にとっては無いと困る。そんな ツールをシェアしたいと思います。 もっと沢山あるんですが、特に利用しているものを。制作時には毎回利用しているかもしれません。基本的に無料のものを使っています。順不同。 960 grid system グリッドシステムです。ブックマークレットも含め、色々手軽なのが嬉しい。何よりグリッドレイアウトはお客さん受け良い傾向にある気がします。 960 grid system Firebug Web制作といえばFirebugですが、僕はChrome派なのでChromeエクステンションのLite版を使っています。元々、Chromeにはデベロッパーツールがありますし、FxのFirebugも使いこなせてなかったのでこれで十分。 Fi
英語が出来なくても海外サイトを楽しむ為の翻訳アドオンと有名ブロガーが参考にしているブログ36選
日本の有名なWeb関連のブロガーさん方 だけでなく、海外でも常に注目される ブログサイトをご紹介します。英語が 分からない方は翻訳ソフトを使えば ある程度は分かるものです。 英語翻訳に役立つFireFoxアドオンを 数点ご紹介し、その後に注目サイトをご紹介します。 有名ブロガーさん達も厳選して情報を提供されているので 翻訳されなかった優良エントリは自分で何とかしないとですね。 翻訳が必要無い方はお先に目次へどうぞ。 海外サイトへの抵抗を大きく下げる３つのFireFox翻訳アドオンPopinとにかくお手軽です。 テキストをドラッグ するとアクションボタン が表示されるので 翻訳を選択すると その場でGoogle翻訳 を表示します。 ちょっとした文章や単語に。 Popinをインストール 検索ステーション サイドバーに翻訳 機能を加えられ ます。エキサイト他 数種類から選択 できます。これも そ
最近見つけた完成度の高いフリーのWordPressテーマ - かちびと.net
最近知ったthemes2wp.comというサイト のフリーのWordPressテーマで、個人的 に完成度高いなと感じたテーマをいくつか ご紹介したいと思います。完全に主観が 入っているので参考にならなかったら ごめんなさい。 ここで言う”完成度が高い”、というのは「使いやすそう」「変更箇所が少なそう」という意味です。いいデザインにしたいけどカスタマイズは面倒・・・という方にお勧めです。11個あります。 [note]ワームのご報告を受けて全テーマへのリンクを削除しました。テーマは沢山ありますのでテーマカテゴリでお探しになってみてください。[/note] BlockStock Theme 非常に綺麗なテーマです。シンプル系がお好きな方なら殆ど変更する箇所無さそうな気がします。個人的に凄く好きなテーマです。 ※「誰がために鐘は鳴る」さんよりご指摘を受けてリンクを削除しました BlockStock
全てのWordPress使いが導入を検討すべき１５のプラグイン - かちびと.net
今日も飽きずにWordPressネタです。 WordPressを使ってブログやCMSとして Webサイトを運営するにあたり、 「最低限これだけは考えた方がいい」と思う事と、 それに対応するプラグインをまとめてみます。 あんまり多いとウンザリするので 適当に数を絞りました。 必要と感じるかは運営形態によるでしょうが、ユーザー目線と 運営者目線で「導入すべき」と考えたプラグインです。 基本 何が基本で何が応用なのかは個人差がありますので主観でGoです。 Akismet 標準装備されていますが、海外スパマーのスパムコメントは日本スパマー を大きく凌ぐエグさです。WP自体、スパコメ対応は優れてる（と思う）のですが、 Akismetは簡単に導入できるので入れておきます。APIキーをWordPress.orgで 手に入れることで機能します。 Permalink Redirect 必ずパーマリンクで表示
Photoshop関連まとめ - かちびと.net
Photoshop関連のまとめです。 ブラシやパターン、シェイプ チュートリアルを書いている ブログ、プラグイン、アクション などなどのまとめ、というか 個人的なリンク集です。シェア したいと思ってエントリします。 おそらく抜けてる有益サイトもありそうなので参考程度になさってください。海外サイトが殆どにどうしてもなってしまいますが、殆どは図解入りなので、英語が読めなくてもある程度分かるかと思います。バージョン、ライセンスに関しては表記し切れませんので個々でお確かめ下さい。 配布サイトはフリーをメインにしています。あと、カテゴリ分けはしていますが、結構適当です。 配布サイト ブラシ・シェイプ・パターン ブラシや、カスタムシェイプ、パターンの配布サイト WeGraphics / フリーブラシカテゴリ。11セットほど配布 Brushesdownload / ブラシ配布専門のサイト Gfxfeve
psd2cssを使ったらPSDファイルからWPテーマを数分で作れたけど・・ | かちびと.net
オンラインでPSDファイルからcssを 作成してくれるpsd2cssというWeb サービスがあるのですが、通常は cssとhtmlを作成するこのサービス でWordPressのテーマを作成する 事が可能です。一応は・・・その方法 を今日はご紹介します。 方法は至って簡単、Photoshopで作成したPSDファイルのテンプレートにレイヤーを2枚加えるだけです。ただし、細かい部分まで作れるのではなく、cssでレイアウトを作ってくれる通常のサービス内容に同梱されているhtmlをWPのテーマファイル用index.phpにするサービスみたいですね。 psd2cssはPSDファイルからcssを作ってくれるWebサービスですが、応用してWPテーマを作成出来るようになっています。 試してみる 上記のPSDで試してみます。使ったPSDのテンプレートはLayout Profissional by ~justi
12000種以上のPhotoshopブラシをストックしている検索エンジン・FindBrushes - かちびと.net
Photoshopのブラシを検索できる FindBrushesのご紹介。検索と 言うか、アイコンを探せる検索 エンジン、Iconfinderと同様で、 インデックスされたブラシを検索 する形ですが、量はかなりのもの。 目的から探せるのが検索系のいい所ですよね。FindBrushesには現在600セット以上、総計12000種以上もストックされているので覚えておくと役に立ちそうです。 シンプルな設計ですし、軽いので探すには最適かも。 カテゴリからも探せる 左上のメニューからカテゴリで探す事も可能なのでキーワードが思いつかない、という方はカテゴリで探してはいかがでしょうか。 例1・グランジ系を探したい グランジ系のブラシをお探しなら「grunge」で検索します。数は90と出ますが、ブラシはセットになっているので量としてはかなり豊富ですね。 例2・木のブラシを探したい treeで検索。検索スピード
サイト公開前に役立ちそうなフリーのツールやWebサービスいろいろ
Webサービス公開前にサイトをチェック Webサイトを制作して公開する際は おかしいところが無いか、不備は 無いか不安になったり、という方も 少なくないのではないかと思います。 Webサイトを制作して公開する際は おかしいところが無いか、不備は 無いか不安になったり、という方も 少なくないのではないかと思います。 そこで、公開前に色々と確認出来たり、 最適化できる様なフリーのサービスや フリーソフトをご紹介します。 ここで言う「公開前」とは「サーバーにアップする」事ではなく、公開を告知したり、プレスリリースを出す前の状態とお受け下さい。ローンチ前と書くべきだったかもしれませんね。。誤解を与えていたら申し訳ないです。 では、ブラウザチェックツール、モニタ別表示チェック、表示スピードチェックツール、cssや画像の最適化ツール、などなどご紹介していきます。 ブラウザチェック各ブラウザでどのように
フリーで配布されているPhotoshopのパターンいろいろ
以前、必要になった時に探したサイトをメモ。 Photoshopのパターンを配布してくれている サイトのまとめです。多くの場合はセット配布 や、Photoshop関連の専門サイトなので まとめのまとめという形になります。全て無料 ですが、著作権は個別にご確認下さい。 何かと重宝するPhotoshopパターン。全てフリーでダウンロードできます。 208 Retro Photoshop Patterns レトロなPhotoshopパターン208種。 208 Retro Photoshop Patterns 200+ free beautiful Photoshop patterns hand-picked 200以上ものPhotoshopパターンまとめ。 200+ free beautiful Photoshop patterns hand-picked Web treats Web treat
cssの情報・まとめ - かちびと.net
cssの情報まとめです。ローカル 環境にストックしていた情報を 開放してみますのでシェアして 頂ければ幸いです。内容は 結構偏っていると思いますので 参考程度になさってください。 全てのcss情報が有るわけではありません。主観でストックしていたリンク集です。ツールとかメニュー関連とかハックとかいろいろ188の情報です。 ツール オンラインのcssツール。 CSS Validation Service / W3C検証サービス日本語版 RoundedCornr / 角丸のHTML・CSSコードを生成してくれる CSS Type Set / ファミリー、色、単語間、行間等をプレビューで確認 CSS Text Wrapper / 様々な形のテキストの回りこみを簡単に実現できる CSS Builder / オンラインでスタイルを生成可能 Spiffy Box / cssによる角丸を簡単に生成 The
商用サイトでも無料の国内外のWeb制作に使える素材サイト総まとめ・2009 - かちびと. net
ローカル環境にストックしていた日本国内、海外サイトで商用OKなWeb素材を配布しているサイトのリンク集が結構な量になってきたので出来る限り多くの方とシェアしたいと思ってエントリーします。 懐の広いクリエイターさん方に感謝します。このリンク集は商用サイトでも利用が可能（Commercial use）なWebサイトの素材情報です。一応確認はしていますが、ご利用の際はご自身の目で必ずライセンスや利用規約（Terms of Use等）をご確認下さい。サイトごとに利用規約も異なります。当サイトは一切の責任を負いかねます。 日本国内、及び海外の商用OKなWeb素材配布サイトと日本語で紹介された海外記事のまとめです。 2度手間を防ぐ目的でリンクにマウスオーバーすると画像をツールチップで表示するようにしました。多少表示に時間掛かるかもしれません。 写真 商用サイトでも利用できるロイヤリティフリー、パブリッ
【商用可】パブリックドメインやGPLのフリーフォント158個まとめ - かちびと.net
商用可能なフリーフォントを158個＋α紹介します。フリーのフォントで常に話題になるのが著作権問題です。商用は不可だったり、ダウンロードしないと分からなかったり、著作者に聞かないと分からなかったり、色々と不安だと思うので、少しでも安心してビジネスでも使えるように、配布先にパブリックドメインやGPLライセンスと明記されているフォントのみをまとめました。全て商用利用が可能です。 今のところは158のフォントと、日本語で商用OKなフリーフォントは既出なので紹介記事へリンクしました。今後も追加できたら追加していきます。リンク先にはパブリックドメイン、GPL表記がありますが、全てをDLして確認した訳ではありませんので一応Readmeテキストが同梱されていたら目を通しておくと確実かもしれませんね。 記事を軽くする為に画像はgifにしました。キャプチャして縮小してるだけなので荒いですがご了承下さい。 商用
背景などに使えそうなフリーの和風テクスチャ素材いろいろ - かちびと.net
知人に頼まれて和柄の テクスチャを探していましたが その過程でいくつか見つけた素材 をメモしておきます。フリーの 日本風なテクスチャ素材です。 背景に使えそうなものが中心です。 何に使ってもその方の自由ですけどｗ 多少はメモしていますが、著作権はご自身でお確かめ下さい。 Japanese Textures 15種類の和壁、和紙や漢字が書かれた紙のテクスチャ。商用利用可。 Japanese Paper Textures 14 High-Res Japanese Paper Textures 和風の高品質なテクスチャ14種類が個人商用ともに利用可能。 14 High-Res Japanese Paper Textures Fireworksの和風・伝統紋様テクスチャ 商用OKの和風パターンテクスチャ。 Fireworksの和風・伝統紋様テクスチャ Paper Texture Pack 02 か
国産限定・Web制作時に覚えておくと便利な14のフリーのWebサービス - かちびと.net
最近、国産のWebサービスも かなり勢いがあるなぁと思ったので ちょっとまとめてみました。よく 紹介されるのは海外製ですが、 それに劣らないMade in Japanの Web制作者が知っておくと便利そうな フリーのWebサービスをご紹介します。 順不同です。日本語が完全に通じる海外Webサービスも今回は省いて純国産のWebサイト制作に一役買ってくれそうなWebサービスをご紹介したいと思います。出来る限り高性能だったり多機能なWebサービスのみにしたつもりですが主観入ってます。 Color of Book 国産サービスで一番多用しています。AmazonAPIを使って雑誌の表紙を抜き出し、その表紙からカラーチャートを生成。アイデアが素晴らしいですね。雑誌は表紙のデザインや色で惹きつけるよう考えられている事が多いのでWeb制作時のカラー選定にかなり参考になるのでは。 Color of Book
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
