かつてはJavaScriptを利用していたものの、今ではCSSのみで実装できる10の小技 | Webクリエイターボックス

2017/07/07 1897 users CSS div全体 目次 実装 jQuery小技集

2015年3月17日 CSS 2011年に「 少しのコードで実装可能な20のjQuery小技集 」という記事で数々の便利な制作技を紹介したのですが、時は流れ、今ではCSSのみで表現できるものが多くなってきました。という事で今回はその記事内で紹介した技を中心に、かつてはJavaScriptを利用していたものの、今ではCSSのみで実装できる小技を紹介します。 目次 Div全体をクリックできるようにする... 続きを読む

日本語対応！CSS Flexboxのチートシートを作ったので配布します | Webクリエイターボックス

2017/03/30 1264 users チートシート CSS flexbox Flexbox 通り

FlexboxとはFlexible Box Layout Moduleのことで、その名の通りフレキシブルで簡単にレイアウトが組めちゃう素敵ボックスです。現在ほとんどすべての最新ブラウザーでFlexboxをサポートしており、Flexboxを使ったレイアウト組みが今後のWebデザインのスタンダードとなるでしょう。Webクリエイターボックスでは 以前からFlexboxの使い方について紹介してきた のです... 続きを読む

かつてはJavaScriptを利用していたものの、今ではCSSのみで実装できる10の小技 | Webクリエイターボックス

2015/03/17 1897 users CSS 偶数 div全体 奇数 目次

2011年に「少しのコードで実装可能な20のjQuery小技集」という記事で数々の便利な制作技を紹介したのですが、時は流れ、今ではCSSのみで表現できるものが多くなってきました。という事で今回はその記事内で紹介した技を中心に、かつてはJavaScriptを利用していたものの、今ではCSSのみで実装できる小技を紹介します。 目次 Div全体をクリックできるようにする テーブルの偶数・奇数の行の色を変... 続きを読む

これからのCSSレイアウトはFlexboxで決まり！ | Webクリエイターボックス

2015/02/24 1232 users Fle Flexbox ブラウザー 前々 モダンブラウザー

FlexboxとはFlexible Box Layout Moduleのことで、その名の通りフレキシブルで簡単にレイアウトが組めちゃう素敵ボックスです。前々からあった技術ですが、ブラウザーによって書き方が違ったり、仕様がころころ変わったりと、イマイチ一歩踏み出せない感があったFlexbox。しかしようやくモダンブラウザーでの利用に難がなくなり、実務にも充分使えるようになりました。今回はそんなFle... 続きを読む

Adobe製品の代わりに使える無料アプリ10+ | Webクリエイターボックス

2014/06/26 1056 users Adobe製品 無料アプリ1 GIMP Photoshop

PhotoshopやIllustratorなど、Adobeの製品はクリエイターの必需品のひとつとなっています。しかしその値段からなかなか手が出せない…という方も多いのではないでしょうか？今回はAdobe製品の代用として使える無料アプリをいくつか紹介します。金欠の学生さんや、様々な理由から脱Adobeを考えている方の参考になれば幸いです！ Photoshopの代わりに GIMP 長年Photosho... 続きを読む

Web系の人へ！絶対にチェックしておくべきおすすめテック系ブログ20選

2013/02/28 1916 users WEB系 Manaさん Webデザイナー web Web制作

こんにちは！ Web業界の人、もしくはWebに興味のある人なら、日々の情報収集は欠かせません。 しかし、世の中に情報はあふれており、また一日に情報収集できる時間も限られています。 そこで、今回は、「これだけチェックしておけば間違いない！」ブログをまとめてみました！ Web制作 Webクリエイターボックス Webクリエイターボックス 有名なブログですね。 WebデザイナーのManaさんが運営していま... 続きを読む

ECサイトの動作テストに使える、クレジットカードのテスト番号一覧 | Webクリエイターボックス

2012/09/10 1916 users 動作テスト ECサイト クレジットカード デス 動作確認

