Results for tag "webサービス"

25 Articles
Dirty_Markup1

[Ď] 読みにくいソースコードを一発で綺麗に整えてくれる「Dirty Markup」

お疲れ様です。@Micchy_R

コーダーさんによってマークアップの手法はマチマチですよね。
人が変わればやり方も変わるわけで、ソースコードを見ただけでコーダーさんの丁寧さや正確さが感じられてしまったりします。

丁寧に仕上げてくれる人ならネストもきちんとされていて、他の誰が見ても分かりやすいソースになってますし、
時間がなく急遽対応したものなどは丁寧さもかけて、ネスト?は?みたいな状態で渡されることもあります。

自分自身、読みにくいソースを渡されたときはガッカリしてしまいますし、こういうコーダーさんなんだと残念に思ってしまいます。。
ですが、渡されたものは確認しないといけません。
Dreamweaverなどのアプリケーションを使えば簡単なのですが、使っていなかったり、コーダーさんしか持っていなかったりもするので、
そんな不満を解消してくれるウェブサービスです。

Read More

Am-I-Responsive1

[Ď] 4種類のデバイスでレスポンシブウェブデザインの表示結果を見れる「Am I Responsive?」

お疲れ様です。@Micchy_R

レスポンシブウェブデザインで構築されたサイトを、4種類のデバイスで「表示した時の見栄え」を同時に見れるサービスです。
それぞれのサイズは次のようになっていて、全てAppleの製品の枠の中に収まります。

  • Desktop:1600x992px
  • Laptop:1280x802px
  • Tablet:768x1024px
  • Mobile:320x480px

ココの枠内で見れたから、どういう使い道があるのかと言われると正直分かりません。。
キャプチャを実績に載せるとかしか思い浮かばないのですが、だったら、ちゃんと作りこんだ方がいい気がします。
なので、紹介するにはちょっと微妙かもしれませんが、新たな使い方を教えていただけるとありがたいです。

Read More

Support-Details

[Ď] 確認してもらっているブラウザの環境を簡単に共有できる「Support Details」

お疲れ様です。@Micchy_Rです。

サイトの制作が進んで行くと、どこかのタイミングでクライアントに確認してもらったり、コーダーさんと修正を指示したりという場面が出てきます。
ですが、自分の環境だけエラーが出てる?とか、表示がおかしい?などというのは稀でもなく頻繁にあること。
そんな時にブラウザの環境を相互に教えあって、「どうなってます?」と確認してもらったりすると思います。
細かな部分を調べて、メールに書いて(電話して)ってのはかなり面倒な作業です。

Read More

resizeMyBrowser1

[Ď] ブラウザのウィンドウサイズを指定サイズで表示してくれる「resizeMyBrowser」

お疲れ様です。@Micchy_R

ブラウザを固定のサイズで表示しておきたいことって割と多いと思います。
レスポンシブのサイズ別検証をしたりすると、ブラウザごとにウィンドウサイズを調整するのは至難の技。ブラウザによってはプラグインなどで調整できるようになっていたりもしますが、使い方も個別で面倒。

FireFoxで、IEで、Safariでとか。もう検証するだけでも大変なのに、ブレイクポイントの数だけ何倍にも膨れて行くわけですから、検証前の調整はなるべく簡単にしておきたいところです。

今回ご紹介するのはそんな面倒を解消してくれるウェブサービスです。
プラグインとかではないので、どんなブラウザでも使える便利なサービスです。

Read More

Stylify-Me

[Ď] ウェブサイトの配色やフォントを瞬時に抽出してくれる便利な「Stylify Me」

お疲れ様です。@Micchy_R

twitterなどで話題になっているウェブサービスが目に留まったので、こちらでも紹介したいと思います。
もうタイトルのままなんですが、サイトの配色やフォントを瞬時に抽出してくれる便利なサイトです。
気になるサイトや、参考にしたいサイトの配色から学ぶってのは大事なことです。
配色やフォントはサイトのイメージに直結するので、引き出しを増やすためにも勉強はしておいた方がいいですね。

Read More

TinyPNG

[Ď] PNG形式のファイルを効率良く圧縮してくれるWebサービス

お疲れ様です。@Micchy_Rです。

レスポンシブウェブデザインの浸透し始めて来てまだ間もないですが、画像のサイズにかなりシビアになって来たと思います。
同じ画像をPCでもスマホでも見ることになるので、通信速度の遅いスマホではやはり画像のファイル小さい方がいい訳です。
とは言え、Retinaディスプレイだのと縦横サイズは倍にする必要があったりと。

Googleでも表示速度をランキングの指標にするのが発表されているので、なるべくファイルサイズは小さい有利なのです。

今回紹介するのは無料のWebサービス「TinyPNG」です。
PNG形式のファイルを効率良く、Drug & Dropだけで圧縮してくれる便利なサービスです。
サンプルの画像を用いて簡単にですが紹介します。

Read More

Themegraphy

[Ď] WordPressでブログを制作する前に見ておきたいテーマ収集サイト

お疲れ様です。@Micchy_Rです。

このブログを立ち上げる前にちゃんと調べておけば良かったと公開したので、Wordpressのテーマを収集しているサイトのご紹介です。
自分でテーマを一から作りこむには、かなり込み入った知識が必要です。

少なくとも、HTML、CSSは必須。PHP、JavaScriptなども必要です。
自分は残念ながらPHPの知識がほぼ皆無。。
このブログもフリーのテーマから、少しずつカスタマイズして、今の形に何となく落ち着いた感じはあります。
「LESS IS MORE」を心がけて、なるべく要素も色も減らすように心がけています。

Read More

BuiltWith-Technology-Lookup

[Ď] 「BuiltWith」を使ってクライアントの環境を事前に把握する

お疲れ様です。@Micchy_Rです。

プレゼンをする前に、クライアントの環境を先回りして把握しておくことが出来る便利なサービスの紹介です。
例えば、Webサーバーのプロダクトは何だろう?とか。
例えば、CMSは何を使っているんだろう?とか。

ソースからある程度は読み解くことは出来るかもしれませんが、わざわざ見るのも面倒。
そこで今回は「BuiltWith」を紹介します。

Read More

Top