個人的に役立ったデザイン素材やTips、WEBサービス、役立つグッズ、あれやこれやをご紹介

HTML,CSS,JSのコードを美しく整形し?部分の指摘もしてくれるDirty Markup

HTML,CSS,JSのコードを美しく整形し?部分の指摘もしてくれるDirty Markup

HTML,CSS,JSのコードを美しく整形し、?部分の指摘もしてくれるDirty Markupをご紹介します。
コードを整形してくれるサービスは多々ありますが、HTML,CSS,JSを1つのサービスで整形してくれるのはここだけではないでしょうか。
おもしろいのは、?なコードについて「こうやったほうがいいんじゃない?」とか「さっきも書いてたよ」といった指摘をしてくるところ。
サイトを作った時はきれいでも、長年運用していると、ほころびが出てしまう場合がありますが、そんなときに知っておくと便利なサービスです。

HTML,CSS,JSのコードを美しく整形してコメントも表示してくれるDirty Markup

Dirty Markupは、HTML,CSS,JSのコードを美しく整形してコメントも表示してくれるサービスです。
HTML,CSS,JSの整形を一つのサービスでまとめて行うことができる、ありがたいサービスです。
利用は簡単で、コードをコピペし、左のメニューで設定をして「Clean」を押すだけ。

?な部分をコメント付きで指摘してくれる

Dirty Markupが便利なのは、?な部分がコード内に発見されたら、コメント付きで指摘してくれるというものです。
たとえば、以下。

HTML,CSS,JSのコードを美しく整形し?部分の指摘もしてくれるDirty Markup

「pのエンドタグだけだよ」と指摘してくれています。

また次の例では、

HTML,CSS,JSのコードを美しく整形し?部分の指摘もしてくれるDirty Markup

「box-sizingプロパティはIE6や7ではサポートされていませんよ」という指摘が。
なかな便利なサービスでしょ。

Dirty Markup

お役に立てましたら、以下どれでも結構のですので、ポチリと……。

  • 0
  • 0
  • 0
  • 6

Amazonアソシエイト・プログラム規約による記載
当サイトはamazon.co.jpを宣伝しリンクすることによってサイトが紹介料を獲得できる手段を提供することを目的に設定されたアフィリエイト宣伝プログラムである、Amazonアソシエイト・プログラムの参加者です。

この記事を読んだ人はこんな記事も読んでいます

グラフィックデザイナーのためのオンラインポートフォリオ作成方法

グラフィックデザイナーの皆さんはオンラインポートフォリオをもっていらっしゃいますか? 持っていない

記事を読む

激易!YouTubeなどの動画やGoogleMapsをコピペだけでレスポンシブ化「Embed Responsively」

激易!YouTubeなどの動画やGoogleMapsをコピペだけでレスポンシブ化「Embed Responsively」

YouTubeやViemoなどの動画、あるいはGoogleMapsをコピペだけでレスポンシブ化できて

記事を読む

画像URLを読み込むだけでCSSのfilterプロパティを試せる「CSS Filters Playground」

CSSで今後、ますます注目度が高まるであろうCSSフィルタ。 なにせお手軽にエフェクトをかけられる

記事を読む

美しいCSSグラデーションをランダムにつくってくれる「Random CSS Gradient Generator」

美しいCSSグラデーションをランダムにつくってくれる「Random CSS Gradient Generator」

ズボラな自分に最適なCSSグラデーション作成ツールがあったので、ご紹介します。 グラデーションを自

記事を読む

オフラインでも便利なChrome機能拡張おすすめアプリ10

ネットが便利なのは言うまでもありませんが、場所の制約からネット回線につながらないときがあります。

記事を読む

無料ホームページなのにプロ並みのデザイン&高機能サイトが瞬時に作れるWix!感想と使い方をご紹介

無料ホームページなのにプロ並みのデザイン&高機能サイトが瞬時に作れるWix!感想と使い方

Wixという無料ホームページがつくれるサービスをご存知でしょうか。 かなり以前からあったサービスで

記事を読む

背景画像をフルスクリーン&レスポンシブ対応にする方法

背景画像をスクリーンいっぱいに表示しているサイトが増えているとはいえ、いま見てもインパクトがあります

記事を読む

UIデザインのリニューアル前と後を比較できるギャラリーサイト「Android UX before and after」

UIデザインのリニューアル前と後を比較できるギャラリーサイト「Android UX before and after」

UIデザインのリニューアルの前と後をひと目で比較できるギャラリーサイトをご紹介します。 Googl

記事を読む

Bootstrapの無料テーマを探すなら一箇所で全部探せる「ThemeFinder」

Bootstrapの無料テーマを探すなら一箇所でまとめて探せる「ThemeFinder」

Bootstrapの無料テーマを探すなら一箇所でまとめて探せる「ThemeFinder」をご紹介しま

記事を読む

これは魅力的!CSSだけで実装できる画像ホバーエフェクト20

これは魅力的!CSSだけで実装できる無料の画像ホバーエフェクト22

CSSだけで実装できる魅力的な画像用のホバーエフェクトをご紹介します。 種類は全部で22種類です。

記事を読む