地ビールブームの終焉から復活を遂げた『よなよなエール』。窮地を救ったネット通販成功の裏にはどのような取り組みがあったのか? 「最新トレンドの成功者から学べ! ECサイト研究レポート」第26回は、前回に引き続き、よなよなエールを製造・販売するヤッホーブルーイング代表取締役の井手直行社長に話を聞いた。 広告代わりに始めた“お試しセット” 2013年に自社サイトを立ち上げるまで、楽天市場に絞ってEC事業を展開してきたヤッホーブルーイング。2007年に新製品を投入するまで、製品は『よなよなエール』1つだけ。当時ネット通販の責任者だった井手社長は、新製品がなく、メーカーなので値下げもできない中で、サイトを訪れたお客さまやファンを楽しませることだけに集中して企画を打ち続けた。 しかし、楽天市場には、ビール好きではない、ましてや『よなよなエール』の熱狂的なファンではない人たちも多く訪れる。井手氏は集客の
著作権法とは、文学から絵・音楽・写真・映像などの「作品」は作り手に全て権利があることを明確にしたものでした。日本の場合は作品を作ったと同時に著作権が発生します。 著作権で保護された作品には「ALL rights reserbed」が記載されています。「ALL rights reserbed」を作り手の許可なく勝手に自分のサイトなどで使うのは著作権法違反です。 それに対し、著作権が期限切れになった作品、権利が放棄された作品は「パブリックドメイン」と呼ばれ、世界中の誰もが使える権利を持ちます。 これがザッとした著作権法のおさらいです。 (出典:https://creativecommons.jp/) しかし、インターネットが発達して誰もが自分の作品を世界中に発信できるようになった結果、この二つの著作権だけでは対応することができなくました。 クリエイティブコモンズライセンスは著作権保護とパブリッ
みなさん、Illustratorのスクリプトって使っていますか? 社内のデザイナーに聞いたところ、日常的に使っている人は9人中1人!そもそも存在さえ知らないよ、なんて人もいます。おいおい(;・∀・) 使わないともったいないぜ!!・・・と思いつつ、ぼくも使っていませんでしたw ということで使っていない人からすると、なかなか敷居が高いIllustratorスクリプト。実際の使い方・導入方法、どんな場面で使うといいのか?などなどまとめてみました。 この機会にぼくといっしょに始めてみませんか? そもそもどんな時にIllustratorスクリプトを使うの? Illustratorで作業する際、キーボードショートカットやアクションを使って効率化・スピードアップをしていると思います。スクリプトはその延長と考えてもいいと思います。 少しでも早く作業をするため、単純作業を減らすため、よく使う作業を自動化する
検索エンジンがページ構造を理解しやすいようにHTMLがマークアップされていることは、安定的に検索結果上位にインデックスされるために重要な要素の1つです。 当然のことながら、前提として検索キーワードを想定した質の高いコンテンツ作成が必要です。せっかく質の高いコンテンツを作成してもマークアップの仕方が論理的に間違っていると台無しです。 今回はSEO対策として押さえておいてほしいHTMLおよびHTML5マークアップの最低限のポイントについてお話しします。 この記事では自力でSEOに最適なマークアップをする方法を紹介していますが、はじめからSEO対策がばっちりなWordPressテーマを使えば、なにもしなくても良いのでとてもラクです。SEO対策が万全のWordPressテーマは下記で紹介しています。 WordPressのおすすめテーマはコレ!SEOもレスポンブも完璧【有料&無料】 headタグ内の
作成:2016/02/29 更新:2016/06/29 Webデザイン > 今年の頭にWeb制作に必要な知識が一通り学べるベスト記事9選をまとめましたが、今回はWebデザイン版をコムテブログの中から厳選してピックアップしました。総集編的な感じです。Webデザインに必要な基本知識をサラッと知りたいときに。 エンジニア速報は Twitter の@commteで配信しています。 演出を学びたい レイアウトはユーザーが目的を達成させるために必要な設計。情報・環境に応じてレイアウトを組み立てていきます。上質さ・静寂さ・親しみやすさなど雰囲気や演出を学ぶならこの記事。 オシャレなレイアウトやユーザーが使いやすい配置を実現するために知っておきたい知識を、国産サイトを例にあげながら解説。クライアントの要望に合わせてアイデアを出したいとき、レイアウトで困った時に読んでおきたい記事。 実務で役立つ逆引きレイア
まず前提としてこれから話すことはあくまで‘‘私の”体験談であって全員が全員そうな訳ではない、という事をご理解頂きたい。 ブラック企業で働く社会人は基本的には満身創痍である。私も例外ではなく、度重なる理不尽な労働に体力と気力を奪われ、労基に行くだけの気概を持てなかった。しかしこのままではいかんと奮起し、1月下旬の休日。新宿の労基へと足を運んだ。新宿の労基を選択した理由としては、私が働く会社の本社が新宿に存在するからだ。 労基に到着し、受付番号を受け取り、相談の列に並ぶ。それはもう長蛇の列だ。日本の労働環境は破綻している。そう感じさせるほど長い列だ。待つ事30分。相談員に呼ばれ、小さなブースに入る。相談員は初老の男だ。深い皺が刻まれ、眼の下には濃いクマがある。おかしな話だが、労基での労働ももしかすると多忙を極めるのかもしれない。 相談員に向かって、かいつまんで相談内容を話した。現在の労働環境、
2016年2月9日 Illustrator, SVG, 便利ツール 繰り返し使うSVG形式のアイコン等を表示する際に便利なSVGスプライト。しかし、symbol タグで囲んで…一つ一つにIDを付けて… viewBox 属性をコピペして…と、本当にコーディングがめんどくさい!新規プロジェクトを始める度に設定するのが煩わしくなり、いろいろと楽する方法を試した結果、アイコンジェネレーターツールの「IcoMoon App」を使う方法に落ち着いたので、やり方を紹介したいと思います。 ↑私が10年以上利用している会計ソフト! SVGスプライトとは? SVGスプライトは、ロゴやアイコンなどの複数のSVG画像をひとつのファイルにまとめて保存し、使いたい時に呼び出す方法です。SVGなので、拡大縮小しても画質が劣化しません。詳細は過去記事「アイコンフォントからSVGへ!より手軽にベクター画像を表示しよう」に目
こんにちは、mayukouです。 みなさん、いかがお過ごしですか? さて、今回はデジタル表現でアナログ顔負けの混色方法をご紹介します。 質圧感知のペンタブがあれば、簡単にできますよ〜 では行ってみましょう! 今回はブラシの油性マーカーにしました。 より水彩画風に表現するにはブラシパネルのウェットブラシにチェックを入れましょう 3.描画色と背景色に混色したいカラーを選んでおきます 4.ブラシパネルの設定 カラーをクリックしてチェックを入れて画面を表示します。この画面で、 描画色と背景色を混色しながら塗れるように「描点ごとに適用」にチェックを入れます。 「描画色・背景色のジッター:0」「コントロール:質圧」に変更します。 5.ブラシツールで色を塗ってみます 設定ができたら、ブラシツールで色を塗ってみましょう。 例では水玉を描いています。 筆圧が低いと黄色っぽく、高いと青っぽくなるのがわかります
テキストのみで作られたようなシンプルなナビゲーションにdata属性を利用したカスタマイズを施した実装サンプルです。 いずれもカスタマイズといっても簡易的なものばかりでほぼホバー時の動きにはなりますが、紹介しているような方法を使うことでHTMLに記述する要素を少し減らすことができたり、ちょっとしたアニメーションを加えたりすることもできます。 また、あまりdata属性を使ったことがないという人はこういう使い方もあるということで参考にしてみてください。 ここで紹介している内容はdata属性を利用した実装サンプルのひとつとして紹介しており、擬似要素で表示させているテキストはあくまで装飾目的で表示している想定になります。 SEOやスクリーンリーダー対応などに影響があると考えられる場合は、しっかりとマークアップしたもので実装してください。 補足テキストを表示 #1 見かけることが多いと思う、ナビゲーシ
画像は使用せずにCSSのみを使って実装したハンバーガーメニューアイコンの見栄えやクリック・ホバー時のエフェクトサンプルなど全10種類です。 以前にもハンバーガーメニューをクリックした時のエフェクトを紹介しましたが、あれからまた備忘録として残しておきたいものが幾つか出てきたのでシェアします。 共通のHTML・CSS サンプルで使用しているHTMLとCSSは下記をベースとして使用しています。 スタイルの中には幅や高さを指定している部分やラインの色を指定している部分などあるので、紹介しているものを使用する場合はこれらを自身の環境に合わせて調整してください。 <button class="menu-trigger"> <span></span> <span></span> <span></span> </button> .menu-trigger, .menu-trigger span { dis
少し発光しているような感じに見えるグロー(グローイング)デザインを適用したボタンのサンプルです。 このデザイン自体は以前からあったと思うのですが、最近DribbbleやBehanceといったデザインのインスピレーションサイトだったり、綺麗なUIデザインを紹介しているようなサイトでよく見かける感じがして、配置や組み合わせももちろん関係はあると思いますが、見た目が綺麗なものやかっこ良いと思うものが多かったので、幾つか再現してみたり思い付いたりしたものを作ってみました。 いずれも面倒な記述などなく簡易的なものばかりですが、もしこのまま使用したいという場合はコピペで実装できると思います。 共通のHTML・CSS 以下で紹介しているボタンスタイルは、全て下記のようなHTMLとベースとなるCSSが指定してあります。 .button { display: block; padding: 1em 3.2e
ツイッターの公式ブログ(英語版)に「ツイッター広告に効果的なキャッチコピー」について、データが紹介されていたので、簡単にメモします。 3,200のアプリインストール広告のデータを元に、リサーチした結果だそうです。アメリカのデータなのですが、日本でも応用できるとおもいます。 1、「いま」の力を活用する。「いま」「急げ」「はやく」「これがラスト」「限定」、このようなワードを含んだツイートは、すごく効果があるそう。 1インストールあたり、36%のコスト削減につながり、9%高いインストール率(CVR)につながっていると。 ↓日本の例でいうとこういうやつでしょうか。 2、お客さんに呼びかける。「あなた」「あなたの」のような、2人称で呼びかけるキーワードを入れることで、広告のパフォーマンスをあげることができる。 1インストールあたり、18%のコスト削減につながり、13%高いインストール率(CVR)につ
どうも、JUNICHIです。 リンクが付いたテキストや画像にマウスを乗せた時(マウスオーバー時)、色んなアニメーション・効果があるとなんだかカッコいいサイトになった気分になりますよね。 そこで今回は、WordPressでブログを運営しているあなたのために、プログラミングのど素人でもコピペで簡単にできるカスタマイズ方法を紹介します。これで、ライバルサイトに差をつけてちょっとだけサイトをカッコよくしてやりましょうぜ! まずは、プラグイン「Simple Custom CSS」を入れよう! CSS(スタイルシート)を直接いじってしまうと、サイトが一気に変になってしまうので、今回は本体のCSSを上書きしなくても編集ができるプラグインを入れていきます。 「Simple Custom CSS」というプラグインを使えば、WordPressのどのテーマでも、メインのスタイルシートをいじらなくても一部だけ上書
http://luvlife.hatenablog.com/entry/2013/08/07/221155 読んで色々考えさせられた。 せっかくなので、身の上話を増田に吐き出そうと思う。 すごい田舎の底辺中学を卒業してるけど、地元同級生たちや親戚達の常識感っていうのは独特だなぁとずっと思ってた。 上京してからは特にそう思ってて、同じ日本なのに本当に違う世界が共存しているんだなと思ってそれがもう日本だと思ってた。 この記事を読んで、そうかそれは「低学歴の世界」と「高学歴の世界」の溝だったんだと納得した。 地元は田舎だからか両親ともに兄弟が多くて、いとことか30人くらいいるんだけど、その中で大学に行かせてもらったのは俺くらい。 俺の両親は、他のいとこが次々と中卒・高卒で働き始めたりしているのを横目に、頑張って俺を大学まで行かせてくれた。 両親が大学まで俺を行かせたかった理由としては学歴コンプレ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く