moty0815のブックマーク (1,305)

  • 宣言ブロックのCSS設計 - kojika17

    語で「CSS設計」を検索すると、記事やつぶやきなどでセレクタの命名規則に関する話題が多いです。 CSSを設計する上で、命名規則は重要な要素でしょう。 簡単なセレクタ名だと他のスタイルと重複する可能性もあります。他のスタイルと重複しないようにセレクタの子孫数を増やしてしまうと、今度はスタイルの取り回しが悪くなります。 またデザインをコンポーネントに分ける粒度について紹介されていますが、命名規則の分け方のように紹介されているよう感じます。 論理的に構造をわけて命名していくため、覚えやすく、伝えやすさもあわさって、現在の「CSS設計 = 命名規則」のような構図ができあがったと感じています。 CSS設計は命名規則だけか 命名規則CSS設計において、重要な要素です。 しかしCSS命名規則させ気を付ければ良い、というものではありません。 私は、すでにあるサイトの一部のコンテンツの作成やすでに用

    宣言ブロックのCSS設計 - kojika17
    moty0815
    moty0815 2017/07/20
  • Simplicity

    WordPressテーマ「Simplicity(シンプリシティー)」を作成しました。 Simplicityには主に、以下の7つの特徴があります。 シンプル 内部SEO施策済み 拡散のための仕掛けが施されている 端末に合わせた4つのレスポンシブスタイル 手軽に収益化 ブログの主役はあくまで文 カスタマイズがしやすい 以下で詳しく説明します。 Simplicityは、とにかくシンプルなWordpressテーマを作ろうという考えの下作成しました。 テーマの名前「Simplicity」には以下の意味があります。 単純 簡単 容易 簡素 質素 飾り気のない よく言えばシンプル、悪く言えば地味なテーマです。 余分な飾り気をすべて取り除き、ユーザーが自ら自由なスタイルで後からカスタマイズしやすい土台となるように考えて作りました。 もちろんそのままでも十分使用できます。 検索エンジンへの最適化(SEO

    Simplicity
    moty0815
    moty0815 2017/07/20
  • 【保存版】Webエンジニアが見るべきテックブログ一覧

    皆さんはどのような方法で最新の技術や、コードのTipsを収集していますか? はてなブックマークやTwitter, GitHubなど様々あると思います。 私はテックブログを使った情報収集をしています。今回はエンジニアが見るべきおすすめのテックブログをいっきにご紹介します。 テックブログとは? ご存知の方も多いと思いますが、テックブログとはWEBサービスゲーム等を提供している企業が、自社で使っている技術や開発手法を紹介するブログです。デベロッパーブログとも呼ばれます。 エンジニアが持ち回りで書くことが多いので、そこで働いている人のこともわかっちゃいます。 普段使っているサービスがどのような言語でできていて、どのようなフレームワークを使っているか、どんなツールを利用して開発しているのかが載っているのでとても刺激的な内容ばかりです。 転職、新卒の会社選びにも役立つ!? 転職する際に気になるどんな

    【保存版】Webエンジニアが見るべきテックブログ一覧
    moty0815
    moty0815 2017/07/19
  • http://www.kurasinositen.com/wordpress-hummingbird/

    http://www.kurasinositen.com/wordpress-hummingbird/
    moty0815
    moty0815 2017/07/18
  • WordPressを高速化するための.htaccess設定のベストプラクティス

    httpsにリダイレクト GoogleはSSLの導入を推奨しています。サイトのhttps化は検索順位にも影響を与えます。WordPressを使った個人ブログでも、検索順位を重視する場合はhttps化を検討しましょう。 httpsにリダイレクトする場合は、.htaccessに以下の記述を追加します。場所は、WordPress設定の# BEGIN WordPressよりも上に記載します。www.example.comの部分は、サイトのドメインに置き換えてください。 # https にリダイレクト <IfModule mod_rewrite.c> RewriteEngine on RewriteCond %{HTTPS} off RewriteRule ^(.*)$ https://www.example.com/$1 [R=301,QSA,L] </IfModule> MIME Typeの

    WordPressを高速化するための.htaccess設定のベストプラクティス
    moty0815
    moty0815 2017/07/18
  • 403 Forbidden

    \閉鎖予定のサイトも売れるかも?/ アクセスがないサイトもコンテンツ価値で売れる場合も… ドメインの有効期限を更新してサイト売却にトライしてみましょう

    403 Forbidden
    moty0815
    moty0815 2017/07/09
  • Site is undergoing maintenance

    Site will be available soon. Thank you for your patience!

    Site is undergoing maintenance
    moty0815
    moty0815 2017/07/09
  • 【1食61円】塩麹deサラダチキンの作り方~レンジで超簡単!しっとり冷凍OK手作りレシピ~ - 50kgダイエットした港区芝浦IT社長ブログ

    塩麹×鶏胸肉→レンジ150秒=日一簡単サラダチキン サラダチキン、べたいけど痩せたい、タンパク質を摂取したいけど脂肪や糖分は少なくしたい、ダイエット中にも筋トレ中にも嬉しいコスパ最強の肉料理として大人気ですよね。そのままでもサラダでも、メインディッシュにもなるバリエーションの豊富さも魅力の一つ。今回は「塩麹」と「鶏胸肉」だけでレンジで簡単に作れるしっとり柔らかジューシーな美味しく安価なサラダチキンの作り方をご紹介します。 安い!1個61円で高タンパク・低脂質・低糖質の手作りダイエット。 簡単!塩麹を鶏胸肉に揉み込んでレンジで加熱するだけで簡単。ズボラーにも嬉しい1つの容器で下味から調理、保存までOKで洗い物最小。 旨い!塩麹パワーで驚くほどしっとり柔らかジューシーなサラダチキンに仕上がります。 それでは簡単な作り方はこちら。 美味しくべて健康的に痩せるダイエットを実践中。 50kg

    【1食61円】塩麹deサラダチキンの作り方~レンジで超簡単!しっとり冷凍OK手作りレシピ~ - 50kgダイエットした港区芝浦IT社長ブログ
    moty0815
    moty0815 2017/07/07
  • 個人的な Keynote ベストプラクティス 2017 - kakakakakku blog

    最近「どうやってスライドを作ってるの?」と聞かれる機会も増えてきたので,普段 Keynote を使っていて,特に意識しているポイントをベストプラクティスとしてまとめた.参考になれば! Keynote Best Practice コーポレート・ロゴ モダンな「コーポレート・ロゴ」フォント無料ダウロード | 転職サイト情報のLOGOTYPE.JP Unsplash 背景画像を選ぶときは Unsplash を使っている.高解像度でクオリティも高く,様々なバリエーションの背景画像をダウンロードすることができて便利! unsplash.com 脱 Azusa Azusa当に素晴らしく,僕も今まで何度も使わせてもらった.今もまだ勉強会に参加すると少なくとも1人は Azusa を使っているような気がする.ただし,個人的にはどの資料も似てしまうという点が気になっていて,Azusa の次のステップとし

    個人的な Keynote ベストプラクティス 2017 - kakakakakku blog
    moty0815
    moty0815 2017/07/04
  • 【Bootstrap製】90ページ超えの無料HTML5/CSS3テンプレート素材 Titan

    ウェブサイトやアプリ制作に必要なスタイルがあらかじめ定義された、人気CSSフレームワーク Bootstrap。しかし、デザインが他のサイトとかぶってしまうとお悩みの方も多いのではないでしょうか。 今回は、Web制作をより手軽に行うことができる、Bootstrap対応の無料HTML5/CSS3テンプレート素材 Titan をご紹介します。90ページにおよぶ大量のサンプルHTMLページが用意されており、あらゆるプロジェクトに活躍してくれるフリー素材となっています。 Bootstrap を拡張パワーアップ!参考にしたい50個の無料プラグイン、コンポーネントまとめ 無料HTML/CSSテンプレート Titan について Titan はHTML5/CSS3で制作されたBootstrap対応テンプレートで、過去5年間のウェブデザインの傾向を分析して作成されたスタイリッシュな素材です。 じっくりと検討さ

    【Bootstrap製】90ページ超えの無料HTML5/CSS3テンプレート素材 Titan
    moty0815
    moty0815 2017/07/04
  • クリーンでシンプルなHTMLテンプレート「Floper HTML Template」

    TOP  >  Tool , WebDesign  >  クリーンでシンプルなHTMLテンプレート「Floper HTML Template」 スッキリと綺麗に表現されているサイトは見やすく、使い勝手も良いもの。そんなサイトを手軽に作成するためにおすすめの、クリーンでシンプルなHTMLテンプレート「Floper HTML Template」を今回は紹介したいと思います。 HTMLテンプレートですので自分好みにアレンジも可能。ベーシックなデザインで、いろいろなタイプのサイト設計に活用できそうです。 詳しくは以下 カテゴリーごとに異なったレイアウトで構成されており、それぞれに合った動的表現も組み込まれています。もちろんこのまま使用しても素敵なサイトが出来上がりますが、色やレイアウトを変更して、もともとのテンプレートを活かしながらアレンジを加えれば、自分のオリジナルが完成。何より制作時間の短縮に

    クリーンでシンプルなHTMLテンプレート「Floper HTML Template」
    moty0815
    moty0815 2017/07/03
  • 【2017年】wordpressのテーマおすすめ最新7選!! - Build up|コンテンツマーケティング担当者向けメディア

    「最新のwordpressテーマを使ってかっこいいサイトを作りたいな」もしそう思ったことがあるなら、2017年最新のテーマを使うことをおすすめします。「少し古いテンプレートでもいいやと」思ってしまうと、記事を書いた後にそのカッコ悪さに愕然としてしまい結局最新のテーマを探すなんてことに…。 最新のwordpressテーマを使えば、あなたが思っているようなかっこいいサイトを簡単に作れますよ。 もし、新しくブログやサイトを立ち上げようとしているのであれば、デザインと使いやすさにはとことんこだわっておきたいはずです。その一方、wordpressのテーマは数十万とあり、どのテーマを使えばいいか分からないものです。 そこで、今回は2017年の最新wordpressテーマを【無料】と【有料】に分けて7テーマご紹介します。初めてブログを立ち上げる人も、サイト制作の上級者の方にもおすすめです。 無料word

    【2017年】wordpressのテーマおすすめ最新7選!! - Build up|コンテンツマーケティング担当者向けメディア
    moty0815
    moty0815 2017/07/01
  • Postfixからの送信を全てSES経由に変更する - Qiita

    はじめに ▼メリット EC2からメールを送信するとき、AWSの送信制限(ポートチェック)を気にせずにメールの送信が出来ます。 mb_send_mailなどの関数を使用したメール送信部分のソースコードを変更せずにメールの送信が可能です。 シェルスクリプトなどでメールを送信するとき、送信制限を気にしなくていいので楽です。 ▼デメリット お金がかかります。(すごい安いけど) 構築 ▼AWSでの準備 Amazon SES SMTP 認証情報を取得 SES > SMTP Settings から [Create My SMTP Credentials] をクリック。 IAMユーザー名を決めて作成ボタンをクリック。 [ユーザーの SMTP セキュリティ認証情報を表示]をクリックすると SMTP ユーザー名 SMTP パスワード が表示されるので、保存しておく。 送信元メールアドレスの認証する 「Eメール

    Postfixからの送信を全てSES経由に変更する - Qiita
    moty0815
    moty0815 2017/07/01
  • エンジニア向けの社内情報共有ツールの紹介

    FiNCのエンジニアの人数も50人を超え、チームを横断した情報共有の機運が高まっています。 もともと社内には情報共有ツールとしてConfluenceやGitHub Wikiなどがありましたが、前者はMarkdownなどのエンジニアがドキュメントを書きやすい機能が不足しており、後者は情報の検索性に難がありました。 エンジニアのコミュニケーションを活性化させるため、カジュアルに記事を投稿できて誰でも見ることができる、新しい情報共有ツールを導入をすることにしました。 今回は候補として検討した際に、以下の要件を満たしていた情報共有ツールを紹介します。 Markdownを使ってプレーンテキストで記述できる記事の更新履歴のdiffを見ることができるフィードで記事の一覧を見ることができるわかりやすい検索機能コメント欄でのやりとりができるWebhook(チャットツール連携)UML記法やスライドの埋め込みの

    エンジニア向けの社内情報共有ツールの紹介
    moty0815
    moty0815 2017/07/01
  • CSSの20のコツを大紹介!Webサイトデザインの効率を大きく高める裏技の数々

    フロント・エンドの開発はセレクター選択と最小コードによる迅速なローディングとレンダリングにおいて、ますます効率性に特化しています。 LessやSCSSといったプレ・プロセッサは仕事をする上で役立ちますが、自然なやり方で最小かつ手早くCSSを記述する方法は数多くあります。このガイドは20ProCSSをカバーしており、レイアウト全体でスタイルの流れを標準化し、効率的なだけでなく多くの共通した問題も解決できる個人のフレームワークを構築するのに役立ちます。 1. CSSリセットを使用する 「normalize.css」が長年そうであったように、CSSはライブラリーをリセットし、ブラウザを通してより長い一貫性を確実にするためにあなたのサイトのスタイルにクリーンな状態を提供しました。プロジェクトの大部分はこれらのライブラリーが含むルールの全てを実際に必要とするわけでなく、ブラウザのデフォルト・ボックス

    CSSの20のコツを大紹介!Webサイトデザインの効率を大きく高める裏技の数々
    moty0815
    moty0815 2017/06/16
  • CSSで作る!吹き出しデザインのサンプル19選

    今回は、画像を使わずにHTMLCSSだけで作るで吹き出しのデザインサンプルを紹介します。シンプルなものから、円形、会話形式、LINE風のものまで一挙にまとめました。HTMLCSSはコピペして使うことができます。 レスポンシブ対応 以下で紹介する吹き出しデザインは(円形のものを除き)、文字が右端まで達すると、次の行へ折り返すようなレスポンシブ対応になっています。 使い方(初心者向け) CSSが反映されないときはこちら シンプルな四角い吹き出し4つ 最もシンプルな形です。三角形の位置を上下左右に配置したサンプルをそれぞれ紹介します。コードを見てもらうと「#e9edff」と書かれた部分が2カ所あると思いますが、これが背景色を指定するコードです。お好みで変えて頂ければと思います。 ちなみに下から伸びる三角形は疑似要素(before)で表現しています。興味のある方は下の記事に目を通してみてくださ

    CSSで作る!吹き出しデザインのサンプル19選
    moty0815
    moty0815 2017/06/16
  • CSSボタンのコレクション8選【ユーザに行動を促す!デザインの参考に】

    ボタンは、オンラインにおいてユーザーの行動を促す大切な要素です。ショッピングカートに商品を追加したり、決定を確認したり、フォームを送信したりする時には、必ずボタンを使用します。そのため、デザイナーはユーザーにとってわかりやすいボタンを作らなければなりません。 今回は美しいボタン作りに役立つ、CSSのボタンコレクションとライブラリを紹介します。 1.bttn.css bttn.cssは明るいスタイルのボタンを集めたコレクションで、様々な形状、大きさ、色から選べます。全てのスタイルはシンプルなクラス名で呼び出すことが可能です。CSSファイルはたった4KBと非常に軽量です。 2.Buttons シンプルな名前ですが、20を超える豊富なスタイルから好みのものを選ぶことができます。ガラス風のDeltaや明るく元気なTheta、ミニマルなMu、キーボードのような見た目のPhiなど個性的なデザインが揃っ

    CSSボタンのコレクション8選【ユーザに行動を促す!デザインの参考に】
    moty0815
    moty0815 2017/06/16
  • 年間120冊読書する『スゴ本』中の人が選ぶ「10年前の自分に読ませたい」珠玉の6冊- それどこ

    「わたしが知らないスゴは、きっとあなたが読んでいる」の中の人、Dainと申します。古今東西のスゴ(凄い)を探しまくり読みまくってます。今回は、過去読んだの中でも「これ、もっと早く読みたかった!」というスゴをご紹介しよう。 人生を何十年もやっていると、さまざまなハードルに出くわすことになる。それは、人間関係のトラブルだったり、仕事結婚生活に立ちはだかる問題だったりする。解決するために、それなりの準備が必要で、時間がかかり、そもそも全貌を捉えるのにも一苦労するやつ。 人生が用意するハードルを越えたり潜ったりするため、先人の知恵を借りるべく、さまざまなを読んできた。たいていは、試行錯誤と苦労の連続でしのいで、ずっと後になって、知りたかった一冊にたどりつく。これを最初に読んでおけば、あんなに苦労しなくても済んだのに、もっと上手く対応できたのに! そんな、「あのときの私に読ませたい

    年間120冊読書する『スゴ本』中の人が選ぶ「10年前の自分に読ませたい」珠玉の6冊- それどこ
    moty0815
    moty0815 2017/06/15
  • スマホ対応サイトもアプリも簡単に作れる!オススメCMS比較7選|ferret [フェレット]

    ホームページやブログの作成、既存のWebサイトを再構築するときに役に立つのがCMS(コンテンツ・マネジメント・システム)です。デジタルマーケティングが主流になりつつある現代において、さまざまなCMSが誕生しています。 最近ではMA(マーケティングオートメーション)に機能の1つとして組み込まれていることも珍しくなく、こうした背景からユーザーからのニーズ(導入決断時の優先度)の高さを改めて実感させられます。一方で、数多くのサービスが乱立し、正直、どれを選べばよいのかわからない、という方も多いのではないでしょうか。 そこで今回は、CMSを選定する際に押さえるべきポイントと、おすすめのCMSを紹介します。 ■ ferretおすすめのCMS・サイト制作ツール一覧を見る 目次 CMSとは? CMSを企業が導入するメリット Webサイトのデザインを簡単に管理できる SEO対策につながる アカウントの権限

    スマホ対応サイトもアプリも簡単に作れる!オススメCMS比較7選|ferret [フェレット]
    moty0815
    moty0815 2017/06/11
  • 【2019年版】これは便利!おすすめのChrome拡張機能32選

    Google Chrome拡張機能をひたすら試して、おすすめのものを32個厳選しました。目的に応じて、使えそうなものを探して頂ければと思います。 最後のセクションでは、ブログなどでよく取り上げられているものの「これはいらないんじゃないか」という拡張機能をまとめています。参考になれば幸いです。

    【2019年版】これは便利!おすすめのChrome拡張機能32選
    moty0815
    moty0815 2017/06/11