WEB APIの使い方とは？挑戦したらすごく楽しい！ : 僕の私の備忘録
11月26 WEB APIの使い方とは？挑戦したらすごく楽しい！ 2011 カテゴリ:サイト制作・備忘録単なる日記 最近はWEB APIに挑戦していました。夢中になっていたので、既存サイトはほっときがちです。でもWEB APIはとっても楽しいです。WEB APIについては難しい説明が多いので、これから使ってみたいな、という人向けに。 APIで何が出来るのか？と会わせて、APIを使う際の具体的な流れについて簡単に説明しておきます。 WEB APIとは？ WEB APIの具体例 WEB APIの利用を開始するにはどうすればいいの？ WEB APIの使い方、大まかな流れは？ プログラミング言語が必要。初心者がWEB API は難しい？ 初心者向けのWEB APIは？ WEB APIはどこで動かすの？ブログで動く？ WEB APIの難関は、英語。 データを取得したら、PHPその他で頑張る WEB
知ってると便利なCSSのテクニックのまとめ -CSS Protips
リスト要素で実装したナビゲーションの右端のボーダーを取り除くシンプルな方法、flexboxで実装したカラム間の溝の最後の溝を取り除く方法、天地の中央に配置など、知ってると便利なCSSのテクニックを紹介します。 CSS Protips -GitHub CSS Protipsのバージョンアップ版の紹介記事はこちら。 CSSでやりたかったことが数行のコードで実装できるスタイルシートの小技のまとめ -CSS Protips CSS ProtipsのライセンスはMIT Licenseで、個人でも商用でも無料で利用できます。 下記のスタイルシートの対応ブラウザはChrome, Firefox, Safari, Edge, IE11です。 リスト要素の最後だけボーダーを適用・削除 body要素に「line-height」を加える 天地の中央に配置 ネガティブなnth-childを使用してアイテムを選択
PHPメモ : file_get_contentsの代替にcURLを使う - Mach3.laBlog
この記事は賞味期限切れです。（更新から1年が経過しています） PHPで外部のリソースを取得するのに大変便利なfile_get_contents関数ですが、 cURLの環境があるなら利用したほうがパフォーマンスがいいぞというお話。 パフォーマンスの差 具体的にどれくらいパフォーマンスが変わるのかというと… モバイル回線のノートでYahoo!のトップページを取得してざっくり計測したところ、 file_get_contents : 4秒前後 cURL : 2秒前後 概ねこんな感じとなりました。 勿論時間帯や回線など様々な要因にもよりますが、 ちょっと無視出来ない数字ですね。 簡単な使い方 cf) PHP: cURL – Manual curl_init()で初期化 curl_setopt()でオプションを設定して curl_exec()で実行 curl_close()で終了 というのが一連の流れ
アップロードした写真（画像）が回転して表示されるのを直す方法 - Qiita
iPhoneからWebでHTMLのフォームから写真をアップロードしてもらったときなど、画像が回転して表示されてしまう場合があるようです。原因はExifのOrientationの値が「1」以外になっていること。 画像の向きの情報がExifに埋め込まれているけれど、ファイル自体は回転していない（＝撮影した向きになっていない）ために表示がおかしくなるのです。 ブラウザーの仕様によりますが、ExifのOrientationの値を無視して、ファイルを表示しようとすると撮影した向きとは合わない表示になってしまうことになります。 解決するには、アップロードされたときにExifのOrientationを見て、サーバー側で画像を回転させてしまうのがオススメ。回転して、ExifのOrientationの値を正しい向きに補正します。 以下、PHPのimagick拡張を使った場合の例。 <?php $imagic
[CSS]画像を使わずに、スタイルシートでぎざぎざの線をかくテクニック
画像を使わずに、ノコギリの歯のようなぎざぎざの線をスタイルシートでかくテクニックを紹介します。 下記は、p要素一つだけです。 実装は、こんな感じです。 HTML HTMLはpでもdivでも適当に。 <p>塩レモン</p> CSS ぎざぎざの線はlinear-gradientでかきます。 ぎざぎざのサイズは、4pxを4箇所、それを倍にした8pxを2箇所、変更してください。 p{ padding:1em; background: linear-gradient(-135deg, #4885ff 4px, transparent 0) 0 4px, linear-gradient(135deg, #4885ff 4px, #fff 0) 0 4px; background-color: #4885ff; background-position: left bottom !important; b
作業効率化！Dreamweaverのオススメ拡張機能まとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。デザイナーのハルエです。 Dreamweaverの数ある機能を十分に活用できてる方ってどのくらいいるのでしょうか？ 私の場合、これまで最低限の機能しか使ってこず、操作上でわずらわしく感じることでも我慢してたんです。で、そのわずらわしさも苦痛に感じなくなってきて、いつの間にか慣れちゃってました。いけない子ですね。 そこで今日は以前の私みたいな方のために、作業効率を良くするDreamweaverの便利な拡張機能やおすすめ設定術を紹介させていただきます。 閉じタグコメントを自動挿入：End_comment.mxp 閉じタグコメントはソースの構造をチェックしたりする時に便利なんですが、その都度書いていくのって手間ですよね。 この拡張機能は閉じタグコメントを自動で挿入してくれます。もちろんIDとclassもちゃんと認識してくれます。 コメントを生成して挿入するDreamweaver用の拡
ASCII.jp：Facebookページの作り方、教えます｜今日からできるFacebookファンページ制作＆運用ガイド
ローソン、無印良品、リクルート――世界6億人ものユーザーを抱える巨大SNS「Facebook」の日本での本格的なブレイクを前に、ファンページを開設する企業が相次いでいます。しかし、国内でのFacebookの企業活用はまだ始まったばかりで、実際にどのようにしてFacebookページ（ファンページ）を作り、運用したらよいのか？ 多くの企業が手探りの段階です。 本連載では、Facebookページの作成を請け負うWeb制作会社「TAM」の加藤 洋氏が、Facebookページの開設からカスタマイズ、ファンを獲得する方法まで、Facebook活用の具体的なノウハウをシェアします。（編集部） なぜいまFacebookなのか？ 私が勤務するTAMでは、Facebookをはじめとするソーシャルメディアの活用を企業へ積極的に提案しています。お話する中で必ず出るのが、「Facebookが他のSNSと何が違うのか
[CSS]画像置換「-9999px」のパフォーマンスを改善した新しいテクニック
テキストで実装した見出しなどを画像に置換するテクニックで「-9999px」が有名ですが、そのパフォーマンスを改善するテクニックを紹介します。 Replacing the -9999px hack (new image replacement) [ad#ad-2] 画像置換：-9999px 改善したテクニック 画像置換：-9999px -9999pxを使った画像置換のテクニックは、下記のようになります。 HTMLは見出し要素で実装します。 HTML <h3 id="sample06">見出しのテキスト</h3> 「text-indent:-9999px;」でテキストを見えない位置にし、見出しとなる画像を背景画像として表示します。 #sample06{ width:300px; height:50px; background:url('bg-01.gif') no-repeat 0 -250p
[CSS]マージンとパディングの使い分けをおさらい | コリス
CSSnewbieのエントリーから、ボックスモデルのマージン(margin)とパディング(padding)の利用シーンにおける違いを紹介します。 When to Use Margins and Padding マージン(margin)を採用する場合 パディング(padding)を採用する場合 ブラウザによる問題 マージン(margin)を採用する場合 borderの外側にスペースが必要な場合。 スペースに背景色(画像)を適用したくない場合。 上下に隣接したボックスにスペースを設ける場合、マージンの相殺を期待して、大きいサイズを有効にしたい場合。 例：15px + 20px の場合、スペースは20px。 ※相殺されない場合もあります。 パディング(padding)を採用する場合 borderの内側にスペースが必要な場合。 スペースに背景色(画像)を適用したい場合。 上下に隣接したボックスにス
ブログやウェブサイトですぐに役立つ「.htaccess」の設定のまとめ | コリス
ブログやウェブサイトのパフォーマンス改善や運営・セキュリティに役立つ「.htaccess」の設定を紹介します。 .htaccess Files for the Rest of Us [ad#ad-2] 下記は各ポイントを意訳したものです。 リダイレクトとリライト オリジナルのエラーページ 特定のリソースへのアクセス制限 特定のIPのアクセス阻止 IEのレンダリングモードの設定 有効期限を設定してトラフィックを軽減 gzip圧縮の利用 リダイレクトとリライト リダイレクト サイトを移転したなど、永続的なリダイレクトには「HTTP301リダイレクト」で設定します。 転送先のURLは絶対URLで指定します。 Redirect 301 ^old\.html$ http://ドメイン/new.html リライト リライト（書き換え）をする場合は、下記のようになります。 RewriteEngine o
WordPressプラグイン「BuddyPress」でSNSサイトを作成
2017年6月29日 Wordpress SNS（ソーシャルネットワーキングサイト）でユーザー同士がコミュニケーションを取れるサイトを作りたい！そんな時に役立つのがWordPressプラグイン「BuddyPress」。メンバーになると友達の申請やメッセージの交換、グループ（コミュニティ）の作成など、Mixiライクなサイトを作ることができます。さらにWordPress3.0のマルチサイト設定をすれば各メンバーがブログの作成可能！そんな便利なプラグインを紹介します。 ↑私が10年以上利用している会計ソフト！ BuddyPressでSNSサイトを構築 目次 BuddyPressでなにができるの？ BuddyPressをインストールする WordPress3.0でマルチサイトの設定 フォーラムを追加する BuddyPressのテーマを変更する 1. BuddyPressでなにができるの？ Word
iPhone 対応ウェブページにするおまじない
iPhone 対応ウェブページにするおまじない 2009-09-08-2 [Tips][iPhone] Revilist を iPhone の Safari で見ると、なんか縮小されちゃうので困っていました。 しかし、いろいろ調べて解決！ 下記のメタタグを足したらOKでした。 <meta name="viewport" content="width=device-width; initial-scale=1.0;"> おまじないなし。字が小さいです。拡大しても横スクロールが必要になってイマイチ。 おまじない後。iPhone の幅に合わせての折り返し。ほどよい文字サイズです。 参考 - iPhone 3G用のWebページを作る1 http://allabout.co.jp/internet/javascript/closeup/CU20080715A/index3.htm - iPhone
スマートフォンサイトをデザインする上で知っておくべき10のTIPS
スマートフォンサイトをデザインする上で知っておくべき10のTIPS iPhoneやAndroidのスマートフォンの仕様を知らないけどデザインしなくちゃいけなくなったというデザイナーさんに知っておいてもらいたい10(+1)のTIPSです。 1.実機で確認する 当たり前のことですが作成したデザインを実機で確認して下さい。スマートフォンとPCでは目からの距離やDPIが違いますので、PCでは十分に見れたからといって実機で確認すると文字が小さすぎることなどがよくあります。書きだしたJPGをFTPでアップして確認してもいいですし、メールでスマートフォンに送って確認してもいいです。個人的にはDropboxで転送するのが手軽でおすすめです。 2.横幅は320pxもしくは640pxでデザインする スマートフォンでは基本横幅が320pxで表示されるのでデザインする際も320pxでデザインしましょう。ただ、Re
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
