CSS Nite ＠Co-Edo, Vol.17参加レポート！レスポンシブWebデザイン実装時に必要な手法や注意点など - Design Color
CSS Nite ＠Co-Edo, Vol.17参加レポート！レスポンシブWebデザイン実装時に必要な手法や注意点など 2018 1/03 レスポンシブWebデザインとは PC、スマートフォン、タブレット…最近は本当に色々な種類のデバイスがあります。それらの数多くのデバイスにワンソースで対応する技術が「レスポンシブWebデザイン」です。具体的には、閲覧しているデバイスの画面サイズに応じてサイトのレイアウトを切り替えてくれるというもの。 例えば以下のサイトでは画面幅が変わるごとにレイアウトとおじさんの顔が変化するという面白い作りになっています。 Hello Fisher 他にPCサイトを各デバイスに対応する方法としてはPHPなどで表示を切り替える方法がありますが、そうなると各デバイス用のデザインやソース、画像を新たに用意する必要が生じてきます。 もちろん、何も対応しなくても各デバイスからPC
JPEG、GIF、PNG画像選択の指針まとめ | エンタープライズ | マイコミジャーナル
SitePoint: New Articles, Fresh Thinking for Web Developers and Designers Jennifer Farley氏がSitePointにおいてGIF, PNG, JPG. Which One To Use?のタイトルのもと、Webサイトを作成するにあたってどの画像フォーマットを採用すべきかという指針を簡単にまとめている。まず氏はそれぞれの画像フォーマットの特徴を簡単に説明。 GIF - 256色のインデックス画像。写真には向かないが、ロゴであったりフラットブロックな画像には向いている。透過データを保持できるという特徴がある JPEG - クオリティによって圧縮率が変わる非可逆圧縮の画像フォーマット。透過は表現できないが、写真データの用途に向いている PNG - GIFに似ているが、GIFのようなぎざぎざを出さずに背景透過を実現
JPEG画像をより美しく、より軽量に最適化するテクニック
JPEG画像をより美しく、より軽量に最適化するテクニックをSmashingMagazineから紹介します。 Clever JPEG Optimization Techniques 1. 「8ピクセル」のグリッド 2. カラーの最適化 3. JPEG最適化の一般的なTips 1. 「8ピクセル」のグリッド JPEG画像は、あなたが既に知っているように8x8のピクセルのブロックから成り立っています。画質を低くするとよく分かります。 この8x8ピクセルを利用して、JPEG画像を最適化します。 画質10で作成したサンプル 二つの正方形は同じ大きさ（8x8ピクセル）です。左上のはきれいに見え、右下のは汚く見えると思います。 これらは、それぞれ8x8のグリッドに並べたもので、左上はグリッドに揃えたもの、右下はグリッドに揃っていないものです。 保存する際に画像は、8x8ピクセルのブロックに分けられるため
ぜひお試しを！写真を並べて素敵な形を作成する·Shape Collage MOONGIFT
携帯電話で撮った写真は画素数が少ないので、ちょっと前のモデルでは気軽に写真は撮れるものの現像するにはちょっと物足りない感じもあった。そのような写真はパソコンに取り込んで閲覧するのが一般的だろう。 スマイルマーク型に写真を並べたところ だがコンピュータ上のアルバムソフトウェアでただ眺めているのはもったいない。大胆にこんな変化を遂げてみるのはどうだろう。 今回紹介するフリーウェアはShape Collage、写真を色々な形に沿って並べてくれるソフトウェアだ。 Shape CollageはJavaで作られたソフトウェアで、Windows/Mac OSX/Linuxなどマルチプラットフォームで動作する。そのおもしろは、多数の写真を使わないと伝わりづらい。その点、手軽に撮れるデジカメや携帯電話の写真は素材として最適と言えそうだ。写真はドラッグアンドドロップで登録する。 これはハート形 写真を登録した
JavaScript、FLASHのイメージギャラリーまとめ15個ほど*ホームページを作る人のネタ帳
今回は過去のホームページを作る人のネタ帳にて、まとめの一部として使われていたイメージギャラリーを主役にまとめました。 JavaScript系はブログでも使う事が出来たりしますので、お時間のあるときにでもお試しください。 （Flashに一点追加しました） CSSJavaScript Photo Sliderライブラリ。 滑らかなスライドを実装できます。CSSデザインである為、デザインのカスタマイズも可能。 ダウンロードページ 商用利用の場合は29ドルだけど、非営利の場合は無料で使える。 テキストが表示されているところもポップアップするので試してみると楽しいです。 ダウンロードページ 正確にはギャラリーではないですが、虫眼鏡による画像のビューア。 FLASHではないところがまた乙。重いのが難点か・・・。 ダウンロードページ こちらも虫眼鏡。地味に2つの機能がある。 クリックしながら右にドラッグ
写真をオシャレに見せたい人のための便利なツール :: Love & Design ::
【PR】あなたの写真を簡単キレイに無料補正 写真をポラロイド風に ひとつ目は、あっという間に写真をオシャレにできるオンラインツール Polaroid-o-nizer™ アップロードした画像（GIF・JPEG・PNG）のURLを入れてクリックするだけ 余白に文字を入れることもできます。（英語のみ） お好みで写真の角度を自由に変えられます。 ■ポラロイドイメージの作り方 Background color (RGB value) RGB値で背景色を設定できます。（デフォルトは白） URL to image (GIF, JPEG or PNG, 200x200 pixels minimum) 使用できるイメージサイズの最小サイズは200x200ピクセル x and y coordinates (optional) オプションで座標の指定ができます。 Rotation angle (between
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
無料でダウンロードできるベクター素材集 - DesignWalker
写真をイラスト化してくれるサイト「BeFunky」 | ライフハッカー・ジャパン
Vector Magic | Precision Bitmap to Vector Conversion Online
GIFやJPEG画像をベクター化できるオンラインサービス -VectorMagic | コリス