WEB

WEBデザインの学習に必要なコード比較ツール「デュフフ」を紹介

 

皆さんWEBデザインの勉強の仕方は個々色々だと思います。

 

当初、私はスクールに通いつつコードに慣れるためにひたすらテンプレートのコードを打ち込んでいました。

 

しかし、打ち間違いなどでテンプレ通りのページがコード間違いで表示されない事が多々ありました。そういう時に、どこが間違っているかなどがテンプレコードと比較が出来るツールの「デュフフ」が役に立ちます。

 

デュフフとは

 

 

デュフフとはコードを比較するツールになります。

 

上手くページが表示されない時にどこが間違っているのかを確認するツールですが、特に初めはどこのコードがテンプレートコードと違うのだろうと正解が分からない事が良くあります。

 

Dreamweaver(ドリームウィーバー)でも間違っている箇所の表示もありますが初めはどこか分からない事もありますよね。

 

 

そういう時に便利なのが、比較ツールになります。

 

デュフフを使う

 

それでは使っていきます。

 

左のボックスに正解のテンプレートコードをコピペします。

そして右のボックスに自分で模写で打ち込んだコードをコピペします。

 

 

 

そこまで行きましたら比較するをクリックしてください。

比較されたコードが表示されますので確認していきます。

 

 

 

半角や全角、コードの中で比較して違うところがブルーの背景になって表示されます、

 

そこで左の正解と何が違うのかがすぐ分かりますので便利なツールになります。

 

 

 

 

 

デュフフはコチラ

 

勉強はじめたての方に是非便利なツールを利用していただけたらと思います。

 

ご購読ありがとうございました。

ビジネスにもブログにも使いやすいWordPressテーマ

「WING(AFFINGER5)」

SEOや収益化に効果的な機能が豊富

記事ごとにAMP化を選択可能

簡単に設置出来るランキング機能をはじめとしたアフィリエイトを始めやすい設計

お得にご購入はコチラ

  • この記事を書いた人
NAO

NAO

NAOです。 DTPデザイナー、ワードプレスを愛するWEBデザイナー// 世の中のお得な情報、DTP、WEB、ブログに関して発信してまいります。 「使用ソフト」Illustrator Photoshop DreamWEAVER「使用プログラミング」HTML/CSS/ワードプレス/Jquery 「企業実績」販売促進に関係するアイテム作成 実績多数 「個人実績」 ココナラ 名刺作成・ロゴ作成 400件以上 広告 50件以上 販売実績

-WEB

© 2021 TSUTAERU BLOG