BLOG CATEGORY

Monthly Archives

長フチコンテンツ

ホームページ制作、SEO対策 サイバーアクセル・アドバイザーズTOP » ブログ » webコラム» 【Web制作効率化】痒いところに手が届く便利な5+1つのWebツール

このエントリーをはてなブックマークに追加

【Web制作効率化】痒いところに手が届く便利な5+1つのWebツール

   投稿日: 2015/03/01    投稿者:webコラム

どうもー、ジャッキーです~。
Web制作時の様々な場面で役に立ってくれる便利ツールのご紹介です。

今回は、主に「CHECK!」をキーワードにしたWebツールです。


check.jpg


◆ブックマークレット

ブックマークレットとは、ブラウザのブックマークに登録して使います。
(JavaScriptのプログラムを「ブックマーク」に登録しておいて、必要なときにプログラムを実行させて、簡単に呼び出せる機能です。)

1.XRAY
http://www.westciv.com/xray/
簡易的に画像や要素のプロパティー、idやclass名などをCHECK!。
デベロッパーツールまでも使う必要がないときは、これをよく使っています。



2.MRI
http://www.westciv.com/mri/
上のXRAYと似た感じのブックマークレットですが、こちらは指定したセレクタをハイライトしてくれます。
cssの編集などのときにCHECK!


3.
alt属性を確認するブックマークレット
http://www.trustworks.biz/blog/2008/04/alt.html
制作後のチェックとして、メタ要素やリンクチェックなどありますが、忘れていけないのが画像にalt属性ですね。入れ忘れや、適切な文言が入っているかをCHECK!


4.HTML内タグの閉じ忘れをチェックするツール
http://tockri.blog78.fc2.com/blog-entry-168.html
ページのレイアウト崩れはタグの閉じ忘れが意外と多かったりします。
そんなときにはコレでCHECK!



◆Webツール
5.ページ情報を一括表示
http://geturlinfo.com/
URLを入力して「Get URL Info」をクリックすると、そのページのtitle、description、keyword、サーバー情報など、基本情報を一括してCHECK!


6(+1).Dynamic Dummy Image Generator
http://dummyimage.com/
制作時にまだ画像が決まっていなくて、ダミーで入れておきたい場合ってありますね。
そんなときに便利なのが、Web上簡単にダミー画像を作れるダイナミックダミーイメージジェネレーターです。


最後に
ブックマークレットやWebツールは、PCが重くならずに使えるのが利点ですね。
便利なツールはたくさんありますが、場面ごとに色々と使い分けて、出来る限り作業を効率化して1つでも多くのタスクを確実に進めていきたいですね。

では、また次回!

カテゴリ:

TOPへ