2012年09月10日 Webサイト制作 オンラインショップで最も使われている決済方法がクレジットカード決済。しかし、過去にオンラインショップを制作したことのあるWeb屋さんは、決済時の動作テスト方法にとまどった事はありませんか？動作確認に自分のクレジットカードを使っていたという人が多いかと思います。私もそうやってテストしていました…が、実は各種メジャークレジットカードではオンライン決算時用のテス... 続きを読む

画像のノイズをきれいに簡単に軽減する方法 | Webクリエイターボックス

2012/07/03 1222 users ノイズ Photoshop ビフォー・アフター 軽減 暗い場所

2012年07月03日 Photoshop 暗い場所や室内で取った写真はノイズが入りやすいですよね。画像を補正する際、意外とやっかいだったりします。Photoshopには「ノイズを軽減」機能もありますが、なんだかあまり変化がなかったり…。そんなノイズを簡単に軽減する方法をいくつか紹介します。ビフォー・アフターの差にびっくりしちゃうと思いますよ！ Neat Image Neat Imageは画像のノ... 続きを読む

ノンプログラマーのためのiPhoneアプリ開発学習ガイド | Webクリエイターボックス

2012/05/15 1883 users ノンプログラマー

「iPhone/iPadアプリを作るのは難しい」。デザイナーの人は特にそう思い込んでいませんか？確かに新しいプログラミング言語を習得するには時間がかかります。しかし、一度「楽しい！」と思えばこっちのものです。その気持ちだけで難しいものも簡単に乗り越えてしまえるもの。そう、もう無敵です！どんなアプリでも作れるようになります！ここではアプリの開発方法よりも、「どうやって楽しく学習できるか」に焦点を当て... 続きを読む

少しのコードで実装可能な15のスマートフォンサイト用小技集 | Webクリエイターボックス

2012/02/22 2032 users 実装 コード 少し

スマートフォンが普及してきて、Webサイトを作る時、スマートフォンサイトも一緒に制作している方も多くなってきていると思います。私もスマホサイトを制作する機会が増え、だんだんEvernoteに保存していたスマートフォンサイトを作る時の小技がたまってきたので、iPhoneで使える小技を中心にまとめて記事にしてみます。いくつかサンプルも作っているので、スマートフォンからあわせてご覧下さい！ スマートフォ... 続きを読む

Facebookページの作り方 2012年1月版 | Webクリエイターボックス

2012/01/10 1105 users Facebookページ Facebook 作り方 使い物 冒頭

一年ちょっと前に「Facebookページを自由にカスタマイズする方法」という記事でFacebookページの作成方法を説明したのですが、Facebookはコロコロ仕様を変更するため、その記事を読んでもFacebookページは作れませんｗ 今や使い物にならない記事にもかかわらずアクセス数はかなりあるので、訂正…というか新仕様にあわせたFacebookページの作成方法を説明します。 冒頭でも書きましたが... 続きを読む

WordPressでどんなサイトでも作れちゃう気になれる無料プラグイン9個 | Webクリエイターボックス

2011/11/29 1659 users WordPress プラグイン マルチサイト機能 機能 少し

WordPressのプラグインってすごいですよね。少しカスタマイズするだけで思い通りの機能のついたWebサイトを作ることができます。今回は「えっ、こんなことまでできちゃうの？」と思わせてくれるような高性能プラグインをいくつか紹介します。WordPress 3.0から追加されたマルチサイト機能を使えばWebサービスとして運営することもできそうなもの多め。どんな風に使おうかわくわくしちゃいますよ！ 1... 続きを読む

特殊な用紙・加工でかっこいい名刺が作れる印刷会社いろいろ | Webクリエイターボックス

2011/08/17 1220 users 用紙 かっこいい名刺 木目 和紙 加工

