htmlに関するionvir0のブックマーク (25)

  • ファイルをアップロードする(複数ファイル+ドラッグ&ドロップ対応版)

    ブラウザを使用してファイルをアップロードするサンプルです。複数ファイルやAjaxを使用したドラッグ&ドロップにも対応しています。サンプルではGIF/PNG/JPEGの画像ファイルの認識や各種エラーにも対応しています。言語はPHPとなります。 まずは結果から [初期画面] [アップロード後の画面] ファイルを複数選択して「アップロードを実行するボタンを押す」 or 「ドラッグ&ドロップ」するとサーバーへ画像ファイルがアップロードされます。アップロードされた画像ファイルはブラウザに表示されるようにしています。 ソースコード[uploads.php] 下記がサンプルのソースコードとなります。 <?php $errmsg = ""; // エラーメッセージ define("FOLDER_UPLOAD" ,"./hoge/") ; // 保存先のフォルダ名(任意のフォルダ名にする) if (isse

    ファイルをアップロードする(複数ファイル+ドラッグ&ドロップ対応版)
  • OPcache導入してみた!(速さ検証もあるよ!) - Qiita

    OPcacheとは OPcacheとはコードをコンパイルし、共有メモリへ保存しておく仕組みのことです。 PHPはインタプリタですが、この仕組みによってリクエストごとにスクリプトを読む必要がなくなり、パフォーマンスの向上が期待されます。 インストール 記事ではWindowsphp 7.2.4で設定を行っています。あらかじめご了承ください。 準備 特になし(さすがにPHPは入ってますよね?) 設定 php.iniで以下の設定を記述します。 # Linux,Macの場合 zend_extension=/[それぞれのPHPのextensionのパス]/php_opcache.so # Windowsの場合 zend_extension=C:\[それぞれのPHPのextensionのパス]\php_opcache.dll [opcache] opcache.enable=1 opcache.en

    OPcache導入してみた!(速さ検証もあるよ!) - Qiita
  • jQuery高速化!処理速度を10倍上げるテクニック20選

    Aircraft manuevers during an airpower deomonstration. / Official U.S. Navy Imagery Javascriputを簡単に書けるようにしてくれるライブラリのjQueryですが、使い方をちょっと変えるだけで、パフォーマンスに大きく差がでます。ハイスペックPCでは分かりづらいかもしれませんが、スペックの低いPCやモバイルではWebページの表示速度が遅くすぐに閉じられるかもしれません。 Webページがたった1秒高速化するだけでECサイトなんか、売上が10%向上した事例もあります。そこで、jQuery高速化のポイントや方法をここにまとめておきます。 jQueryの最新バージョンを使う 図1 jQueryのバージョンによる速度 https://jsperf.com/speed-comparison-of-jquery-vers

    jQuery高速化!処理速度を10倍上げるテクニック20選
  • FuelPHPで気になるあの情報の取り出し方 - ECサイト運営開発記

    リクエスト関連の情報 http://example/index/list/でアクセスした場合 コントローラー名の取得 Request::main()->controller "index"ではなく"Controller_Index"というコントローラークラス名が返ってくる。 "index"という名前を取りたい場合はRequest::main()->uri->segment(1);などの関数で第一セグメントを取得する。 uri->segment(1)はあくまでもURIから最初のセグメントを取得するので、コントローラー名が返ってくるわけではない。(ルーティングを使用している場合など) アクション名の取得 最初に実行されたアクション:Request::main()->action 現在実行中のアクション:Request::active()->action 転送元のアクション:Request::a

    FuelPHPで気になるあの情報の取り出し方 - ECサイト運営開発記
  • SEO対策として最低限押さえておきたいHTML/HTML5マークアップの大事な6つのポイント

    検索エンジンがページ構造を理解しやすいようにHTMLがマークアップされていることは、安定的に検索結果上位にインデックスされるために重要な要素の1つです。 当然のことながら、前提として検索キーワードを想定した質の高いコンテンツ作成が必要です。せっかく質の高いコンテンツを作成してもマークアップの仕方が論理的に間違っていると台無しです。 今回はSEO対策として押さえておいてほしいHTMLおよびHTML5マークアップの最低限のポイントについてお話しします。 この記事では自力でSEOに最適なマークアップをする方法を紹介していますが、はじめからSEO対策がばっちりなWordPressテーマを使えば、なにもしなくても良いのでとてもラクです。SEO対策が万全のWordPressテーマは下記で紹介しています。 WordPressのおすすめテーマはコレ!SEOもレスポンブも完璧【有料&無料】 headタグ内の

    SEO対策として最低限押さえておきたいHTML/HTML5マークアップの大事な6つのポイント
    ionvir0
    ionvir0 2016/11/24
    マークアップ
  • WEB ページの読み込み時間を短くしよう - Qiita

    まずは遅くなる原因を取り除こう この記事ではクライアントサイドに焦点を当てて紹介しますので、PHPRuby などサーバーサイドのプログラミングに関することは一切出てきませんのでご了承ください(o*。_。)oペコッ サイトの読み込みが遅い場合、大抵はまずいやり方をしている一部分が足を引っ張っていることが多いと思います。 手当たり次第に最適化を試す前に「なぜ遅いのか?」問題の切り分けをしっかりやってから対応を考えましょう。 原因はどうやって特定するの? PageSpeed Insights (developers.google.com) を使ってみる ブラウザ搭載のデバッガで調査するのが王道だけど、お手軽に調べるのであれば PageSpeed Insights がキャッチーでオススメです。 最低限のお作法について指摘してくれるので、指摘事項を直していけば割と解決します。(原因が曖昧なま

    WEB ページの読み込み時間を短くしよう - Qiita
    ionvir0
    ionvir0 2016/09/21
    高速化。lazy loadも発見
  • auの携帯でapplication/xhtml+xml; charset=utf-8なサイトを見ると問答無用で文字化けする - gifnksmの雑多なメモ

    ちょっとはまったのでメモ。ググっても同じような症状は見つからなかった。 手元の携帯(W51H)のezwebのブラウザはapplication/xhtml+xmlな文章の文字コードをShift_JISとしか認識してくれないようだ。HTMLヘッダの方で文字コードを指定しても文字化けをした。 <?xml version="1.0" encoding="utf-8"?> こんな感じにxml宣言で文字コードを指定していても文字化けをしていた。metaタグが無いのがいけないのかと思い, <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> てな感じで文字コードを指定しても駄目。 結局.htaccessの方をいじって解決。 AddType "text/html; charset=utf-8" .html Rewrite

    auの携帯でapplication/xhtml+xml; charset=utf-8なサイトを見ると問答無用で文字化けする - gifnksmの雑多なメモ
    ionvir0
    ionvir0 2016/09/03
    au一部機種でUTF-8の文字化け対策
  • itti-c.com

    itti-c.com 2018 Copyright. All Rights Reserved. The Sponsored Listings displayed above are served automatically by a third party. Neither the service provider nor the domain owner maintain any relationship with the advertisers. In case of trademark issues please contact the domain owner directly (contact information can be found in whois). Privacy Policy

    itti-c.com
    ionvir0
    ionvir0 2013/12/17
  • ウェブサイトのリーダビリティを改善するための5つの秘訣 |SEO Japan by アイオイクスSEO Japan|アイオイクスのSEO・CV改善・Webサイト集客情報ブログ

    「リーダビリティ」なんて書くと偉そうに聞こえてしまいますが、ようするに「読みやすさ」ということですね。直接SEOには関係ないと思われる方もいるかもしれませんが、パンダやペンギンはサイトの直帰率や滞在時間を考慮しているなんて説もありますしmコンテンツ重視のSEOが求められる現在、せっかく作ったコンテンツを内容が良いにも関わらず読みにくさから途中で帰られてしまうなんて事態を最低限にするためにも、サイトのリーダビリティは重要です。今回はそんなリーダビリティを向上するためのティップスを5つ紹介した記事をrespystudiosからどうぞ。 — SEO Japan より読みやすいウェブサイトとは、改良されたユーザービリティと楽しんで読む体験を意味する。私たちは皆、ユーザーのためにそれを欲しているのではないだろうか? この記事では、ウェブサイトのリーダビリティを改善することができる5つの簡単な方法を検

    ウェブサイトのリーダビリティを改善するための5つの秘訣 |SEO Japan by アイオイクスSEO Japan|アイオイクスのSEO・CV改善・Webサイト集客情報ブログ
  • HTML5でモダンブラウザのCSS3バグを回避するためのハック方法 | ゆっくりと…

    将来、何かの役に立つかもしれないので、メモとしてエントリー。 IEなんかの古いブラウザに対応するための CSS ハック方法は古くから知られていますが、CSS3 への過渡期の現在、(当は使いたくない)ベンダー・プレフィックスや Modernizr なんかを使って新しいデザインにチャレンジしている人も多いことでしょう。 それでもなお、特定ブラウザの、特定バージョンで思った通りのデザインにならないことがあれば、やはり何かしらのハックに頼らざるを得ない状況は、今も昔も変わらないのかもしれません。 そんな場合のハックを An HTML5 boilerplate addon for CSS browser nitpicks から紹介です。紹介されているテクニックは、従来型の CSS 解釈時バグや CSS 属性のアリ/ナシといった特徴や機能ベースではなく、そのものズバリ、ユーザーエージェントによるブラ

    ionvir0
    ionvir0 2013/07/02
    ハック
  • レスポンシブWebデザインの作り方(簡単設定方法)

    webmobileは、みんなが知りたいスマホ・通信ガジェットの使い方を発信しているレビューサイトだよ♪ webmobile(ウェブモバイル)は、大好きなPixel/iPhone/MVNO/amazonについて、気づいたこと・困った事の解決など経験したことを発信しています。 運営歴はかれこれ10年以上です。 私が初めて買ったスマートフォンは、auから発売されたSHARP製IS03。今でもデザインの良さに感銘を受けます。 今のメイン機はGooglePixelとiPhone15ProMAXです。 昔はASUS製ZenFoneにはまり、新製品が発売されるごとに買っていました。 MVNOのお店に我が子と訪ねる旅、楽しかったなぁ♪ ご縁あって、UQコミュニケーションズ社に行くこともありました。 UQモバイル公式グッズをたくさん手に入れる機会がありました。 東京新宿にあるLINE株式会社に招待して貰っ

    レスポンシブWebデザインの作り方(簡単設定方法)
    ionvir0
    ionvir0 2013/03/27
    css振り
  • Facebook・Twitterなどソーシャルボタン設置方法まとめ │ Design Spice

    twitter、facebook、google+1、evernote、tumblr、はてブ、mixiなど、各ソーシャルメディアやブックマークに共有するボタン設置方法をまとめてみました。 このブログはwordpressで構築しているのでプラグインを使用すれば簡単なのですが、他サイトなどにも使うことを想定した設置方法です。 備忘録エントリー。 twitter ツイートボタン facebook いいねボタン google+1ボタン evernote サイトメモリーボタン tumblr 共有ボタン はてなブックマーク mixiチェックボタン twitter ツイートボタン 1.コード取得 下記リンク先でツイートボタンのソースコードが取得できます。 Twitter / ツイートボタン ボタン ボタンの種類を選びます。 ツイート内テキスト ツイートに含まれるテキストを選択します。 ボタンが表示されるペ

    Facebook・Twitterなどソーシャルボタン設置方法まとめ │ Design Spice
    ionvir0
    ionvir0 2013/01/06
    ソーシャルボタン
  • あなたが作ったサイトのフッターの役割は?12のフッター活用方法!

    昔はさっぱり注目されていなかったフッターエリアですが、今では多くのクリエイターがフッターに関心を持つようになりました。フッターデザインだけを集めたサイトなんて過去にほとんどありませんでしたが、ここ2、3年でいくつもそういったサイト・ページを見るようになりました。また特に海外サイトで言えることですが、最近では「これがフッターなのか!」と思う、すごいクオリティーのフッターも見る機会が多くなりました。 皆さんは大きく関心を集めるようになったこのフッターエリアを上手に活用できていますか? ユーザーの起こすアクションを絞る(誘導する) 皆さんはブログの記事を読み終わった後、次にどんなアクションを起こしますか? スクロールしてトップに戻る 元々いたサイトに戻る(はてブとか) タブを閉じる ツイートしてみる なんとなくコーヒーを飲む 上記のようにユーザーは、記事を読み終わると必ず何らかのアクションを起こ

    あなたが作ったサイトのフッターの役割は?12のフッター活用方法!
    ionvir0
    ionvir0 2012/11/09
  • Webクリエイターズマニュアル

    今年のお盆休みは友人旅行に行ったり、ボルダリングの体験をさせてもらったりしていて、ブログの更新が疎かになっていました。...

    Webクリエイターズマニュアル
    ionvir0
    ionvir0 2012/11/09
  • さくらのレンタルサーバ

    レンタルサーバなら「さくらのレンタルサーバ」! 月額換算でわずか131円、缶ジュース1分のお値段で使える格安プランから、ビジネスにも使える多機能&大容量プランまで、 用途と予算に合わせてプランを選べます。 さらにマルチドメイン対応でメールアドレスも無制限。無料ウイルススキャンや無料電話サポートもあるので安心して ご利用いただける共用レンタルサーバサービスです。

    さくらのレンタルサーバ
    ionvir0
    ionvir0 2012/11/09
  • 検索エンジンロボットの巡回を拒否するメタタグ一覧 (Yahoo!/Google)

    HTMLファイルのHEADタグ内のMETAタグ(メタタグ)で指定する検索エンジンロボット(クローラー)の"拒否"(検索避け)に関連した「Robots Exclusion Protocol」(「REP」:ロボット排除プロトコル)のMETAタグに指定するCONTENT属性値名一覧。 拒否系としては、もともと「NOINDEX」と「NOFOLLOW」だけが定義されてましたが、検索エンジン側の独自拡張で増えてきた経緯があります。2008年6月、日の3大検索エンジン「Yahoo!」(ヤフー)、「Google」(グーグル)、「Microsoft Live Search」(現Bing)の3社は共通仕様を発表しました(赤項目)。 [追記...] 2010年12月よりYahoo! JAPANが提供するYahoo!検索はGoogleの検索データを利用してます。対応してるMETAタグはGoogleと同じになりま

    ionvir0
    ionvir0 2012/10/18
    ロボット拒否
  • (ちょっとメモ)HTML5で廃止される要素一覧

    (ちょっとメモ)HTML5で廃止される要素一覧 最終更新日:2017年11月02日 (初回投稿日:2011年09月12日) HTML5では新しい要素が加わる一方で、廃止になる要素もあります。 廃止の理由は、 ● CSSで代替えできる(basefont, big, center, font, strike, tt) ● フレーム関連はアクセシビリティに反する(frame, frameset, noframes) ● 他の要素で代替できる(acronym, applet, isindex, dir) などです。 廃止になった要素は、使っても効果がないか エラーになるので要注意。 というわけで、一覧表にまとめておきます。 ● 2015年2月:初回投稿時(2011年9月)は HTML5はドラフトで、下記一覧表の要素が廃止される予定でしたが、HTML5.0の正式勧告で、s要素と u要素は復活しました

    (ちょっとメモ)HTML5で廃止される要素一覧
    ionvir0
    ionvir0 2012/02/25
  • seotemplate.biz - seotemplate リソースおよび情報

    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.

    seotemplate.biz - seotemplate リソースおよび情報
  • http://www.playstudy.net/blog/develop/html5-linkrel.html

    ionvir0
    ionvir0 2012/02/20
  • 手っ取り早く携帯サイトを作成する時のhtmlテンプレート - webの人 @ryryo

    最近phpをいじるがてら、ひさびさに携帯サイトに触れているためメモメモ。 携帯サイトで装飾を入れるとなるとi-cssが云々って話があったりしますが、正直テストサイトでそんな面倒なことをしていられないので、だいたい以下のようなhtmlで作成しています。 とりあえず携帯サイト作りたい時テンプレート <?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/2.3) 1.0//EN" "i-xhtml_4ja_10.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja"> <head> <meta http-equiv="Co

    手っ取り早く携帯サイトを作成する時のhtmlテンプレート - webの人 @ryryo
    ionvir0
    ionvir0 2011/12/25
    携帯サイトを作成