simplestreetのブックマーク (84)

  • これがスマートフォン向けサイトを作るときの viewport 設定3パターンだ

    スマートフォン向けの Web サイトを作るとき、viewport の設定次第で使い勝手が大幅に変わる。 最近はレスポンシブ Web デザインが流行してるけども、その大前提として viewport の設定パターンを抑えておくのは重要だろう。 この記事では、viewport の設定によって、見た目・使い勝手がどう変わるかを解説する。 パターン1: 何も考えずに HTML を書く まずは、viewport を指定せずに、単純な HTML をスマートフォンで表示してみる。 <!DOCTYPE html> <head> <meta charset="utf-8"> </head> <body> <img src="/images/logo-ja.png"> <p>色んな素材がごった煮になった様子をお椀で表現しています。 湯気が<strong>「てっく」</strong>に見えるのが隠し味になっていま

    これがスマートフォン向けサイトを作るときの viewport 設定3パターンだ
    simplestreet
    simplestreet 2015/03/06
    スマホのviewportについて
  • Navigation · Formstone

    Navigation Demo View Documentation Basic By default, Navigation will only activate itself on screens smaller than 980px. Resize your screen if the menu is not active. <h5 class="nav_handle">Menu</h5> <nav class="navigation" data-navigation-handle=".nav_handle"> <a href="#">One</a> <a href="#">Two</a> <a href="#">Three</a> </nav> $(".navigation").navigation();

  • Discover Magazine Theme | Just another WordPress site

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi adipiscing augue quis augue egestas, sed gravida diam viv...

  • .htaccessで拡張子を隠す方法 - OKWAVE

    .htaccessでRewriteRule .htaccessでパラメータ付のアドレスにRewriteRuleしたいのですが。 例えば test.phpにアクセスされた場合、test.php?id=5 としたいのですが。 現状、下記のように.htaccessに記述したのですがうまくいきません。 RewriteEngine On RewriteRule ^test.php$ /test.php?id=5 [R=301,L] また、test.phpにはパラメータ付(test.php?id=1)でアクセスされる場合もあります。 その場合には、test.php?id=1のままにしたいのですが。 どのように記述したらよろしいのでしょうか。

    .htaccessで拡張子を隠す方法 - OKWAVE
    simplestreet
    simplestreet 2015/02/14
    便利便利
  • PHPの日付の加算、減算の備忘録 - bushimichiの日記

    // 現在日付から○日の取得 echo "1日前" . date("Y/m/d", strtotime("-1 day" )); echo "1ヶ月前" . date("Y/m/d", strtotime("-1 month")); echo "1年前" . date("Y/m/d", strtotime("-1 year" )); echo "1週間前" . date("Y/m/d", strtotime("-1 week" )); // 指定日付から○日の取得 echo "1日前" . date("Y/m/d", strtotime("2007/12/20 -1 day" )); echo "1ヶ月前" . date("Y/m/d", strtotime("2007/12/20 -1 month")); echo "1年前" . date("Y/m/d", strtotime("200

    PHPの日付の加算、減算の備忘録 - bushimichiの日記
    simplestreet
    simplestreet 2015/02/14
    日付追加
  • Schooのデザイナーに聞いた、Webサイト制作に使えるフリーアイコン5選 - 2015/02/06 [Schoo]

    Webサイトやアプリの制作の際に欠かせないものの1つに”アイコン”があります。しかし、 「自分で作るのは大変…。」 「お金をかけたくない!」 「プロは、どうしてるのかな…?」 こんな悩みを抱えている人も多いはず。そこで今回はSchooのデザインを手がけているデザイナーが実際に使っているおすすめのフリーアイコンサイトを5つご紹介します♪ ■目次 1.Font Awesome 2.ICON FINDER 3.flaticon 4.ヒューマンピクトグラム2.0 5.IcoMoon 1.Font Awesome スクーのサイト内のいたるところで使用している、Webフォントのアイコンサイト。 こちらのサイトのWebフォントのアイコンを使えば、画像を作らなくてもサイトにワンポイントで配置できます。 又フォントとして利用できるため、サイズや色をCSSで変更することが可能です。 2.ICON FINDER

    Schooのデザイナーに聞いた、Webサイト制作に使えるフリーアイコン5選 - 2015/02/06 [Schoo]
    simplestreet
    simplestreet 2015/02/11
    助かる助かる。
  • human pictogram 2.0 (無料人物 ピクトグラム素材 2.0)

    ヒューマンピクトグラム2.0は、非常口のあの人のピクトグラムをTopeconHeroesダーヤマの好みで拡張、ストックしていくページです。 このサイトにストックしたピクトグラムは、WEB制作や会議の資料、企画書などのデザイン素材として無料で利用可能です。 ただし素材そのものの再配布、販売はNGっす。なお2.0だからって拡張元のピクトグラムに比べ優れている訳ではありません。 犬の散歩のピクトグラムその3 飛び膝蹴り 社長、部長 ショートカット 手荷物検査 略奪婚 結婚式のピクトグラム 神父、牧師 ちゃぶ台返し 2 水球 ピクトグラム シンデレラ サムライ 3 サンタクロース 2 サンタクロース バーテンダーのピクトグラム2 バーテンダー 銅鑼 銅鑼をドーン 虫取り少年 少年時代 やり投げ 事をするピクトさん 演説するピクトさん エスカレーター 下校する子供

    simplestreet
    simplestreet 2015/02/11
    ピクトグラム2
  • ある種の質問にはお答えいたしかねます - 村上さんのところ/村上春樹 期間限定公式サイト

    期間限定サイト「村上さんのところ」をご覧いただきまして、誠にありがとうございます。 連日たくさんのアクセスをいただきました当サイトですが、2015年5月13日をもって、公開を終了させていただきました。当主の村上春樹さんは、しばしの休憩をとったあと、来の小説のお仕事に戻っていらっしゃいます(当主からの最後の挨拶はこちら)。 1月15日のオープン以来、119日間という限られた期間でしたが、読者のみなさまと村上さんとの交流はたいへん面白く、そして意義深いものとなりました。3万7465通のメールをお寄せいただいたみなさん、そして、最後までご愛読いただいたみなさんに、あらためて感謝を申し上げます。 なお、当サイト上での質問者のみなさまと村上さんとのやりとりは、編集の上、新潮社より出版されます。くわしくはこちらをご覧ください。 新潮社 チーム縁の下

    ある種の質問にはお答えいたしかねます - 村上さんのところ/村上春樹 期間限定公式サイト
    simplestreet
    simplestreet 2015/02/11
    こういうのワリに好きっす。
  • これを無断使用しちゃっていいの?ブログのアイキャッチ探しがはかどる高クオリティーCC0写真サイトまとめ

    これを無断使用しちゃっていいの?ブログのアイキャッチ探しがはかどる高クオリティーCC0写真サイトまとめ
    simplestreet
    simplestreet 2015/02/10
    いいねいいねいいね。
  • webディレクターだけど、初心者に役立つサイト教える : ライフハックちゃんねる弐式

    2015年02月07日 webディレクターだけど、初心者に役立つサイト教える Tweet 35コメント |2015年02月07日 10:45|サイトまとめ|Web・テクノロジー|Editタグ :web制作 1 :以下、\(^o^)/でVIPがお送りします:2015/02/06(金) 17:41:24.70 ID:flJZIImcH.net 最近クソみたいなデザインとグッチャグチャのソースコード書いてる ミーハー丸出しアフィサイトが増えてきて陶しいから、 これからサイト作る初心者用にサイトを紹介していく これ以上俺のウェブサーフィンライフを邪魔すんじゃねえぞ 当ブログサイトはアフィリエイト広告、バナー広告を利用しています。 2 :以下、\(^o^)/でVIPがお送りします:2015/02/06(金) 17:42:31.08 ID:flJZIImcH.net まずはドットインストール htt

    webディレクターだけど、初心者に役立つサイト教える : ライフハックちゃんねる弐式
    simplestreet
    simplestreet 2015/02/07
    これはいいまとめ
  • Accordion | jQuery UI 1.10 日本語リファレンス | js STUDIO

    jQuery UIのアコーディオンを使用するにはまず下記のような 見出しとコンテンツのペアのコードを用意します。 <div id="accordion"> <h3>最初の見出し</h3> <div>最初のコンテンツ</div> <h3>2番目の見出し</h3> <div>2番目のコンテンツ</div> </div> <script> $( "#accordion" ).accordion(); </script> アコーディオンは、任意のマークアップをサポートしていますが、 各コンテンツパネルは常にその関連ヘッダーの次の兄弟要素でなければなりません。 カスタムマークアップ構造を使用する方法については、オプションheaderの項目を参照してください。 キーボード操作のサポートについて アコーディオンの見出しにフォーカスがある場合、下記のキーコマンドが利用可能なります。 [↑]/[←] 一つ前

    simplestreet
    simplestreet 2015/02/04
    めおめおめお
  • http://wdr.watanabehiroki.net/2013/02/15/jquery-menu/

  • 就活失敗して良かった

    今年で35歳。超就職氷河期で、就活を失敗してから 10年が経った。新卒当時、出したエントリーシートは50社以上、 面接へ行ったのは30社以上。しかし俺に内定をくれる 企業は1社もなかった。 落ちまくった当時は毎日、死ぬことばかり考えていた。 でも、あの時、死ななくてよかった。 そして、就職活動で失敗して良かった。 就活失敗から得られた事が、今の自分を支えてると 言っても過言ではない。参考になるかは解らないが、 決して就活失敗はデメリットじゃないという事を 書いてみたいと思う。 ■とにかく手に職をつけるという意識ができた。 自分はコミュニケーションが苦手な部類の人間だ。 面接で上手いことやって内定を決めていく友人を横目に 落ち続けた俺は、とにかく手に職を持たないと、 どこも採用してくれないと考えるようになった。 そしてこの時、気付けたことは非常に正しかった。 「自分の技術」と「仕事の結果」だ

    就活失敗して良かった
    simplestreet
    simplestreet 2015/02/02
    同感。自分の持っている技術で金をもらうという意識を若いうちにしたほうがよいと思う。
  • ゆめいろデザイン|ブランドマネージャー・Web/UX/UIデザイナー・デザインコンサルタント ヒガシナオヤ

    「Photoshopしか使えない」Webデザイナーとは、「お絵かき」「見た目」だけにこだわるデザイナーのことです。ビジュアルデザイン以外の付加価値がないデザイナーは今後は生き残ることは難しいです。 今ではWebサイトを作ることが当たり前になりました。 それどころかスマートフォンの普及でレスポンシブWebデザインで作るサイトも当たり前になっています。また、ASPでWebサイトを作るサービスも増えています。JIMDOなどが代表的な例でしょう。 普通に「Photoshopしか使えない」だけのデザイナーは、もう生き残れるのは難しいでしょう。

    ゆめいろデザイン|ブランドマネージャー・Web/UX/UIデザイナー・デザインコンサルタント ヒガシナオヤ
  • 商用フリーPOPフォント10選

    This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

    商用フリーPOPフォント10選
  • レスポンシブWebデザインで作られた10の美しすぎるサイト |SEO Japan by アイオイクスSEO Japan|アイオイクスのSEO・CV改善・Webサイト集客情報ブログ

    PCにモバイル、スマートフォンにタブレット、そして今後はデジタルTVまでユーザーがデジタルコンテンツに多種多様なデバイスでアクセスし、消費する時代が格化している最中。デバイス毎にウェブサイトをデザインしていてはキリがないとばかりに、最近注目されているのが「レスポンシブWebデザイン」という画面サイズやOSにデザインを柔軟に対応して表示させる手法。今回は、そんなレスポンシブWebデザインを実践しているサイトからThe Next Webが厳選した10の素敵なサイトを紹介します。 — SEO Japan 最近、皆が異なる方法でコンテンツを消費している。私の母はネットブックを持っているし、友人は27インチのiMacを持っていて、ガールフレンドと私はスマートフォンを持ち、彼女の母はiPadを持っている。 あなたのコンテンツはこれまでになく多くのデバイスとブラウザで閲覧されており、デザイナーはそのこ

    レスポンシブWebデザインで作られた10の美しすぎるサイト |SEO Japan by アイオイクスSEO Japan|アイオイクスのSEO・CV改善・Webサイト集客情報ブログ
  • 新着記事

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

    新着記事
    simplestreet
    simplestreet 2015/01/15
    配色定番
  • GIF作成 - GIF画像(GIFアニメ)を無料で作成できるサイト!

    GIF画像作成(GIFアニメ) 「バナー工房」では、オンライン上で簡単に無料でGIFを作成できます。 作り方は簡単!最大100枚までの高画質なGIFアニメを作成することができます。さらに、点滅の速さや繰り返しの設定も自由自在に変えられます。 GIFアニメ画像とは、「複数の静止画像」を1つの画像に重ね合わせたアニメーション動画(GIF形式に変換した画像)の名称です。 動きががあるので、静止画像よりも目を引き印象に残りやすいため、ウェブサイトやSNSなど、さまざまな場面で使用されています。 以下①、②、③の順番に実行してください。 ①まずはじめに、「オプション設定」と「画像の切り取り設定」を選択。 ②次に、静止画像を「最低でも2枚以上」選んだ後、画面上の「GIFアニメを作る」ボタンをクリック。 ③最後に、「保存」ボタンをクリック。 ※もし「点滅の間隔」や「ループ」の設定を変えたい場合は、GIF

    GIF作成 - GIF画像(GIFアニメ)を無料で作成できるサイト!
    simplestreet
    simplestreet 2015/01/15
    便利便利
  • どのようにして僕はプログラマになったのか思い出してみた

    一番最初に僕がプログラミングをしてみたいと思ったのはコンピュータを手にする前からだったと思う。 あるとき小学校高学年の頃に読んでいた子供向けの雑誌の巻末に、巡回セールスマン問題のような懸賞問題が載っていて、最高得点を出した読者に景品が当たるなどというものをみて、それを手でひたすら試行していた。それを見た親が「これはコンピュータでバーッと計算するんじゃないか」みたいなことを言った。そのとき、そうか、こういうのはコンピュータを使えば手でやらなくていいんだ、機械的にパターンを試していくだけなんだからな、と思ったのだった。 その懸賞には相当時間を費やしたのだけど、結局景品はもらえなかった。当然だれかがプログラムを書いて、僕の手で求めた解よりよい解を一瞬で見つけてしまったんだろう(しかし僕は今でも、人間がやるかコンピュータでやるか微妙なくらいの問題をひたすら手でやるのはなぜかかなり好きではある)。

    simplestreet
    simplestreet 2015/01/14
    めもめもめお
  • 海外のハイクオリティなフリー写真素材サイト11選 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    Webサイト制作時には、写真素材サイトが必須ですよね。クオリティの高いものを選べば、それだけでサイト全体の印象もぐっとよくなります。 日は、Webサイト制作時に使える高クオリティな海外のフリー写真素材サイトを紹介します。 頑張って他の記事とかぶらないものを選出してみたつもりです。(かぶっていたらゴメンナサイ。) どれもオシャレなので、Webサイト制作時だけでなく、ダミー写真や写真を撮る際の参考などにもお使いください。 無料で商用利用可能のものを集めていますが、僕の翻訳能力が怪しいので、ライセンスはご自分でお確かめになってからお使いください。それでは、どうぞ。 ※編集部注:この記事は2014年9月に公開されたものを、最新情報を元に再構成・編集しています。 写真編 New Old Stock https://nos.twnsnd.co/ サイト名のとおり、クラシックな作品を揃えており、単純に

    海外のハイクオリティなフリー写真素材サイト11選 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作