以前も「印象に残る名刺の作り方」などで名刺デザインについて触れたのですが、「こんな名刺はどこで印刷してもらえるの？」という質問をいくつか頂いたので、今さらながらまとめてみました。和紙や木目の素材、透明な名刺や型押し加工など、思い通りのデザインが実現できるかも！オンラインで注文できるので、気軽に利用してみてください！ データ入稿ガイド 今回紹介する印刷会社さんはすべてデータ入稿可能です。どの会社もデ... 続きを読む

少しの手間で大きく変わる、細部にこだわったWebデザインを | Webクリエイターボックス

2011/08/02 1264 users 細部 手間 webデザイン 少し

「デザインしてみたけどなんだか物足りない…」そんな経験ありませんか？私はよくあります。それで色を変えてみたり、形を変えてみたりと色々試してみるのですが、結局どれもしっくりこなかったり。そんな時は元のデザインにほんの少し手を加えるだけで納得のいくデザインに変わることが多いんです。わずかな装飾で大きく印象を変える。そんな「ひと手間」に注目してみましょう！ グラデーションを加える 「デザインしてみたけど... 続きを読む

4年半の英語学習でした事・しなかった事 | Webクリエイターボックス

2011/07/06 1177 users 英語学習 4年半

前々から「Manaさんはどうやって英語の勉強をしたんですか？」と聞かれる事が多いのですが、前回の「海外在住Web屋の私のまわりで最近話題の5つのWebサービス」という記事を書いてさらに増えてしまい、もう記事にしてしまえ！という事で今までしてきた英語の勉強方法をまとめてみました。Web関連の記事以外は書くつもりはなかったのですが、今回はお許しくださいまし。 まずはここから！身の回りの物を英語環境に ... 続きを読む

Web屋の私がブックマークしているサイト65 | Webクリエイターボックス

2011/06/29 2874 users フック Ｗｅｂ屋 チュートリアルサイト フォント 目次

久しぶりに自分がブックマークしているサイトを整理してみました。昔から変わらず愛し続けているWebサービスやチュートリアルサイトなど多数あったので一挙にご紹介します！有名どころからあまり知られていないけど便利なサイトまで、多数あるので時間のある時にじっくり見てみてください！ ブックマークしているサイト 目次 Webサービス デザイン関連 画像関連 CSS jQuery WordPress フォント ... 続きを読む

WordPressの管理ページをより便利にカスタマイズする方法13 | Webクリエイターボックス

2011/05/18 1173 users WordPress 目次 クライアント カスタマイズ 裏側

WordPressを使ってWebサイトを作る際、自分のサイトならさほど気にならない管理画面も、クライアントに納品するのであれば少し手を加えて使いやすくしておきたいところ。少しデザインを変えるだけ、機能を追加・削除するだけで「オリジナル感」がでますよね。今回はそんなWordPressの裏側、管理ページのカスタマイズ方法を紹介します。 WordPressの管理ページをカスタマイズ　目次 管理バーを消す... 続きを読む

空いた時間でお小遣い稼ぎ！フリーランスWeb屋さんにおすすめのサブプロジェクト | Webクリエイターボックス

2011/05/11 1676 users サブプロジェクト フリーランサー フリーランス スキル 収入

フリーランスWeb屋さんの皆さん、フリーランスの仕事はどうやって探していますか？また、依頼がない時のサブプロジェクトは持っていますか？会社をやめ、フリーランサーとして仕事を始めたばかりの頃は、多くの人が「依頼のない、空白の時間」を体験してしまいがちです。そんな期間を有効活用すれば、フリーランスとしての収入も増えると同時に自分のスキルを磨く事もできます。今回はフリーランサーさんの「サブプロジェクト」... 続きを読む

カテゴリー別配色アイデア100 | Webクリエイターボックス

2011/04/26 2459 users カテゴリー別配色アイデア100

配色によってそのデザインの印象は大きく変わると思います。色は大切な要素のひとつですね！ということで、色の持つ印象別に配色アイデアをずらりと並べてみます。配色はおなじみ（？）のCOLOURloversから、「これは！」と思うものを選ばせて頂きました。素敵な配色がいっぱいのこのサイト、ぜひ覗いてみてください！また、今回紹介するのはあくまで一例ですので、自分なりにアレンジしてみるのも楽しいと思います。サ... 続きを読む

