サイト作成と改装に役立つフリーソフト＆Webサイトのメモ

雑記

先日も書きましたが、1月28日に本家サイト「BLND」を大幅に改装しました。「思いつきで改築・増築を重ねすぎてわけのわからんことになっている田舎の温泉旅館」みたいなhtmlとcssを根底から書き直し、さらにパンくずリストをやめてナビゲーションバーを配置するなど、かなり大がかりな作業でした。以下、改装中に実際に使ってみてとても便利だったフリーソフトやサイトを、工程別に分けてメモしておきます。

1. テキストを検索＆置換する

複数行の文字列を複数行の文字列に一括置換してくれるフリーソフト。条件を入力してフォルダを選ぶだけで、自動的に処理対象ファイルを見つけ出してくれます。必要ならサブフォルダ内も全部まとめて検索・置換することができますし、検索結果から処理しないでおくファイルを選ぶのも簡単です。

これまで置換ソフトというと一行単位で書き換えるものしか使ったことがなかったのですが、今回GrepReplaceを使ってみてその便利さと速さに驚きました。注意点としては、Vistaではインストーラ形式のものをProgram Files以下にインストールするとエラーが発生することぐらい（注意書きにあったにもかかわらず、あたしは実際にやらかしました）。ちなみにZIP形式版はまったく問題なく動きました。

2. マークアップだけやり直す

  • 「小説HTMLの小人さん タグ消しちゃえ」
    • 「htmlタグとタブ文字を消します。ただただそれだけのツールです」とある通り、本当にそれだけに特化したツールです。でも、テキストはそのままにマークアップだけ根底からやり直したいときには、異様に重宝します。うちのサイトの、大昔に書いた化石のようなソースを直すには、これが大活躍でした。

3. リンク切れをチェックする

4. 配色を選ぶ

  • [ws] Color Scheme Generator 2
    • 好きな色をクリックで選ぶだけで、それに合った色のセットを作ってくれるサイト。オプション選択で、コントラストを効かせた配色や、パステルカラーの配色などもいろいろ試せます。
  • ColorBlender.com | Your free online color matching toolbox
    • スライダーによる入力またはRGB値／HSV値で色を選ぶと、それに合う6種類の色を選び出してくれるサイト。ベースとなる色がなかなか決まらない人には、ランダムでカラーパレットを生成する"random blend"がとても便利。
  • http://www.themaninblue.com/experiment/Technicolor/
    • カラーコードを入力すると、それに合う12色を選び出し、サンプルCSSを生成してくれるサイト。
  • COLOURlovers :: Color Trends + Palettes
    • いろいろな人がつくったカラーパレットが見られるサイト。人気投票があるので、どんな組み合わせが好評なのか知ることができます。無料会員登録で、パレットをダウンロードすることも可能。

5. HTMLとCSSの間違いをチェックする

  • Another HTML-lint gateway
    • HTMLの文法ミスをチェックしてくれるサイト。もちろんlintで100点を取ることだけが全てではありませんが、HTMLの単純な間違いを洗い出すのにはとても便利です。
  • W3C CSS 検証サービス
    • CSSが正しいかどうか調べてくれるサイト。CSSデザインが思った通りに表示されない時は、まずここで調べるのが早道。

6. 複数ブラウザでの見え方をチェックする