mei_koutsukiのブックマーク (445)

  • 原稿の推敲・校正・リライトを支援する8つの文章チェックツールを作りました! - ときまきドッペル!

    お久しぶりです。タロットプロット広報担当の海鳥まきです。このたび、タロットプロットに8つの文章チェックツールを追加しました。 原稿の推敲・校正・リライト作業を支援するためのツールです。お役に立てるかどうかは分かりませんが、なかなかに面白いものができました。 (※記事投稿時は3種類でしたが、その後ツールが5つに増え、さらに8つに増えました!) 原稿チェックマーカー4種 1.「リライトマーカー」多用・乱用しがちな文章表現をハイライト 文章推敲支援ツール「リライトマーカー」 リライトマーカーは、主にWebライターの方向けのリライト支援ツールです。 テキストボックスのなかに文章をコピー&ペーストするだけで、注意すべき表現に赤色マーカーをつけてくれます。(上記画像をご参照ください) 画像中では「こと」や「もの」といった単語がハイライト表示されています。「~すること」「~するもの」は得てして抽象的な表

    原稿の推敲・校正・リライトを支援する8つの文章チェックツールを作りました! - ときまきドッペル!
    mei_koutsuki
    mei_koutsuki 2016/11/15
    これはよさそう( ˘ω˘)
  • WordPressのカレンダー系プラグイン8個。色分けして営業日やイベント告知。予約受付できるやつも。

    「営業日や臨時の休業日を案内できるカレンダーをサイトに付けて」って要望が、クライアントさんからけっこうあったりします。「予約可能かどうかをカレンダー上で◯とか×で見せたい」や「カレンダーから予約できる機能がほしい」ってのも多いです。 そんな要望に応えられそうなWordPress プラグインを集めました。 当は要望を満たせるシステムを案件ごとに開発できればいいんでしょうが、それだけ予算に余裕があるケースばかりでもなく。 ってことで、どうぞ。機能・用途別に8個あります。 カレンダー系プラグイン8個 1. レスポンシブOK。カスタマイズできるGoogleカレンダー:Google Calendar Events 2. 色分け営業日カレンダー:WP Simple Booking Calendar 3. サイドバーにピッタリ営業日カレンダー:Biz Calender 4. 格イベント告知カレンダー

    WordPressのカレンダー系プラグイン8個。色分けして営業日やイベント告知。予約受付できるやつも。
    mei_koutsuki
    mei_koutsuki 2015/10/13
    メモメモ( ˘ω˘)
  • 『デザインは8の倍数でできている』

    1 pixel|サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 はじめまして。 mama&crowdのデザイナー、長谷川彰之介です。 今回は、WEBサイトの「余白」や「ブロックサイズ」「WEBサイトの横幅」に対して 「最適な値は存在するのか?」 について考えてみたいと思います。 少々長いですが、お付き合いのほどよろしくお願いします。 ボックスサイズとは、「ヘッダー」「コンテンツ」「ナビゲーション」などの ひとつひとつの固まりの大きさ(サイズ)を指します。 【第1部】8の倍数 WEBサイトのUIをデザインしていて悩まされるのが「余白」です。 「ここは3px…いや4pxか。もっと空けたら見やすくなるかもしれない。6p

    『デザインは8の倍数でできている』
    mei_koutsuki
    mei_koutsuki 2015/07/16
    ほうほう( ˘ω˘)
  • 新着記事

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    新着記事
    mei_koutsuki
    mei_koutsuki 2015/06/01
    ほうほう( ˘ω˘)
  • フォーム周りで覚えておくと便利なCSS Snippets - NxWorld

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

    フォーム周りで覚えておくと便利なCSS Snippets - NxWorld
    mei_koutsuki
    mei_koutsuki 2015/03/27
    これはよいまとめ( ˘ω˘)
  • ペライチのWebページをすばやく作り始められるやつ「Rin 3.0」作った - MEMOGRAPHIX

    Rin 3.0 というのを作った。 Rin - A lean, gulp-based HTML and SASS boilerplate by sanographix僕はいわゆるペライチのWebサイトを作ることが多いんだけど、そういう制作時に使っているフレームワークというかBoilerplate的なやつです。 フレームワークといっても、BootstrapのようにCSSをモリモリ書いて汎用コンポーネントを用意しまくる、というふうにはしていない。結局各webサイトでデザインの要件が大きく異なる場合が多いので、CSS部分の記述をできるだけ少なくして、各サイト向けに柔軟にスタイルを書けるようにする方針をとっている。一方でビルドツールに求められることは割と毎回一緒なことが多いので、gulpですばやく環境構築して、スタイルは各サイトでよしなに、みたいな雰囲気。 Rinは、だいたい下記のようなことがすば

    ペライチのWebページをすばやく作り始められるやつ「Rin 3.0」作った - MEMOGRAPHIX
    mei_koutsuki
    mei_koutsuki 2015/02/19
    気になる( ˘ω˘)
  • SNSのボタンをまとめて配置する【jQuery連載08】 | HTML5でサイトをつくろう

    自身のサイトやブログを拡散させるために使用するソーシャルボタンですが、それぞれ使用するサイトからひとつづつ作成することはできますが簡単にまとめて設置ができるプラグイン「jQuery.socialbutton」を使用してソーシャルボタンを設置してみます。 今回作成したサンプル 【サンプル】ソーシャルボタンをまとめて配置する http://www.html5-memo.com/sample/jq-books/17 プラグインの導入 各種ソーシャルネットワーキングサイトの「いいね!」ボタンを導入できるプラグイン「jQuery.socialbutton」(http://itra.jp/jquery_socialbutton_plugin/)。 まずはjQuery体とjquery.socialbuttonプラグインを読み込む 挿入できるソーシャルボタン facebookいいね facebook S

    SNSのボタンをまとめて配置する【jQuery連載08】 | HTML5でサイトをつくろう
    mei_koutsuki
    mei_koutsuki 2015/02/03
    使ってみたらだいぶ楽であった( ˘ω˘)
  • スクロールに応じて画像を遅延読込させるLazy Loadプラグイン

    連載では、JavaScriptライブラリとして利用頻度の高いjQueryとそのプラグインに着目して、その利用例を紹介します。今回はWebページのスクロールに応じて画像を遅延読込させるLazy Loadプラグインを用いて、多数の画像を含むWebページで効率よく画像を読み込む方法を紹介します。 はじめに 一般に画像を含むWebページをWebブラウザで表示する場合、画像が表示されるかどうかに関わらず、すべての画像がWebサーバーからダウンロードされます。そのため、縦に長いWebページに多数の画像が配置されている場合、スクロールしなければ表示されない多くの画像を読み込むために多くのロード時間を費やすことになります。この事象は特に、端末の処理能力が相対的に低く、ネットワーク状況も不安定になりがちなスマートフォンにおいて、より深刻な問題です。 そこで記事では、Lazy Loadプラグインを用いて画

    スクロールに応じて画像を遅延読込させるLazy Loadプラグイン
  • 【ぜんぶ無料】フラットデザインで資料作成する際に使えるフリーのアイコン素材サイトたっぷり50選! | クラウド資料作成代行サービスのSKET(スケット)

    作成中の資料に使用するアイコン素材をどこから持ってくればよいかという悩みを解決しちゃいます! 厳選された50選をご用意したので、お気に入りの一品が見つかるはず!

    【ぜんぶ無料】フラットデザインで資料作成する際に使えるフリーのアイコン素材サイトたっぷり50選! | クラウド資料作成代行サービスのSKET(スケット)
  • 誰もが一度は陥る日付処理。各種プログラミング言語におけるDateTime型/TimeStamp型の変換方法のまとめ - Y's note

    日付型の変換処理 Date/Timestamp変換のまとめ - Yuta.Kikuchiの日記 10言語のプログラミング言語に対してそこそこの知識を保有している@yutakikucです。いろんなプログラミング言語を使用していると文法を覚えるのは大変ですよね。PHP書いている途中からJavaScriptの文法を誤って書き始めたり... それぞれの言語の文法の違いを事細かく覚える事は無理に近いです。今日はそんな各種言語仕様の記述で難解なDateTime/TimeStampについて紹介したいと思います。扱うのはWeb系のメジャープログラミング言語のSQL/C++/Java/JavaScript/Perl/PHP/Python/Rubyになります。Mysqlからデータを取り出した後や、WebAPIから取得したデータを表示用の日付フォーマットに変換する事があると思うのでそこで利用できる知識になるかと

    誰もが一度は陥る日付処理。各種プログラミング言語におけるDateTime型/TimeStamp型の変換方法のまとめ - Y's note
    mei_koutsuki
    mei_koutsuki 2015/01/27
    まとまってるの助かるけど、ズレててな…( ˘ω˘)
  • SNSボタンをオリジナルデザインに!設置方法&シェア数の取得方法まとめ - Design Color

    もくじ PHPSNSシェア数を取得する オリジナルSNSボタンを設置する シェア数取得〜SNSボタン設置までの流れ おまけ:cssでフキダシの作り方 仕上がりイメージ 仕上がりイメージはこんな感じです。ボタンの種類は今回は自分がサイト制作時によく設置する以下の5つ(Twitter/Facebook/Google+/はてなブックマーク/LINE)とします。 ※LINEボタンについては残念ながらシェア数の取得方法がわかりませんでしたので、LINEボタンのみ吹き出しはナシです。 ※LINEボタンはオリジナルデザインにできない決まりなので、LINEボタンのみ公式デザインです。 今回もサンプルを作ってみましたよ〜。 サンプル お世話になった記事 今回の記事は以下のサイト様にお世話になりました!ありがとうございます!特にPHPでのシェア数の取得方法は当に助かりました。もはや今回の記事はこちらのサイ

    SNSボタンをオリジナルデザインに!設置方法&シェア数の取得方法まとめ - Design Color
    mei_koutsuki
    mei_koutsuki 2015/01/24
    phpでやるならここがまとまってて分かりやすかった( ˘ω˘)
  • 全8サイト!SNSのカウント取得方法まとめ 2014年6月版

    ソーシャルシェアボタンをオリジナルデザインにしたかったり、いいね!数のデータを元にランキングシステムなどを作りたい場合に役立つ「ソーシャルカウントの取得方法」をまとめました。取得方法はサーバーサイド(PHP)、クライアントサイド(Javascript)の両パターンを取り上げています。よろしければ参考にしてみて下さい!なお、Twitterのカウントは2015年11月20日以降、取得できなくなりました。

    全8サイト!SNSのカウント取得方法まとめ 2014年6月版
    mei_koutsuki
    mei_koutsuki 2015/01/24
    まとまってるとこがあった。PHP使うのもいいなぁ( ˘ω˘)
  • ツイートボタンのデザインを独自にカスタマイズする方法 | DevelopersIO

    この記事のすぐ上をご覧いただければお分かりのように、弊社ブログのソーシャルボタンは従来のそれではなく、独自のデザインにカスタマイズされています。少ない手順でオフィシャルのソーシャルボタンを設置するのもお手軽でいいですが、もう一手間加えて独自のデザインにカスタマイズし、ページ全体の統一感を一段上に持っていくためのノウハウを知っておいて損はありません *1。 ※ 予備知識オフィシャルのツイートボタン設置方法 Twitter オフィシャルサイトの開発者向けページに詳しい手順が載っているので、それに従って進めていけば殆どコピペだけで設置することが出来ます。 Tweet Button | Twitter Developers html <a href="https://twitter.com/share" class="twitter-share-button" data-url="https://

    ツイートボタンのデザインを独自にカスタマイズする方法 | DevelopersIO
    mei_koutsuki
    mei_koutsuki 2015/01/24
    参考になりました( ˘ω˘)
  • Rhino inc.|株式会社ライノ|【WordPress】記事内の画像を自動で一覧に表示させる方法

    こんにちは。WebスタッフのYです。 このサイトはWordPressで構築しています。 そこでWordPressの便利技をご紹介します。 一覧ページにサムネイル画像があると直感的に何についての記事か分かりやすく、クリック率が上がると思います。サムネイル画像を表示する方法はいくつかあり、アイキャッチ画像で表示させる方法が一般的ですが、もっと簡単な方法があります。 記事の中で使用している最初の画像を自動的にサムネイル画像として表示させる方法です。しかもプラグイン不要です。 まずは下記コードをfunctions.phpの分かりやすい箇所(一番下等)に貼付けてください。 // thumbnail自動表示 function catch_that_image() { global $post, $posts; $first_img = ''; ob_start(); ob_end_clean()

    mei_koutsuki
    mei_koutsuki 2015/01/23
    ふむ( ˘ω˘)
  • Hello, world!ちゃん - インターネットちゃんブログ

    インターネットちゃんブログは 「インターネット」「コンピュータ」「テクノロジー」などをテーマにした ファッションやネイル、スイーツ、グッズなどをたのしんでいくブログです。 ゲストモデルの予定もあり友達のギークな女の子たちをご紹介していきます。 インターネットのアイコンやカラーをモチーフにした服やリボンやアクセサリ。 ギークなアイテムを身につけたなら、私たちはだれだってすぐに “インターネットちゃん”になれてしまうのです。 さあ、モニターの中にひきこもっていないでインターネットからでておいで。 NO INTERNET, NO LIFE. 充電たりなし 歩けよ乙女。 電波たりなし 恋せよ乙女。 当ブログ アバウトより引用 はじめまして。 インターネットちゃんブログの中の人です。 このブログのテーマは「インターネットファッション」です。 コスプレではなく、あくまでコーデのひとつとして 「インター

    Hello, world!ちゃん - インターネットちゃんブログ
    mei_koutsuki
    mei_koutsuki 2015/01/16
    可愛い(´ω`*) はてなブログもここまでカスタマイズできるんだねぇ
  • 世の中にはどんなライブラリがあって、どんなふうに動いているのかをサクッと見たい人に送る素敵アプリ - Qiita

    GitHubGoogle Group を眺めていると、実にたくさんのライブラリプロジェクトがあります。 UI に関連するものもあれば、設計を整理するのを助けてくれるものもあり、様々です。 特に、UI に関連するものは、実際に動かすとどうなるのかが気になるところ。しかし、必ずしも README にスクリーンショットがあるとは限らないのが現状です。また、スクリーンショットがあっても、操作感がわからなかったりすることもあります。 そんなあなたへ、いろいろなライブラリのサンプルを寄せ集め、実際に動く様子を手に持って触れるアプリがありますのでご紹介。 for Android: Libraries for Developers for iOS: Libraries for Developers 片っ端からライブラリを寄せ集め、デモも組み込まれているすぐれもの。ライブラリの Author やライセ

    世の中にはどんなライブラリがあって、どんなふうに動いているのかをサクッと見たい人に送る素敵アプリ - Qiita
    mei_koutsuki
    mei_koutsuki 2015/01/15
    ほうほう( ˘ω˘)
  • AUTOCODING (オートコーディング) | デザインからコーディングを自動生成

    AUTOCODINGはデザインデータを基に、HTMLを自動で生成するエンジンです。 Photoshopデザインデータをアップロードするだけで、 HTMLCSS、画像ファイルが出力されます。 SEOに最適化された美しいHTMLを出力します。 セマンティックコーディングを重視したHTMLですので、 その後の運用対応も柔軟に行うことができます。

    AUTOCODING (オートコーディング) | デザインからコーディングを自動生成
    mei_koutsuki
    mei_koutsuki 2015/01/15
    気になる。試してみようか( ˘ω˘)
  • 産後、全然仕事ができなくなってしまったクリエイターの与太話

    私は自分が手で作るものを世の中に販売して生計を立てているクリエイターである。 会社に属しているわけでもなく、クライアントから仕事をもらうわけでもないので、 作り出すものを売りださなければ一銭のお金も入らない仕事である。 約4年の妊活(不妊治療)を経て、4年前に第一子、2年前に第二子を高齢出産した。 初めての妊娠時、お腹の中でわりと順調に育ってくれたため、産む前日まで仕事をした。 活動場所を自宅にすることで、産後も働き続けることは可能だと思っていた。 もっと言えば、子供を見ながらでも仕事ができると思っていた。大馬鹿者であった。 自分が出産するまで世のアーティスト歌手等が 「妊娠している間、歌詞がまったく書けなくなった」「作風が変化した」云々とママ雑誌で語るのを「花畑脳乙」と鼻でせせら笑っていたのだが、 花畑脳どころか、産後の私の脳味噌は一のシワのなくなってツルツルの風船にでもなってしまった

    産後、全然仕事ができなくなってしまったクリエイターの与太話
    mei_koutsuki
    mei_koutsuki 2015/01/15
    あーわかる。でも、あるタイミングで、子どもからインスピレーションを受け取れるようになった私は幸福なのかもしれない( ˘ω˘)
  • WordPressのカスタム投稿タイプのアーカイブをパーマリンクで表示できるようにしてみた – Simple Colors

    WordPressのカスタム投稿タイプは、投稿などと切り分けられて便利ではあるのですが、パーマリンク利用時にカスタム投稿の一覧や年月アーカイブの表示に困ったりすることになります。 WordPressのパーマリンクというのは、アクセスされたURLをもとに、デフォルトのURLのパターンに変換し、内部処理を行っています。 カスタム投稿タイプについても、デフォルトのパーマリンクでは、?post_type=customや?post_type=custom&year=2011&monthnum=04で表示出来るので、簡単に言うと、パーマリンクのURLから、左記で示したデフォルトのURLに変換できるようにマッピングさせてあげれば良いのです。 CODE 1は、デフォルト以外の投稿タイプで、投稿タイプの一覧や、投稿タイプの年月アーカイブが表示できるようにするコードです。 /custom_post_slug/

    mei_koutsuki
    mei_koutsuki 2015/01/09
    ( ˘ω˘)
  • wordpress サイドバーにカスタム投稿の分類、月別アーカイブ、最新記事一覧を表示する方法 | WEBデザイナーのしおり

    > Wordpress > Sideberテンプレート > wordpress サイドバーにカスタム投稿の分類、月別アーカイブ、最新記事一覧を表示する方法 1.カスタム分類のターム名一覧の表示方法 <ul> <?php wp_list_categories(array('title_li' => '', 'taxonomy' => 'topicslist', 'show_count' => 0, 'depth' => 1)); ?> </ul> taxonomy’ => ‘topicslist’, // カスタム分類名 2.カスタム分類の最新記事を表示件数を指定して表示 <ul> <?php $args = array( 'post_type' => 'topics', 'taxonomy' => 'topicslist', 'posts_per_page' => 10, 'numberp

    wordpress サイドバーにカスタム投稿の分類、月別アーカイブ、最新記事一覧を表示する方法 | WEBデザイナーのしおり
    mei_koutsuki
    mei_koutsuki 2015/01/09
    ( ˘ω˘)