当サイトや、他の、作成を代行したりするサイト・でもそうなのですが、ページの表示を高速化する上で、非常に悩ましいのが画像のサイズ。 例えば書評サイトだと、写真を上げる時に、デジカメで撮影したままだとかなりファイルサイズが大きいのです。 レスポンシブなどでスマホ対応しているサイトもかなり増えてきてはいますが、回線速度がまだまだ遅いモバイルなどでは死活問題になりかねません。 そこで今回は、画像サイズを縮小するサービスをご紹介するとともに、結局何を使えばいいか、をお伝えします。 元画像と縮小後の画像を比較■オリジナルJPG画像:81.5KB(ぱくたそより) ■オリジナルPNG画像:276KB(ぱくたそより) です。 なぜ犬と猫なのかは別に理由ありません。あざとい?はい。だってかわいいもん。Yahoo! Smush.it結果 JPEG画像:81.5KB ⇒ 73.9KB PNG画像:276.47K
WordPressを使用するとデザインの変更や機能のカスタマイズ、データの管理を手軽に行える多機能なブログサービスを作成することができます。実際、このTechAcademyマガジンもWordPressを使って作られたサイトです。 他にも企業のコーポレートサイトやブログサイトなどの多くはWordPressを使われているのです。サイト作成に便利なプラットフォームなので、ぜひ使えるように理解していきましょう。 そもそもWordPressとは何なのかよく分からない方は、今さら聞けない!WordPressとは【初心者向け】をご覧ください。 なお本記事は、TechAcademyのオンラインブートキャンプ、WordPress講座の内容をもとに紹介しています。 大石ゆかり 田島メンター!!WordPressのことはなんとかわかったんですけど、どうやって使うんですか〜? 田島悠介WordPressを使うに
マーケティングでは、顧客心理を読み解くことが戦略策定のもっとも大切なポイントの一つです。 その顧客心理を読み解く一つの方法として「心理学」が応用され、人間の「性質」や「本質」をもとにしたマーケティング戦略が考えられてきました。 ただ、この心理学がWEBマーケティングにおいて活用されることはまれでした。 そこで、今回はWEBマーケティングに役立つ行動心理学の手法を8つに厳選してピックアップ。 それらが実際に活用されている企業サイトを集めて重要エッセンスを抽出しました。 そしてさらに勉強したい方に向けて、もう20個の行動心理学の効果と実用方法をまとめました。 ウェブサイト上で行動心理学がどのように使われているのか、実例を参考にしながら、ぜひ自社サイトやブログにも導入してみて「ついクリックしてしまう」サイトを目指していきましょう! Webサイトの改善策を”自動”で提案!売上向上に繋げるサービス『
WEBデザインを行う上で重要なファクターの一つである配色:カラーリング。ロゴやブランドイメージなどから導きだすケースが多いと思うが、困ってしまうのは明確なイメージがなく、キーカラーが決まらないとか、キーカラーとの組み合わせがイマイチしっくりこないなど、配色で頭を悩ませることは結構あるのではないだろうか。 そこで今回は、そういう時に役立ちそうな10サイトを紹介したい。各サイト共に試してみたが、思わぬ組み合わせや自分では積極的に使わない色や自分の好き嫌いを再確認できて結構面白い。こういったサイトを活用して効率化を図ったり、新境地を開いてみてはいかがでしょうか。
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 概要 今年からフロントエンドエンジニアにシフトチェンジして5ヶ月がたち、これがないと仕事にならんわレベルのツールを整理がてらに晒していこうと思う。 スペック的にはJava歴が10年くらい。 割とツール好きで、できればキーボード(カーソルキー以外)だけですべての操作を完結したいと思っている。 そんなおっさんがお送りします。 5ヶ月間のお仕事内容PC/タブレット向けのAngularJSを使ったフロントエンド開発HTML/CSS(SASS)/JavascriptPCはIE8~、Chrome。モバイル端末はiPad、Nexus7 職場での
WEB制作やブログ、プレゼン資料などで、イメージをより直感的に伝えられるイラストやアイコンが欲しいけれど、探すのが面倒なんだよな・・・と思うこと、ありますよね。 今回は、WEB制作やブログ、プレゼン、広告、チラシなど、さまざまなシーンで大活躍間違いなしの、アイコン・イラスト・ピクトグラムの画像、ベクター素材をご紹介します。 全てフリーで、商用利用可能です。 こちらを活用すれば、より豊かな資料作成が無料でできるでしょう。 また、この記事は無料でPDFとしてダウンロードも可能です。写真のフリー素材を探す際にお手元に置いておくのがおすすめです。 【PDF】高クオリティ!商用利用OKのアイコン、イラスト無料(フリー)素材まとめ>>無料ダウンロード 【厳選5サイト】 ビジネスからブログまで幅広く使える無料アイコン・イラスト・ピクトグラム素材がいっぱい!私が普段利用していて便利だな、と思うサイトを5つ
「タグマネージャー」「ワンタグソリューション」聞こえはいいけど、そもそもどんなもの? うちのサイトで本当に使えるの? と利用することを逡巡されている方も多いのではないでしょうか。 今回はタグマネージャーを導入するにあたってご参考いただけるよう、そもそもの概要から実際の使用法を紹介していきます。 ※注※ ワンタグ(OneTag)と呼ばれることも多いですが、本記事はタグマネージャーにて統一いたします。 また、タグマネージャーは「Yahoo!タグマネージャー」と「Googleタグマネージャ」の二つが特に有名ですが、今回は「Yahoo!タグマネージャー」を軸に紹介させていただきます。 タグマネージャーとはそもそも何か複数のタグを管理することができるタグです。 言葉だけでは想像しがたいものがあると思いますので、まずは下の図を使って解説いたします。 タグの設定などを行う管理画面があり、その管理画面の設
Before visitors click on a link, they hover over that link. Between these two events, 200 ms to 300 ms usually pass by (test yourself here). 引用:InstantClick — JS library to make your website instant リンクにマウスオーバーしてからクリックするまでには200msから300msほど時間がかかるそうです。実際このテストページでクリックしてみるとMacのトラックパッドだとさらに遅く500msくらいかかってました。 InstantClick.ioはその間に裏でリンク先ページをロードして勝手にリンクをpjax化してしまうという高速化ライブラリです。 やってることはRails4のturbolinksと似てます
http://www.youtube.com/watch?v=1OAfGm_cI6Y 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 約4時間前GoogleのAddy OsmaniによるFuture of Web Appのキーノートスピーチです。 49分間 [Video]で下記の話題を全てまとめてます。フロント関連の便利ツールが一通り網羅されてます。おかげで、Yeoman (Yo/Grunt/Bower) の概要もすっきり理解できました。スライド(236枚)で確認されたい方はこちら。 Codekit Hammer Prepros Koala Mixture compass.app scout-app Yeoman / Grunt grunt-image: JPG/PNG/Gifを最適化して軽量化 grunt-
私は、元々エンジニアとしてランサーズに入社し、途中からディレクターに転身しました。ランサーズに入社する以前は、Googleアナリティクスをいじったこともなければ、CVRやCPAといった基本的なマーケティング用語すら知りませんでした。 まだまだ知識・スキル不足ではありますが、今まで得たものの多くは実際の業務を通して得られました。一方で、書籍を読むことで以下の二つのメリットがあると感じており、読書の時間を取るように努めています。 業務で得たスキル・知識を体系的に整理して定着させる そもそも知らないことをショートカットして知ることができる ディレクターに転身してから、必要な知識を身につけるために読んだ本を、ジャンル別にご紹介します。 Webエンジニアの時のおすすめ書籍は下記にまとめてあります。 kkino.hatenablog.com 基本的なビジネススキル どの職種においても必要なスキルだと思
あけましておめでとうございます。2014年! WP-Limeこと、星野邦敏です。 持ち回りで月に1回コンスタントにブログ記事を書いて、 1回目の記事は、2012年8月に、 案件の価格決めをどうしているのよ? 2回目の記事は、2012年9月に、IT勉強会を自分で主催するメリット・デメリットと、それらを有料or無料で開く判断。 3回目の記事は、2012年10月に、 支払サイト&入金サイトについて考える。 4回目の記事は、2012年11月に、TwitterBootstrapを使って短時間でWordPressテーマを作る。 5回目の記事は、2012年12月に、 寡兵(少ない兵力)で負けない戦を展開する方法 まで書いて、 2013年は、なんとWP-Dでは1記事も書いていませんでした。 2013年、主に何をしていたかと言うと、生まれ育った地元の埼玉県さいたま市の大宮駅近くで、コワーキングスペース
新婚旅行中に読んだ「SEO内部対策の教科書」2013年3月頃にスペインに新婚旅行に行ってきました。ゆっくり時間を取ることができるタイミングなんてないので飛行機の中や旅先で勉強しよう!ということで購入した本。 2013年になってSEOの外部対策よりも内部対策のほうが重要になるだろうな...と予想していたのですが、結果的に予想通りになったのでとても参考になりました。 内容も「教科書」と書かれているように、とても読みやすくわかりやすいものでした。内部対策のことを勉強したいと思っている人にはおすすめです。WordPressをもう少し使いこなしくて読んだ「WordPressの教科書2」男子ハックでは記事執筆担当は僕(@JUNP_N)が行い、開発案件はさく(@saku_t2)が行っています。 当初は2人でWordPressを触っていたのですが、今は任せっきり。技術レベルが離れていってしまったので、少
というわけで、今年も色々と読んでおくべきエントリーをまとめておきます。 正直読み返した上でリンクをぺたぺた貼っていったので、すんごい時間かかりましたけど、どいつもこいつも良記事でございます。読まずにいるとむしろ損する勢いでございます。 デザインWEBデザインが短期間に上達した方法 | FEVDESBLOG 『これは、自分が新米デザイナーだった頃にやっていた、デザインの上達方法です。上手くデザインができない!上手くなるにはどうすればいいの?など、どうすればデザインが上達するのかわかならい人の参考になれば幸いです。』 たった1枚に込められたクリエイティブすぎる17個の広告 この記事の2億円、2人っていう広告がほんとうに色々な意味で印象的。 2013年の4大人気Webデザインのトレンド | FlipsBlog Web担の小技 2013年のトレンド、今年のうちに。 50万件の投稿分析でわかっ
2013年Web制作に使い始めてよかったツール・サービスまとめ 〜そして時は2014年へ〜 2013.12.19 | この方法お勧めです! | 初心者向け | 制作あるある 皆様しわっす。WP-Dではジミーな技術系記事を書いてますエメラルドこと井村です。 パープルリーダーから「ゆく年くる年」というお題をいただきまして、たまにはまとめ記事的なものを書いてみたいと思います。 日々新技術に猛進する猛牛のような制作者の皆様には役に立たない記事だと思うので、日本酒でもたしなみながらくるくるスクロールしていただければこれ幸いであります。 個人的な話になりますが2013年3月に独立しまして、制作環境なども自分の好きな物を使うことができるようになりました。またフリーランスにとっては作業効率が自分の手取りに直結するので、作業の自動化・効率化は死活問題でもありますよね。 紹介しているツールやサービスは2013
プロフィールに記しておりますとおり、私は現在デザイン会社にて働いております。 昨年の3月、5年ほどやっていた「DTP・グラフィックのデザイン・レイアウト業務」から「Web担当」に相なり、日々勉強しながら仕事に臨んでおると言う状況です。 そのちょっと前までHTMLは妖精が書いていると思っていた私にとって、あまりに勝手の違う作業内容。最初は途方に暮れておりましたが、Twitter等で知り合うことのできた先輩Webデザイナーさん達のおかげもあり、現在では自分でWordPressのテーマを作成できるまでに成長することができました。頭を叩くと「セマンティック!」と音が鳴るまでになりました。 そんなわけでここいらで一度、自分がDTP→WEB担当になるにあたって勉強したこととか使っているツールとかをデロッとまとめておきたいと思います。 まずは業務をする上で必要不可欠になった言語や、作業効率を上げるために
これまで、MacBookAir 上で制作したWebページを IE 確認する時は、「VirtualBox」や「Parallels Desktop」という仮想PCアプリケーション上でWindows 8 などを起動し、そこで IE を起動して表示確認しています。 私は、Windows XP – IE8Windows 7 – IE9Windows 8 – IE10 のように、なるべく一般的なOSとブラウザーのバージョンで合わせて個別の仮想PCをインストールしていますので、実機で確認するのと比べてもほとんど遜色のない精度でIEでの表示確認をすることができています。 その際、「Windows 8 – IE10」環境は、パフォーマンスが良いと聞いて購入した「Parallels Desktop 7」という仮想PCアプリケーションを使用していました。 しかし、OS X を Mavericks(10
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く