WEBP変換ツール (jpg、pngとwebpを相互変換)
公開日: 2016/03/09 | 更新日: 2017/08/10 WEBPコンバーターは、JPEGやPNGをWEBPに、WEBPをPNGに変換するウェブサービスです。画質を保ったまま、圧倒的に容量を圧縮できるWEBPをウェブサイトで活用していきましょう。Chromeにのみ対応しています。 ヒントJPG、PNGからWEBPに変換する「変換前の画像」という項目にある「ファイルを選択」を押して、PNGかJPGのファイルを指定して下さい。「変換後の画像」という項目に、WEBPに変換した画像が表示されるので保存して下さい。WEBPからPNGに変換する「変換前の画像」という項目にある「ファイルを選択」を押して、WEBPのファイルを指定して下さい。「変換後の画像」という項目に、PNGに変換した画像が表示されるので保存して下さい。プライバシーについてここで使用した画像は、当サイトのサーバーにはアップロー
色調整から本格的な加工まで--無料で使えるオンライン画像編集サービス7選
写真のかんたんな補正作業は、スマホやタブレットのアプリを使えば素早く行えるが、マウスを使って本格的な編集作業を行うとなると、やはりPCは欠かせない。もしPCに画像編集ソフトがインストールされていないようであれば、重宝するのがオンライン画像編集サービスだ。 オンライン画像編集サービスは、サイズ変更や回転などの操作はもちろん、色調の補正、テキストの挿入といった市販の画像編集ソフト顔負けの機能を備えるほか、最近はSNSでの公開を前提とした装飾機能に注力したサービスも増えるなど、機能は数年前に比べて格段に進化している。今回はこうしたオンライン画像編集サービスを紹介しよう。 ◇Pixlr Editor この分野では老舗にあたるオンライン画像編集サービス。Flashを使用している。GIMPなどの画像編集ソフトに似たインターフェースを持ち、日本語でのメニュー表示にも対応している。新興のサービスと比較する
【※保存版】WEBデザイナーご用達の本当に使える商用フリーの素材サイトをまとめました。
【※保存版】WEBデザイナーご用達の本当に使える商用フリーの素材サイトをまとめました。2014.10.13 WEBデザイナーは技術はもちろん、手持ちのリソース（情報など）が多いほど有益なデザインを完成させることができます。 しかし海外の素材サイトは、ウイルスリスクの懸念や利用規約も英語で理解できなかったり曖昧だったりでちょっと怖いイメージがあります。特に商用で利用したい場合にはしっかりと利用規約を確認することができる日本で運営しているサイトのが安心ですね。 ここでは本当に使えるWEBデザイナーご用達の商用フリーの素材サイトをまとめました、デザイナーに限らず趣味でサイトを運用している方にも保存版の8サイトをご紹介します。 PAKUTASO5000枚近く（2015/10時点）の写真素材を保有するパクタソは管理者の方が手間を惜しまず写真を1枚1枚選別し、さらにノイズ処理や補正、トリミングなどを行
配色を考えるときに便利なオンラインツール10個集めてみました | WP-E (仮)
最終更新: 2018年4月14日 皆様こんにちは！最近WP-Eメンバーに本名を忘れられているような気がするWP-E HINOTANです。寿司ネタがどこかへ行ってしまいましたね。 さて今回はタイトルの通り、便利な配色ツールを紹介していきたいと思います。 Adobe Kuler まずはAdobeが提供しているAdobe Kulerから。こちらは有名なので知っている方も多いと思います。Adobe KulerはPhotoshopやIllustratorとの連携機能があるので便利です。(Adobe Creative CloudのアカウントIDが必要となります) 「Explore」のページでは、様々なカラーパターンを見ることができ、気に入ったものを登録したり編集したりすることができます。登録したカラーパターンはPhotoshopやIllustratorにも反映されます。 Color Hexa Colo
Webデザイン作成に必須のツール＆効率化できるサイトまとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
デザインを行う上では、ツールを使うのが必須です。有名なものだとPhotoshopやIllustratorがありますが、「まずは無料で気軽にWebデザインをしてみたい」という人もいますよね。 そこで今回は、Webデザインに使える無料のツールやWebデザインを効率化できるサイトをまとめて紹介します。 今回紹介する無料のWebデザインツール・ソフト ワイヤーフレーム・モックアップ・プロトタイプ作成ツール グラフィックデザイン作成ツール（写真加工・イラスト作成） テキストエディタ（HTML・CSSのコーディング） 配色選びに使える無料オンラインサービス Webサイトが制作できるオンラインサービス （編集部注：この記事は2013年08月29日に公開された記事を再編集したものです。） ワイヤーフレーム・モックアップ・プロトタイプ作成ツール ※ワイヤーフレーム・モックアップ・プロトタイプとは？ ワイヤー
最近話題になったイケてるWebサービス・アプリ10選（2013年8月編）
Paletta（パレッタ） プログラマのためのカラーパレットツールです。 ワンクリックするだけで調和のとれた色が生成されます。流行りのフラットデザインでは「色」の感覚が特に重要なので便利です。 sounds39 “ボカロ曲と巡りあうキッカケがもっとたくさんあればいいのに”という想いから生まれたVOCALOIDの楽曲専用の再生サイト。 まるでCDショップで好みのジャケットを探せる、いわゆる、ジャケ買い感覚で選べることが特徴です。また、ランキングやジャンル別、気分別に楽曲を探すこともできます。機能もどんどん増えていっており、より使いやすくなっていきそうです。 Dialogue MacとiPhoneをBluetoothで接続し、Macで通話できるようにしてくれるアプリです。価格は600円。iPhoneに着信が入るとMacに着信画面が表示され通話できます。さらに通話の内容を録音できるのは驚きです。
無料すぎて助かった！WEB制作が「はかどる」素材まとめ
作成：2013/01/21 更新：2014/11/01 Web制作 > 無料素材のブックマークが無限に増えてきた そうだ！整理しよう 今回は一つ一つ紹介せず、すでに「素敵にまとめてあるサイト」をまとめました。まとめ系４８サイトのまとめです。 フォント、素材からレスポンシブ対応した初心者でもOKのWordPressテーマまで、全て無料です。 エンジニア速報は Twitter の@commteで配信しています。 もくじ １．日本語フリーフォント ２．海外のおしゃれなフリーフォント ３．国内の写真素材 ４．アイコン ５．ユニークな素材 ６．ベクター ７．Photoshop補助 ８．ワイヤーフレーム ９．レスポンシブなWordpressテーマ １０．スマホ用ページ テンプレート １．日本語フリーフォント 重複するのもありますが、以下のサイトでほとんどの無料系フリーフォントが揃うと思います。 201
2/4 IE6～IE9を同時に表示確認できるMicrosoft純正ソフト [ホームページ作成] All About
IE6～IE9を同時に表示確認できるMicrosoft純正ソフト(2ページ目)複数バージョンのInternet Explorerで同時に表示確認ができるMicrosoft製ソフト「Expression Web SuperPreview」の使い方を解説。IE6・IE7・IE8・IE9での見え方を比較できる上、表示のずれ具合を数値で知ることもできるなど、高機能で便利なソフトウェアです。古いバージョンのIEでの表示確認にぜひ活用してみて下さい。 「Expression Web SuperPreview」のインストール方法 「Expression Web SuperPreview」をインストールできるOSは、Windows XP以降のWindowsです。ただし、Windows XPの場合は「Service Pack 3」が必要です。また、「.NET Framework 4.0」と「Silverli
![2/4 IE6～IE9を同時に表示確認できるMicrosoft純正ソフト [ホームページ作成] All About](https://cdn-ak-scissors.b.st-hatena.com/image/square/8f530daf3cb408d6b6a0ba6f38ed7ccece36cffc/height=288;version=1;width=512/https%3A%2F%2Fimg.aacdn.jp%2Faa%2Fcommon%2Fogp300_300.png)
あなたのウェブサイトを高速化させるためのTipsを教えてくれる拡張機能「PageSpeed Insights」 | ライフハッカー・ジャパン
「PageSpeed Insights」はあなたのウェブサイトのパフォーマンスを上げるためのTipsを教えてくれる拡張機能です。Google Chromeに入れることで、Chromeに内蔵されているデベロッパーツールを拡張できます。ウェブページの高速化を図るための提案をしてくれますよ。 以下に使ってみた様子を載せておきます。まずGoogle ChromeでPageSpeed Insightsへアクセスしましょう。Chromeへインストールします。そして、Chromeのデベロッパーツールを起動しましょう。Windowsの方は「F12」キーを押せば起動します。 パフォーマンス向上を図りたいウェブサイトを開いて、PageSpeed Insightで分析をしましょう。ページ再ロード後に結果が表示されます。 このように優先度ごとに対処方法を教えてくれます。こうすればもっとあなたのサイトを高速化できま
画像レイアウト関連で便利なjQueryプラグイン等まとめ:phpspot開発日誌
ちょっと画像レイアウト関連で便利なjQueryプラグインを調査仕事でまとめていたのでついでにご紹介。 この手のプラグインはjQuery Masonryが最初だったかと思いますが、色々と出てきたのでここら辺で全部しっておくとよいかも。 Wookmark 比較的新しめのPinterest風レイアウトを作る際に便利なプラグイン。 jQuery isotope レイアウトだけではなくダイナミックに要素をアニメーションさせることも出来るプラグイン 異なる幅・高さの画像も超綺麗に整列させるjQueryプラグイン「Atteeeeention plugin」 Google画像検索みたいに画像を綺麗にならべられます ↓↓↓↓ ボックス要素をレンガ状に綺麗に整列させる「jQuery Masonry」が凄い 要素の整列系の初期のプラグイン。最初に見た時はあっと驚いたものです ↓↓↓↓ 並べた画像を敷き詰めて超カ
ウェブデザイナー必見！ダミー画像を超簡単に作れるサービス「Placehold.it」 | ライフハッカー・ジャパン
「Placehold.it」はダミー画像を簡単に作れるサービスです。ウェブデザインをするときに便利ですよ。 以下に使ってみた様子を載せておきます。 まずPlacehold.itへアクセスしましょう。 サイズの指定は簡単。「http://placehold.it/」のURLの後に、必要なサイズを入力するだけ。たとえば上記の画像は「http://placehold.it/500x250」と指定したものです。また、色やテキストを変えることも可能。コードでの埋め込みにも対応しています。簡単にダミー画像を作ることができるので、ウェブデザインをする際にご活用ください。 Placehold.it （カメきち）
Bootstrapを使おう！様々なカラーテーマ、プラグインを用意·Kickstrap MOONGIFT
KickstrapはBootstrapをベースにしたテーマ、プラグインを提供するソフトウェアです。 最近作られるWebサービスでよく使われているBootstrap。そんなBootstrapは固定色でそれっぽさが感じられてしまうのが欠点でしたが、見事に打ち消してくれるのがKickstrapです。 色が変わると随分印象が違います。 テーマ機能があります。 青と白。 こんな感じのシンプルなテーマも。 逆にカラフルなものもあります。 基本は同じですが、印象は違いますね。 好みのテーマを選べます。 JavaScriptプラグインがデフォルトよりもぐっと増えています。 Kickstrapを使えばBootstrapをより便利に使えるでしょう。JavaScriptプラグインも通知機能をはじめ、色々なものが追加されていますのでWebサイトをより強力にパワーアップできるはずです。 KickstrapはHTML
jQuery UIのデザインをオリジナルに変更したサンプル
分かりやすいタイトルが思い浮かばない ので適当な感じになりましたが。jQuery UIのデザインをちょっと今風に変更した サンプルが配布されていたので備忘録。 jQuery UI、凄く機能的で良いんですが、 用意されているデザインが若干使いにく いんですよね。 jQuery UIのデザインを変更するやつです。正直、公式で用意してくれているデザインは沢山あるんですが、どれも少々使いにくい感じなので自分で作るしか無いわけですが、結構面倒です。 で、今日紹介するサンプルはBootstrapっぽい感じで割りと使いやすいのではないかと思ってメモがてら記事にします。 Selene こんな感じ。以下動作サンプルです。 Sample 使い方は変わらないです。CSSだけSeleneっていうのを使えばいいだけ。 <link type="text/css" href="ui-selene/jquery-ui-1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
少しずつ色が変わるグラデーション背景をCSSで作成出来る・「CSS GRADIENT ANIMATOR」
ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP
Online Mockup, Wireframe & UI Prototyping Tool
IDEA * IDEA
手軽にスタイリッシュなロゴを作成できるサイト「GraphicSprings」 | ライフハッカー・ジャパン
パソコン上で使えるアートフィルター系レタッチソフト「Pixlr-o-matic」NOT SUPPORTED
IDEA * IDEA