生活をもっと便利に・楽しくしてくれる無料Webサービスいろいろ | Webクリエイターボックス

2011/04/05 2371 users ファイル web URL ファイル送信サービス WEBサービス

「こんな事がネットでできると便利なのになあ」と思った事はありませんか？生活に「便利」「楽しみ」をくれるサービスが無料であれば嬉しいですよね！ということで、今回はWebに詳しくない人でも簡単にはじめられるWebサービスを紹介します。中には会員登録も不要なものも！今直ぐ試してみてください！ファイルシェアSendoidSendoid会員登録不要のファイル送信サービス。ファイルをアップロード後にURLが生... 続きを読む

プロジェクト管理ツール「Basecamp」の使い方 | Webクリエイターボックス

2011/03/08 1002 users Basecamp 37signals 言語 アカウント 作成

「海外Webサイト・海外Web屋の特徴」でも少し紹介したプロジェクト管理サービス、Basecamp。「日本語版があれば使ってみようかな」という人がいたのですが、実は日本語に対応しているのです！アカウントの作成、言語の設定を含めた、Basecampの簡単な使い方を紹介します！Basecampとは？Basecampは37signalsが提供しているオンラインプロジェクト管理ツール。「よりシンプルに使い... 続きを読む

海外Webサイト・海外Web屋の特徴 | Webクリエイターボックス

2011/03/01 1171 users 海外Web屋 特徴 海外Webサイト ウェブデザイン ブランド

以前「日本向けのウェブデザインというのはあるのか?」という記事を読み、「逆に海外のサイトは具体的にどう違うかなあ？」と思ったので、私が感じた海外のWeb業界やサイトの違いを並べてみます。海外向けのWebサイト制作を考えている方、海外で働こうと思っている方の参考になればと思います！海外Webサイトの特徴URLを直接入力日本ではURLバーに直接入力する人は少ないかと思われますが、海外では目的のブランド... 続きを読む

Firefoxで使用していた＆Chromeで使用中の拡張機能 計36個 | Webクリエイターボックス

2011/02/17 1549 users Firefox エクステンション アドオン Chrome 機能

以前「ChromeからFirefoxに戻した6つのくだらない理由」という記事を書いてから約８ヶ月。久しぶりにChromeをいじってみると、エクステンションの数も増え、いろいろと進化しているようです。「Firefoxにあるこの機能がChromeであれば移行するのに…」と思っていた事がだいぶ解消されたので再びChromeに復帰しました！そこでFirefoxに入れていたアドオンと、Chromeで使用し始... 続きを読む

少しのコードで実装可能な20のjQuery小技集 | Webクリエイターボックス

2011/01/24 2967 users 実装 jQuery小技集 コード jQuery 少し

素敵な動きを手軽に実装できるJavaScriptライブラリ「jQuery」。jQueryには多くのプラグインが揃っていますが、以前書いた「少しのコードで実装可能な20のCSS小技集 」に続き、今回はプラグインなしで実装できるjQueryの小技を紹介します！「jQueryってなんだ？」という人もコピペで実装できますよ！サンプルも用意したのでぜひご覧ください！ jQueryの基本的な使い方 まずはjQ... 続きを読む

人生をより楽しくさせる100の方法 | Webクリエイターボックス

2010/11/29 2286 users SEO フレーズ スレ 人生 納期

今、あなたは自分の人生に満足していますか？もしそうでないなら、今回の記事が役に立つかもしれません。より素敵な人生を送るためのライフハックです。SEOに疲れたとき、1pxのズレで残業したとき、納期から逃げたくなったとき（※どっかで聞いたなそのフレーズ）に、ぜひ読んでみてください！ Webクリエイターボックスを始めた理由 実は約一年前、毎日なんだか退屈だな…と思っていたときに、今回紹介する「100 W... 続きを読む