競合サイトを丸裸に！SEO対策や検索順位などがわかるWeb分析ツール7選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
Pooleリーダーの鮫島です。 競合、丸裸にしてますか？（ライバル視しているサイトの、アクセス数やどこからトラフィックがあるのか、どういったキーワードを選定しどのくらいの検索数があるのかなど、SEO周りの対策を分析していますか？） 私は、主に提案資料を作成するときや、サイト設計をするときなどにします。 そういうときは、競合分析ツールを使うと効率的に情報を取得することができます。 というわけで、今回は私が普段使用している競合分析ツールを厳選して7ツールご紹介します。 無料で使える！ 競合サイトを分析できる7つのツール 1. Dockpit（ドックピット） https://www.valuesccg.com/dockpit/ 最近、認知度が高まりつつある競合分析ツールです。 機能の一部が無料で使えるのがかなり助かりますね。 無料登録で取得できる指標はざっと下記の通り。 自社サイトと競合サイトの
圧巻！個性が爆発している超絶技巧サイト6選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
どうもです！ ダンサー兼フロントエンドエンジニアのシスコです！ 最近、すっかり暑くなってきましたね！ 暑くて体がだるくなってきそうです。。。 今はそんなにですけど、よく「チョコモナカジャンボ」を2、3個ほおばりながら帰ってたころが懐かしいですね……。 そんなこんなで、今回はアニメーションの参考でWebサイトを漁ってるときに見つけた、個人的にオモシロい・イケてるなって感じたサイトを挙げてみます！！ ドラマの世界観をゲームで体感！「守り人クエスト」 守り人クエスト-精霊の守り人 NHK ONLINE 綾瀬はるかさん主演のNHK大河ファンタジー「精霊の守り人」の世界をゲームで体感できるサイトになってます！ 人生ゲームのように数字の書かれたルーレットを回して、ひたすら異形の者からマップを駆け回って逃げるというゲームです。先に進めば進むほど、異形の者の進むマスが増えるのと、分岐部分で分裂してくるので
鳥肌200%！クリエイターポートフォリオ厳選集！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
イヤフォンを新調した初日にネコに噛みちぎられたフロントエンドエンジニア、ザワです。こんにちは。 今回はWebクリエイターのポートフォリオサイトに注目し、筆者の鳥肌が立った、心が躍ったサイトを集めてみました。この記事を読み終わった直後には、あなたも制作意欲が湧いていることを期待しています。 WebGLを使用し、実験的な手法を用いた作品を集めたショーケースです。Chrome Experimentsに載っている作品、A-I-U-E-O、などもあり、ひとつひとつのスケッチのクオリティが激高です。このサイトをスケッチブックとしてとらえると、子供が無邪気に絵を描きなぐる様子が浮かんできます。好きこそものの上手なれ。私はそうこのサイトから教えられました。 鮮やかな技術に惚れる「Takumi Hasegawa」 https://tkmh.me/ なんですかね。惚れちゃいますよね。こんな綺麗な配色でグリグリ
Instagram APIを取得してWebサイトと連携し、投稿写真を自動に掲載する方法 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
おはうぃーす！ しょごです。 先日ノートPCを購入しました、これでスタジオでドラム録音とか動画作成とか気兼ねなくできます。 久しぶりに演奏動画でもアップしよう、、ゲーム実況もいいな。。。ふふふ。。 さて、今回はInstagramAPIを使ってWebサイトと連携したときの話です。 Instagramとは iPhoneやAndroid端末で写真を撮影し、共有するスマートフォンアプリのことです。Webからも閲覧でき、固有アカウントを設けて投稿管理ができる写真特化型のSNSです（もちろん無料）。 Twitterのようにフォローした人の写真がタイムラインに流れてきて、アップロードした写真には「いいね！」やコメントを付けることができます。アプリ内のカメラで撮影した写真や、カメラロールの写真を選択して手軽にアップロードができます。 プライベートモードで非公開設定も可能。Twitterとの最も大きな違いは
Webデザイナーがスキルアップするために必要なスキル5つ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
どうも〜、こんにちはぁ！もっともっとWebデザイナーとして成長したいライター、のび太です。 さて、突然ですが「Webデザイナーにとって必要な能力ってなに？ 」という疑問をもったことありませんか？つい最近フリーランスのWebデザイナーとして飯を食っていくことになった僕ですが、最近ますますその答えが知りたくなりました。 HTML、CSSなどのコードが書ける人？Photoshopでキレイなデザインが作れる人？Webについて詳しい人？いったい「Webデザイナー」ってなんなのでしょうね〜？ 僕はこれまでWebデザイナーに関する海外記事を多く読んできましたが、「へぇ〜、Webデザイナーってこんな能力もなんだなぁ〜。」って意外に感じたことが結構ありました。 今回はその中でも特に重要だと思った5つをピックアップしてご紹介したいと思います。 Webデザイナーがスキルアップするために必要な能力5つ 1. 事前
スマホサイト構築に便利なドロワーメニュー・スワイプのjQueryプラグインまとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。デザイナーのはるえです。 もうほとんどの案件でPC＋スマホ制作がセットになってきましたね。 LIGに入社したての1年前まではスマホの制作経験を聞かれてうつむき気味だった私も、おかげさまで今じゃスマホサイトを喜んで作るようになりました。 ありがとうございます！！ そこで今回は、スマホサイトで使われやすいドロワーメニューやスワイプ実装の際に必要となるプラグインをご紹介させていただきます。 【こちらもおすすめ】 ☞ 高機能なJavaScriptの人気スライダープラグイン4つを実際に使ってレビューしてみた Facebookでもおなじみのドロワーメニュー3選 今じゃ基本中の基本となっているドロワーメニュー。 Facebookなどで使われている、横からぬるっと出てぬるっと引っ込むあれです。動きが気持ちよくて、実装も簡単にできるものを中心にまとめてみました。 jQuery slimMenu
レスポンシブデザインを制作するなら頭に入れておくべき基本事項7つ | 株式会社LIG
どうも〜こんにちはぁ！ 最近レスポンシブなサイトを作ることが多いライターの、のび太です。 モバイル、タブレットユーザーが最近どんどん増えてきているので、Web制作者にとってレスポンシブなサイトが作れるってことが必須になるんじゃないかなぁ〜って感じますね。 レスポンシブデザインを制作するときに意識しなきゃいけないことはいろいろありますが、今回は「これはぜったいに知っておきたいよね！」って感じた基本的なことを7つご紹介させていただきたいと思います。 レスポンシブデザインを制作するときに意識しておきたい基本項目7つ 1. 画像の代わりになるべくCSSで表現すべし レスポンシブデザインで画像を使うと、モバイル端末ではPCに比べて回線速度が遅いため、読み込み時間が余計にかかってしまいます。 そのため、画像ではなくCSSで表現可能なものはどんどん代替していったほうがいいと思います。 立体ボタンや矢印だ
「Sublime Text」 完全入門ガイド！
こんにちは～ 仕事が恋人のデザイナー、王です φ(≖ω≖｡)♪。 最近海外でもてはやされまくりのテキストエディタ「Sublime Text」と恋に落ちたことをこの場で告白したい！ やっと出会えたぞ！僕が探し求めていた幻のエディタに！！ 昨今話題沸騰中の「Sublime Text」エディタについて、ご紹介しましょう！本記事を読んで、ぜひとも他のエディタからSublime Textに乗り換えていただきたいです！ 見た目的には、このように、優雅（Sublime）そのもの！ Mac、Windows、Linux 三大プラットフォームで動くのも嬉しいですな！ 公式サイトは下記リンクです。 https://www.sublimetext.com/ それでは、動画やキャプチャーを使ってSublime Textの素晴らしい魅力を伝えていきたいと思います。 Sublime Textのチャームポイント 特色機能
Web制作者はブックマーク必須！LIGブログ記事を知りたい分野別にまとめてみました。
日本のみなさん、こんにちはぁ！LIGサイトを教科書代わりに使っています、ライターの、のび太です。 今回は、これまでLIGで公開された記事をWeb制作者が見たいもの、学びたい分野別にまとめてみました。ぜひブックマークしておいて、時間があるときに見ておいてくださいね。特にWeb制作者の方は必見だと思います。めっちゃ勉強になること間違いなしっす！ LIGブログ 知りたい分野別リンク集 Sass、Compassを学びたい人 CSSの常識が変わる！「Compass」、基礎から応用まで！ これからSassを始めたい人へ！導入手順をまとめてみた(Dreamweaver対応) 目指せSassマスター！デザイナーがすぐ実践出来る基本テクニック12連発 Compassの設定ファイル「config.rb」の編集方法 Sassを使ったコーディングの強い味方に！便利なextend＆mixin集を作ってみた Sass
CSS3アニメーションをらく～に実装！オンラインツール7選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。デザイナーのハルエです。 最近の流行は「トシムリン」です。あぁ次こそ生で見たい・・・。 CSS3でアニメーションを作成するとコードが肥大化して複雑になるため、ライブラリやオンラインツールを使用して作成している方も多いと思います。 簡単なアニメーションで言えば、「transition」でボタンのマウスオーバーに背景色をアニメーションさせたり、画像をフェードさせたり拡大・縮小させたり・・・などなど。 「animation」を使えばさらにできることが広がるのですが、まだまだwebkitブラウザ以外では正常に動作しないのが難点です。 今回は、CSS3アニメーションを一瞬で設定できちゃうオンラインツールをまとめて紹介します。もう知っている人もたくさんいるとは思いますが、まだ使ったことのない方はぜひ一度試してみてください。 CSS3アニメーションを実装！オンラインツール7選 Animate
カスタマイズ性抜群！Sassに対応したCSSフレームワークがアツイ！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。デザイナーのはるえです。 レスポンシブWebサイトを作成する際に重宝されているCSSフレームワークですが、「自由度が低い」「使わないUIパーツは邪魔になる」「カスタマイズするのに手間がかかる」「結果CSSファイルが肥大化してしまう」など、利用するうえでのデメリットも多々ありました。 実際フレームワークって、レスポンシブの大枠ができちゃってるし、コンポーネントが充実してる分あまり作り込む必要がないんで楽っちゃ楽なんですが、テンプレートに束縛されちゃデザイナーとしては面白くないしあまり頼りたくないってのも正直なところ。似たりよったりになるし。。 過去にCSSフレームワークの代表的存在「Bootstrap」を利用しましたが、柔軟性の低さに苦しめられたのを覚えています。 ですが最近はCompassのようにSassファイルが収められたシンプルでカスタマイズ性の高いCSSフレームワークが増
簡単で高機能！デザイナー必見の汎用性が高いjQueryプラグイン7選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。LIGフィリピン支社代表のせいと(@seito_horiguchi)です。 最近、いろんな先輩方から「お前服だっせえな」と言わるので、ファッションの傾向を泣く泣く変えました。嵐の相葉君をお手本にこれまで頑張って参りましたが、相葉君には近づけませんでした。無念。 さて、今回はさまざまなシーンで活用できる、汎用性の高いjQueryプラグインを7つほどご紹介させていただきます。簡単＆シンプルで優れた機能のものばかりなので、ぜひご覧ください。ダウンロードできる本家サイトのほかに、日本語で分かり易く解説してくださっているサイト様のURLも合わせて載せておきます。 1.世界一使いやすいスライダー”bxslider.js” カスタマイズ豊富で、設置の仕方も超簡単！弊社CTOづやさんのオススメでもあります。 フリック、スワイプも対応しています。最強すぎます。 ダウンロード：bxslider様
コンテンツ作りに役立つ基本的なマーケティング心理学まとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
皆さんこんにちは、メディア事業部のそめひこです。 記事や企画作りを行う上で、アイデアやコンセプトがなかなか浮かんでこないことが多々あります。結構な量の記事や企画を組み立てていくので、頭が柔軟ではない自分にとってはアイデアやコンセプトを出していくのは結構な重労働。 そんなときに私が最近参考にしているのが、”心理学”です。 心理学 = 生物体の意識や行動を研究する学問 漠然としたアイデア出しを、心理学を通してより具体的に仕立て上げることで、ある程度の道筋をたてることが出来ます。 アイデア出し役立つ基本的なマーケティング心理学まとめ ■認知的不協和 個人のもつある認知と他の認知との間に不一致・不調和が生じること。その結果、不協和を解消あるいは低減しようとして行動や態度に変化が起こる。 例えばヘビースモーカーの喫煙者に対して、「タバコを吸うとガンになるリスクが高くなり長生き出来ないのでやめなさい」
スマートフォンサイトのHTMLコーディングメモ12個 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
display:table-cell; を活用する リキッドレイアウトのコーディングにすごく便利。 親要素に display:table; 子要素に display:table-cell; 記事リストなど、画像とテキストを横並びにするときに。 均等に横並びにしたいときに。 タップ時のカラー設定 CSSで以下のように設定。アルファ値も設定可能。 -webkit-tap-highlight-color: rgba(255,105,183,0.6); 画像、iframeに max-width を指定 img・iframeは、サイズが大きすぎて画面からはみ出すことがあるので max-width:100%; を指定する。 word-break:break-all; を指定 スマホは幅が狭いため、長いURLなどが1行に入りきりません。 word-break:break-all; を適宜指定する。 フォ
WordPress管理画面カスタマイズあれこれ10選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちわ、最近は右下のデブと言われることが多い段田です。 今回はWordPress管理画面のカスタマイズを紹介したいと思います。 1.左メニューのカスタムタクソノミーメニューを消す。 カスタムタクソノミーを追加した際、 管理画面では投稿やカスタム投稿タイプのメニューの中にサブメニューという形で カスタムタクソノミーメニューが表示されます。 このメニューを特定のアカウント時は 表示させないようにするカスタマイズ方法を記載します。 サブメニューはremove_submenu_page関数を使うことで削除出来ます。 remove_submenu_page関数はグローバル変数の$submenuの配列データを操作する形になります。 function remove_submenu_page( $menu_slug, $submenu_slug ) { global $submenu; if ( !i
結婚のご報告。30年彼女がいなかった僕が、秒速で結婚できた理由。 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、メディア事業部、部長の紳さんです。 突然ではございますが私、竹内紳也は2013年4月12日に入籍をいたしましたので、ご報告させていただいます。 会社の公式ブログを通じて、このような私的な報告をさせていただく事に感謝しつつ、30年間彼女という存在を手に入れる事が出来なかった僕が、それらのプロセスを全て飛ばして結婚するに至った経緯を公開させていただきます。 ことの始まり 様々な嘘、ネタで盛り上がりを見せるエイプリルフール。我々はあえて嘘をつかず、本気で僕の嫁を募集するという記事を発表いたしました。 紳さんこと、株式会社LIGメディア事業部・部長の竹内紳也が嫁を募集します。 画像ではかなりフザケていますが、記事の内容としてはなるべく真面目に、誠実に、本気でお嫁さんを募集したつもりです。 嫁に求めたいもの 20歳〜35歳の女性の方 将来、長野県の田舎で一緒に暮らせる方 300万円を超え
見た目を綺麗に整列する！ブロックレベル要素の高さを揃えるJS3選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
お疲れ様です、デザイナーのモモコです。 コーディング中にいざ本番の文言を入れたら、予想以上に長さがバラバラで見た目が揃わない…！なんてこと、ありますよね。今回はそんな時に活躍してくれるブロックレベル要素の高さを揃えるjsを3つご紹介します。 heightLine.js 配布ページ <script type="text/javascript" src="heightLine.js"></script> class名のつけ方によって高さを揃える要素をコントロールできるJavascriptです。 子要素の高さを統一できる「heightLineParent」が便利で良くお世話になっていました。 jQueryAutoHeight.js 配布ページ※このページは現在削除されています。 <script type="text/javascript" src="jquery.js"></script> <s
脳に優しいデザインを！「Vertical Rhythm」の基本と実現方法 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、デザイナーの王です。 どうも近頃はいぬ肌が恋しく、無性にワンコちゃんをなでなですりすりしたくてうずうずしるのですが・・ こういう写真を眺めているだけで心がほわ～っとしてきますよね 久しぶりに記事を書きます。「Vertical Rhythm」と呼ばれているデザイン手法ご存知でしょうか？さり気なく取り入れることで、文章が読みやすくなったり、レイアウトが整ったりすることが期待できるという。 デザインに限った話ではないが、完璧な正解など存在しないと思うので、あくまで一つの考え方として捉えて頂ければと思います。 実例を挙げながら進めて行きますので、「Vertical Rhythm」の考え方とその良さ、便利さをきっと理解してもらえるんじゃないかと思います。 前書き クライアントに「説得力のあるデザイン」を届けよう！ LIGでデザイナーをやってて、よくベテランデザイナーさんにこういう風に言わ
伝説のウェブデザイナー | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
伝説のウェブデザイナーを探して 西暦2012年 株式会社LIGは深刻なデザイナー不足に見舞われていた。 そんな中、過酷な労働を強いられるデザイナー達が限界を迎えようとしていた。 「もう15時か。あー、今日もよく働いた」 「おい、お前達、しっかり働けよ。俺はもう上がるからな」 「ヴぇっ！？」 「な、なにをする！」 「うっ…ぐ…」 「……………………」 ～～～～～～～～ 「……………………」 「えっ？」 「ふふふ、社長…ようやく目が覚めたみたいね」 「！？ なんのつもりだ！さっさとここから出せ！」 「社長。俺達の言う事さえ聞いてくれたらすぐにでも出しますよ。」 「お前達の言う事だと…一体何が望みだ？」 「新しくウェブデザイナーを雇うこと。それが望みよ」 「ウェブデザイナーを雇うだと？！…だからって、何故こんな事を…！！」 「………………」 「クズどもが！早くここから出せ！」 「黙って聞いていれ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
株式会社LIG（リグ）