新人WEBサイト担当者がブクマしておきたいサイト7選

小原 康尚

WEB業界2年目のWEBデザイナーです。 コードに強くなりたいと思いつつ、進歩の速さに翻弄されっぱなしですが色々勉強中です!。

Webサイト制作会社へ就職が決まった方など、サイトの更新を任されたばかりの人へ送る「困った時に便利なサイト7選」をお送りします。

制作実績がたくさんある会社ほど過去のサイトを更新する際に古いルールに縛られて対処が難しくなりがちですが、くじけず頑張って行きましょう! 

Webディレクターに便利なサイト7選

TinyPNG

tinypng

「画像重いのでなんとかして!」と言われた時に役立つのがこちらです。

現在png画像全盛期といった感じで透明レイヤーのある画像で溢れていますが、圧縮ファイルではないため重くなりがちですよね? TinyPNGは画像に含まれているメタ情報などを削除して、pngファイルを軽くしてくれるサイトです。

png画像を放り込むだけなので、使い方もカンタンです。

ただし、編集したファイルをphotoshopなどで開くと編集できなくなっていたりするので注意が必要です。

difff

difff

「前回編集したファイルから表示がおかしくなったぞ! なんで?」

どこの会社でもサーバに上げる前には必ずバックアップファイルをとってから上げていると思うので、そのファイルと今回修正したファイルの文面を全コピーしてこのサイトに貼り付けると差異を教えてくれます。

他にも似たようなサイトはありますが私はここがおすすめです。

どんと来い、中国語

dokochina

「中国語のサイトを更新して欲しい」と言われたことがあります。そんな時、中国語なんて関わったこともない私でも、丁寧に説明されていて大変助かったのがこのサイトです。

文字化けもジェネレーターがあるので強制的に実体参照で乗り切れます(力技MAX)。

ちょっと便利帳

tokusyu_01


「ちょっと! 文字化けしてるんだけど早く直してよね!」と言われたら…。

ブラウザ依存文字などはテキストエディタでは普通に表示できても、対応していないブラウザ(IEとかIEとか)では文字化けして表示されてしまい、後々クライアントから突き上げを頂きますのでここにあるものは目を皿にしてチェックしましょう。

会社の信用問題にもつながることですので、ただの文字化けと言っても侮らないほうよいです。慣れてくるとどの文字が文字化けしやすいのか分かってきますので経験を積みましょう!

丸文字の数字などのコードが記載されているのでここに載っているものは全て文字化けすると思って覚えてしまうといいです。

TABLEIZER!

tableizer

セルで結合されまくったエクセルをそのままHTML化して欲しい、と言われて「う~ん! 大変!」って時におすすめのサイトです。

DreamWeaver があれば同じ事ができるのですが、エクセルの表セルを丸々コピーして張り付けるだけで骨の折れる表組みもあっというまにHTML化。

改行なしで作成されるのでテキスト整形ツールなどを併用すると見やすくなると思います! おすすめ!

coolors

coolors

メインカラーは決まったけど、ポイントカラーをどうしよう? という時にはここです。

本来はもっと時間をかけてやりたいカラー選び。でも時間がない時、ここでメインカラーを入力してクリックで鍵をかけ、スペースを押すだけでメインカラーに合わせた配色を提案してくれます。何度も押せるので直感的な選択で行きたい時に便利です。

ただ、色を決めるにも理由が必要になってくると思うので、その理由に沿った色を選択すると時短になるのかなと思います。

weblio

weblio

語彙が足りない! もっと豊富な言葉でサイトを彩りたい…!

専門職ではない限り、クライアントの専門用語なんてわかりませんよね? うかつに書いてしまうと後々クレームに繋がりますので、そんな時はweblioの類語辞典などを活用しましょう。その他にも言葉の意味を調べるときなどに有効で、翻訳機能もついてます。

まとめ

Webサイトの担当者は日々様々なことに気を配り、従事しなければなりません。一つ一つのタスクを上記のようなツールなどで軽減していき、効率化していきましょう!