タグ

スニペットに関するmut00tumのブックマーク (8)

  • Googleの強調スニペットを狙え! #1 表示させられるポイントの見つけ方 | Moz - SEOとインバウンドマーケティングの実践情報

    「強調スニペット」を獲得するのは、グーグルのSERPの1ページ目で目立つ最高の方法の1つだ。だが、そこは競争の激しい場であり、そこに載る可能性を高めるためには、考慮しなければならないことが山ほどある。 今回のホワイトボード・フライデーは、MozのSEO研修生でミニブタが好きなのブリトニー・ミュラーがお送りする3回シリーズの1回目だ。 実施しなければならない「キーワード調査」「現在の検索順位の評価」「関係するデータのスプレッドシータへの記録」というステップと、その際に役立つ2つのツールについて、説明していく。 →第2回を見る →第3回を見る Mozファンのみんな、こんにちは。ホワイトボード・フライデーにようこそ。今回は、強調スニペットの機会を発見するために必要なすべてのことについて説明しようと思う。 3の動画からなるシリーズの1目として、まずは「表示できそうなチャンスを見つける」段階につ

    Googleの強調スニペットを狙え! #1 表示させられるポイントの見つけ方 | Moz - SEOとインバウンドマーケティングの実践情報
  • コードスニペット管理はSnippetsLabでいくわ

    この記事は 俺のメニューバー Advent Calendar 2015 10日目の記事です。 色々とコードスニペットツールを使ってきましたが、やっとしっくりくるコードスニペットツールに出会えました。俺、SnippetsLabでいくわ。 Stop reinventing the wheel – be more productive with SnippetsLab. インストール インストールはApp Storeから。 SnippetsLab カテゴリ: 開発ツール 現在の価格: ¥1,200 使用方法 俺は、メインウィンドウから登録し、メニューバーのアイコンより検索・コピーして使用。という感じで使っています。 ネットも必要なく、単体で動作し、つねにメニューバーからアクセスできるのが、結局一番使いやすいと思いました。 メニューバー メニューバーのアイコンよりいつでも検索・登録ができます。 公

    コードスニペット管理はSnippetsLabでいくわ
  • もっと!Promiseと仲良くなるためにスニペットを用意する - Qiita

    よく叩くわりに長いフレーズはスニペットに入れておくと捗ります。 エディタ別のスニペットを用意しました。 今日から貴方も more Promise ライフ! Sublime Text Toolsメニュー→New Snippets... promise.sublime-snippet の名前で保存します。 <snippet> <content><![CDATA[ new Promise(function (resolve, reject) { $1 }); ]]></content> <tabTrigger>promise</tabTrigger> <scope>source.js</scope> </snippet> Visual Studio Code (2015/11/23 追記) Visual Studio Marketplaceで公開しましたので、簡単に導入できます。 Promise

    もっと!Promiseと仲良くなるためにスニペットを用意する - Qiita
  • フォーム周りで覚えておくと便利なCSS Snippets - NxWorld

    フォーム周りでCSSを使ってスタイリングしていく際に、個人的によくど忘れしてしまうものや便利だと思うプロパティやスニペットをまとめました。 全体的に普段からCSSをよく触っている人にとっては特別目新しいものはないかと思いますが、まだCSSを触り始めて間もない方やこれからCSSを触ってみようという方は覚えておくと便利だと思うのもいくつかあるので参考にしてみてください。 紹介している内容はブラウザ(特にIE9以下)によっては使用できないものや表示確認ができないものもいくつか含まれています。 各要素のデフォルトスタイルを削除 フォームで使用するinputやtextareaなどの要素はブラウザやデバイスによって見た目は異なりますが、予めボーダー・グラデーション・角丸といったスタイルが適用されています。 特にこだわりがなければこのまま使用したり、多少手を加えるだけということもありますが、異なるブラウ

    フォーム周りで覚えておくと便利なCSS Snippets - NxWorld
  • レスポンシブコーディングのスニペットいろいろ - やっぱりWebが好き - Writing Mode

    コーディングを自身でやることは少なくなってきたけれど、勘が廃れないように今でも時々デザインしたり、コーディングしたりってのも大事にしてます。たまにデザインやコーディングをするのは気分転換にもなるし、新しいテクニックを知っておくことだってまだまだ大切だと思うし。 今の僕は、作る仕事はできる限り任せる立場だと思うので、あくまでもやり過ぎない程度に、って考えてますけど。というわけで、最近覚えたスニペットまとめ。 レスポンシブでサイトを作ることが増えています。 予算やスケジュール、または技術的な問題など、レスポンシブで構築するのが難しいケースもありますが、今の僕はできる限りレスポンシブ優先で考えたいと思っています。 ワンソースで考えたほうが運用は効率的だと思うから。 Writing Modeは僕にとってレスポンシブデビューだったサイトで、今思うと「こうしておけばよかった」ってところはいっぱいありま

    レスポンシブコーディングのスニペットいろいろ - やっぱりWebが好き - Writing Mode
  • 【Photoshop入門】Webデザインをはじめよう!第1回 デザイン前に覚えておきたい環境設定とレイヤー機能 - Adobe Blog

    The Blog | Welcome to Adobe Blog アドビのブログでは、Creative Cloud、Document Cloud、Experience Cloudの最新情報や役に立つ情報を紹介しています。

    【Photoshop入門】Webデザインをはじめよう!第1回 デザイン前に覚えておきたい環境設定とレイヤー機能 - Adobe Blog
  • 一度書いたコードは二度と探さない!スニペットを究めて快適コーディング!【HTML, CSS, JavaScript】 | WebNAUT

    一度書いたコードは二度と探さない!スニペットを究めて快適コーディング!【HTML, CSS, JavaScript】 ※この記事は2013年8月26日に執筆された記事です。現在は仕様が異なる可能性があります。 気がつけば繰り返し同じ単語で検索し、同じコードを書いている…なんてことはありませんか?「この部分の記述、もう一回使うことがあるかも」と思ったらぜひスニペットとして登録しておきましょう! スニペットとは繰り返し登場するコードの断片、またはそれをすぐに呼び出せるように管理するエディタの機能のことです。自分がよく使用する記述をスニペットにしておけばいちいち検索したり、昔書いたソースを探ってみたりすることなく、使いたい時に正確な記述をサッと呼び出して使うことができます。 Dreamweaver、Sublime Textなどのオーサリングツールやテキストエディタにはスニペットを自在に使うための

    一度書いたコードは二度と探さない!スニペットを究めて快適コーディング!【HTML, CSS, JavaScript】 | WebNAUT
  • box-shadowを使って実用的で素敵なUIエレメントを実装するCSSのスニペットのまとめ

    CSS3初心者でも簡単に利用でき、上級者でも実装のヒントになる、ページでよく使うパネルやボックス、ボタン、バーなどをbox-shadowを使って実装するスタイルシートのスニペットを紹介します。 10 Creative Techniques Using CSS3 Box Shadow 10個のスニペットは、Apple, Pinterest, Facebookなどで使用されているエレメントのHTML/CSSを簡略化したものです。 1. スクロールしてもバーを常に最上部に表示 2. サブナビゲーションのドロップダウン 3. シャドウを使った光沢が美しいボタン 4. 吹き出しスタイルの通知パネル 5. Appleのページラッパー 6. Appleのコンテンツボックス 7. Appleのフィーチャーリンク 8. 画像にさりげなくシャドウを添える 9. フォームの入力を目立たせる 10. エラステック

  • 1