コーディングのスピードを上げる為の6つの方法
2017年7月25日 Webサイト制作, 便利ツール 今より少しでもコーディングを早くできれば、細かいデザインや機能にも時間をかけて取り組めそう…という事で今回はコーディングのスピードを上げるためにできる事を紹介します。便利なツールを使ったり、ちょっとやり方を変えるだけでより早くコーディングができるようになると思います！ ↑私が10年以上利用している会計ソフト！ 1. コーディング手順を簡略化する これは自分のコーディング能力を高めて手順を省く、便利なツールを使って手間を省くという事です。例えば私は昔このような手順でコーディングを進めていました。 CSSのレイアウトをノートに書き出す レイアウト部分（ヘッダー・メイン・サイド・フッター）のHTMLマークアップ CSSでレイアウト部分のスタイリング 表示確認 うまく表示できない箇所の修正 ヘッダー内のHTMLマークアップ CSSでヘッダー内の
クオリティーの高いアイコンデザインチュートリアル35 – creamu
98125356/ iStockphoto/ Thinkstock かっこいいアイコンを自分で作りたい。 そんなときに参考になるのが、『35 icon design tutorials in Photoshop and Illustrator』。クオリティーの高いアイコンデザインチュートリアル集です。 Photoshopと、illustratorのチュートリアルがたくさん紹介されていますね。かなり細かく解説されているのでわかりやすいのと、psd、ai(eps) ファイルがダウンロードできるものもあります。 How to Make a Professional Buddy Icon in Photoshop Photoshopでスーツ姿の男性のアイコンを作るチュートリアル Icon design tutorial:How to make a Calendar icon iCalのような、カレ
アイコンデザイナーになりたい人のためのPhotoshopチュートリアル15選『Want to be an Icon Designer? 15 Amazing Photoshop Icon Tutorials.』 | CREAMU
Design アイコンデザイナーになりたい人のためのPhotoshopチュートリアル15選『Want to be an Icon Designer? 15 Amazing Photoshop Icon Tutorials.』 アイコンをデザインしたい。 そんなあなたにおすすめなのが、『Want to be an Icon Designer? 15 Amazing Photoshop Icon Tutorials.』。アイコンデザイナーになりたい人のためのPhotoshopチュートリアル15選だ。 以下にご紹介。 » Traffic ConeアイコンをPhotoshopで描く方法 » 本のアイコンを作る方法 » Mac OS Xのメールアイコンのようなデザインをする方法 » Mac OS X用のアイコンを作る方法 » グラフのWebボタンを作る方法 » Photoshop CS3のアイコンを
PhotoShopでMac風の美しいバックグラウンドを作成するチュートリアル:phpspot開発日誌
Creating a Mac-Type Background in Photoshop This tutorial is about making a “mac” style background. PhotoShopでMac風の美しいバックグラウンドを作成するチュートリアル。 次のような背景画像をPhotoShopで作るチュートリアルです。覚えておくとサイトデザイン時などにかなり活用できそう。 次がその流れ。 作っている工程も、徐々に背景が出来ていって、なかなか楽しい感じですね。 関連エントリ 人物の写真をPhotoShopで美しく修正するチュートリアル PhotoShopでRSS標準アイコンを作成するチュートリアル PhotoShopでタバコの煙風クール画像を１から作るチュートリアル
jmblog.jp - Web2.0っぽいグラデーションのコツ
そろそろ「Web2.0的デザイン」という言い回しが恥ずかしくなってきましたが、それはそれでおいといて。グラデーションは今っぽいデザイン（ちょっと言い方を変えてみた）では外せない要素と言えるかと思いますが、プロのデザイナーの方はさておき、素人が挑戦すると、色の選択に失敗してイマイチ・・・なんてことになりがちです。 » A Gradient Tutorial » 9rules Network Official Blog こちらのサイトでは、グラデーションを作る際のポイントが説明されています。 さて、どれが一番きれいでしょう？1 は彩度（鮮やかさ）が足りません。上のサイトでは「a classic problem」と紹介されています。2 はマシですが、ちょっと素人臭さを感じます。まぁ好みは人それぞれだと思いますが、やっぱり 3 が一番きれいだと思います。 ちなみに僕は、次のようにしてグラデーション
【Gimp特集】GimpでWeb2.0風-反射ロゴを作ろう！*二十歳街道まっしぐら
★新URL：http://20kaido.com/ ★新RSS:http://20kaido.com/index.rdf いままでFC2ブログで5年間、お世話になりました。感謝です。 移転先でもよろしくお願いいたします！ 二十歳街道まっしぐら（FC2ブログ時代）人気記事TOP50まとめ Gimpによる画像作成を「特別企画」の【Gimp特集】として まとめることにしました。 過去記事：【Gimp特集】Gimpで飛び出す写真を作ろう！（初心者向け） ======================================================= 【目次】（クリックすると、各ステップへ飛びます。） ステップ１：文字を書く ステップ２：反転させる ステップ３：アルファ（透過）をかける ==================================================
GimpでWeb2.0風バッジを簡単作成！*二十歳街道まっしぐら（FC2ブログ時代）
★新URL：http://20kaido.com/ ★新RSS:http://20kaido.com/index.rdf いままでFC2ブログで5年間、お世話になりました。感謝です。 移転先でもよろしくお願いいたします！ 二十歳街道まっしぐら（FC2ブログ時代）人気記事TOP50まとめ Gimpを使ってWeb2.0風バッジを作ります。 -------------------------Gimp特集------------------------- 過去記事：Gimpで飛び出す写真を作ろう！（初心者向け） 過去記事：GimpでWeb2.0風-反射ロゴを作ろう！ ---------------------------------------------------------- ☆ GimpでWeb2.0風バッジを作ろう！ ☆ =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
Web2.0風デザインのための秀逸チュートリアル68選 | S i M P L E * S i M P L E
こ、これはかなり使えます・・・。 が、とっても紹介が難しいのでさらりと。今回は実験的なエントリーとして画像一切なしで。 『Web2.0風デザインのためのチュートリアル68選』です。 » Web 2.0 Webdesign-Tutorials | Dr. Web Weblog 以下の7つのカテゴリーにわかれています。 サイトをこれから作るぞー、という人には大いに参考になる素晴らしきチュートリアルかと思います。 ビジュアル効果系（1～11） ロゴ系（12～25） テキスト（26～33）系 バッジ系（34～39） ボタン系（40～46） レイアウト系（47～60） Web2.0まとめ系（61～68） 個人的には1、2、12、13、40、41あたりが好きですね。今後使えそう。 しかし、こういう海外サイトのまとめをまとめとして紹介するのは難しいですよね・・・。そのまま紹介するのも「どうなの、それ？」
Modern Syntax : CSでのWeb2.0スタイルの角丸上半分テカリボタンの作り方
さて、モダシンラジオのデータをホスティングしてもらっているSpotify for Podcasters(旧Anchor）の私のページはこちらです。 https://podcasters.spotify.com/pod/show/kazuyoshi-nagasawa このSpotify for PodcastersページのRSSは以下になります。こちらのRSSではenclosureタグなどでlength値などがしっかり入っているのでこれを購読しておくとよいかと思います。 https://anchor.fm/s/66ff2830/podcast/rss ここで聴く！という人は以下のプレイヤーからどうぞ。 んで、これまではGoogle Drive上に保存したmp3ファイルを聞きたい方は以下のリンクをクリックしてください。ブラウザ内で聞けます。 https://drive.google.com/f
ステッカーっぽいのを貼ってみる
前々からちょっとカッコイイなーと思ってたステッカーっぽいの。 試しに今回貼ってみました。左上に貼ってあるコーディングコンテストのがソレです。 ちょっとウチのサイトの場合だと横幅があるんできついですが、まぁテストって事で。（外しはしないけど） 知ったのは、ネットのサラダボウルさん。 って事で、詳細をば。 方法はすっごい簡単。 たぶんブログとかにも貼り付けれるんじゃないかな？ まずは←こんな感じで、透過Gifを作成。 どんな感じでもいいのでお好きなように作ります。 透過Gifの作り方云々は、ここじゃ割愛。 そしたら、htmlに以下のような感じで貼り付け。 <p id="sticker"> <a href="/archives/2007/0407_1430.php"> <img src="/img/sticker.gif" alt="Codin Contest 開催中" /> </a> </p>
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Mix and Match a Layout with Patterns, Photos and Backgrounds | Envato Tuts+
hereticanthem co.,ltd. » Photoshop&Illustratorのチュートリアルまとめ
http://designphase.net/photoshop_tutorials
チュートリアル：photoshopで手軽にストライプ模様をつける方法*ホームページを作る人のネタ帳
