サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
GWの過ごし方
ideahacker.net
Firefoxを使っている人でも、Beta版やAurora版の意味を知らなかったり、どこからダウンロードすればいいのかを知らなかったり…っていう人は結構多いと思うんですよね。というわけで、なんとなーく紹介しておきます。
PNG画像をガッツリ圧縮して出力できるPhotoshopプラグイン『SuperPNG』を紹介|比較画像もあるよ! この記事を見てる人に説明は不要だと思いますが、画像のサイズを小さくすることの恩恵は絶大です。Webページを構成する大部分はテキストですが、ページのファイルサイズの大部分は画像なので、画像の軽量化はページ表示速度の高速化に直結します。 今までLeoTiger_7はPhotoshopCCでロゴやバナーを作った際、「Web用に保存」→「PNGoo」で圧縮するという手順を踏んでいたんですが、そんなめんどくさいことをしなくても一発で圧縮して出力してくれるプラグインを見つけました。それが『SuperPNG』です。 もちろん、容量が小さくなる代わりに画質が損なわれる…なんてことはなく、むしろPhotoshopで出力したほうが画質が悪いという結果になりました。 ダウンロード 下記サイトのサイド
FirefoxでHTML5のコンテンツ(YouTubeとか)をフルスクリーンモードで表示した際、こんな感じでメッセージが表示されますよね。 見りゃ分かるっつーの!! 数秒で消えるとはいえ、気になるっちゃ気になります。というかいらない。消しましょう。 消し方その1:アドオンで消す これが一番手っ取り早いですね。いつも通り「+ Add to Firefox」からインストールするだけで終わりです。再起動も不要。楽チン! 消し方その2:about:configから消す 何らかの理由でアドオンを導入したくない人は、about:configから消しましょう。 アドレスバーに「about:config」と入力して設定画面に進み、検索フォームに「full-screen-api.approval-required」と入力します。
text-shadowを使いこなせば、テキストに対して色々なエフェクトをかけることが可能です。もちろんPhotoshopやIllustratorを用いて作られたものには敵いませんが、少しコードを書き換えるだけで色や文章を変更出来るというメリットがあります。また、画像と違って閲覧者がコピー出来るという利点もあります。 基本の基本、ドロップシャドウ See the Pen XbpbPM by Setoda Kouki (@LeoTiger) on CodePen. これが基本です。 3D表現その1 See the Pen Xbpbrm by Setoda Kouki (@LeoTiger) on CodePen. シャドウを下方向に1pxずつ動かしていくつか配置すると、立体的なテキストを作成できます。 3D表現その2 See the Pen pJRJEz by Setoda Kouki (@L
ファイルのアップローダーはいろいろありますが、BitSendは手軽さ・機能性・UIの分かりやすさ、どれを取っても非常に優れているという印象です。 最大ファイル容量3GB、最大同時アップロード100個と、これだけでも強力なんですが、その他にもパスワード保護機能やメールでの通知機能、ファイルの保存期間指定など、ファイルアップローダーに求められる機能はほぼ全て備えています。 この記事では実際にファイルをアップロードし、使い心地等を試してみます。 特徴・機能 1ファイル3GBまで 容量無制限 100個までの同時アップロード機能 削除用URLの生成 ファイルのパスワード保護機能(任意) 保存期間は0~14日(指定可能) 最大ダウンロード回数を指定可能(1~100回) ファイルにメッセージを追加可能 ダウンロードリンクを10人までメールで送信可能 QRコードや短縮URLの生成 この通り、他のアップロー
今回は見出しのデザイン例を11通りほど作ってみました。 リンクテキストと違い、見出し部分は割とガッツリ装飾しても問題ありません。むしろ少し目立ち過ぎなくらいのほうが、読者に「ここが見出しだな」と理解させやすいです。 基本的な形 See the Pen XbNWPo by Setoda Kouki (@LeoTiger) on CodePen. いろいろなブログでよく見る、左と下にボーダーを指定する形です。うちのブログもこれ。 1文字目を大きく See the Pen MwberV by Setoda Kouki (@LeoTiger) on CodePen. これも結構見ますね。 左右にボーダー See the Pen EjNyaR by Setoda Kouki (@LeoTiger) on CodePen. CSS3のflexを使い、左右にボーダーを配置。あんまり見ないデザインですが、
リンクテキストを装飾するCSSを色々作ってみました。実用性を考えたので、そこまで派手なアニメーションをするものはありません。リンクはページ内で重要な役割を担っているので、過度なアニメーションは控えたほうが無難です。 文字色をふんわりと変化 See the Pen GJjbjJ by Setoda Kouki (@LeoTiger) on CodePen. マウスオーバー時に文字色を変えるのは基本中の基本ですが、変化終了までに0.3秒の時間を与えるだけで印象が変わります。 背景色と文字色をふんわりと変化 See the Pen VLKONR by Setoda Kouki (@LeoTiger) on CodePen. さっきのコードに背景色の変化も加えました。背景は柔らかい印象を与えるために角丸に。 ニュルッと出てくる下線 See the Pen MwjdZo by Setoda Kouk
取り付けた 付属のネジを使って裏から固定するのは色々と面倒なので、長ネジを使って前面から固定しようと思ったんですが、ストックしていた長ネジが3本しか無かったというハプニング。とりあえず無理矢理取り付けたので、今度ネジ買ってきます… 結果 めちゃくちゃ静かです。静音ケースを使っているというのも大きいですが、まさかここまで静かとは…もちろん耳を近づければ風を切る音が聞こえますが、普通に使っていれば全く気が付かないレベルです。 肝心の風量ですが、800rpmにしては確かに大きいです。もちろんもっと大型で回転数の速いものには敵わないですが、静音性とのバランスの良さを考えるとLeoTiger_7にとってはベストの選択だったと思います。 さて、前面に取り付けたのでHDDの温度が気になるところですが、直接冷やす形になっているので約7~8℃も下がってくれました。満足満足… 低価格で静かでよく冷える、とても
ブログだと使い道が無さそうですが、コンテンツを量産しなきゃいけないようなサイトだとこういうテクニックを使うかもしれません。どっちにしろ使用頻度は少ないと思いますが…
Firefoxのユーザーエージェントを偽装するアドオン『User Agent Switcher』|スマホサイトの確認に便利! スマホ用のサイトやWordPressテーマを編集したとき、いちいちスマホ&タブレットを使って表示を確認するのは面倒ですよね。 iPhoneやAndroidのエミュレータを使ったこともありますが、設定がややこしい上に動作も遅く、ただサイトの表示を確認するためだけに導入するのは少し面倒で無駄な感じが否めませんでした。 そんなとき、普段からFirefoxを使っている方なら『User Agent Switcher』というアドオンと、Firefoxの開発ツールである『レスポンシブレザインビュー』の合わせ技を使うことをオススメします。
font-family: Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif; はい、先ほどのサイトに載っていた記述の丸パクリです。実際に色々試してみたんですが、これが一番無難、というか綺麗に表示出来ている気がしました。 英字はVerdanaで WinとMacの共通で使える英字フォントはいくつかありますが、Verdanaが一番綺麗で識別しやすいです。 良い。すごく良い。 日本語フォントは游ゴシック>ヒラギノ>メイリオの順番で 游ゴシックってなんだ?って感じだったんですが、Win8.1とOSX10.9以上で共通で使える日本語フォントみたいですね。知らなかった。LeoTiger_7はWin7なので実際には確認していないんですが、公式サイトを見た
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
ideahacker.net 2024 著作権. 不許複製 プライバシーポリシー
SublimeTextとは SublimeTextとは、1年ちょっと前に「恋に落ちるエディタ」というキャッチで国内で急激に利用者が増えた無料で使えるテキストエディタです。 お洒落な外観と豊富な機能、さらに膨大な量のプラグインが簡単なコマンドでサクッと検索→インストール出来るという素晴らしいエディタなんですが、ソフトが英語&設定が複雑(特殊?)ということもあって、若干敷居が高め。 要所要所を解説しているサイトはいくつもあるんですが、まともに使えるようになるまでの流れを全部解説しているところがほとんど無かったので、ここにまとめておきます。 あと、解説はWindows限定です。 今回やること インストール PackageControlの導入 メニューの日本語化 Shift-JIS、EUC-JPを扱えるようにする 日本語入力の不具合を解消 フォントの変更 インストール ダウンロードはこちらから。
今日はCSSを使って画像に「枠」と「影」を付ける方法を解説します。この2つを付けると、簡単に「フレーム付きの写真」が表現できるので、覚えておいて損は無し! というわけで、今回はこの画像を色々と弄っていきます。 秋葉原でメイド喫茶DTを卒業した時に撮った写真です。とても厳しい戦いでした。 …それでは、まずは枠の付け方から。 Demo - 枠付きの画像
次のページ
このページを最初にブックマークしてみませんか?
『http://ideahacker.net/』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く