twitterとかgmailとかでやってる、一番下までスクロールすると「もっと見る」みたいなリンクがあって、それをクリックすると下にもっと広がるアレ。 やってることは、クリックされるたびにjavascriptで データを用意する テンプレートを用意する テンプレートにデータを埋め込んで既存のDOMにappendする みたいな。いくらでも実装はあるけど、基本こんなの。 同じ事をしたいと思ったときに自分で0から実装するのがめんどかったので、javascriptでテンプレートエンジンいいの無いかなーと探してもどれもイマイチだったんだけど、lyase_viewというのがかなり良かった。 軽いし分かりやすいし、javascript何でも書けるし、ERBとタグ同じだし。 inforno :: 埋め込みjavascriptを実装してみました。 というわけでサンプル作った。 https://github.
日頃より楽天のサービスをご利用いただきましてありがとうございます。 サービスをご利用いただいておりますところ大変申し訳ございませんが、現在、緊急メンテナンスを行わせていただいております。 お客様には、緊急のメンテナンスにより、ご迷惑をおかけしており、誠に申し訳ございません。 メンテナンスが終了次第、サービスを復旧いたしますので、 今しばらくお待ちいただけますよう、お願い申し上げます。
自分用に備忘録。そろそろチートシート が出てくる頃じゃないかと思うので、そう 焦ることも無い情報だと思いますが、近々 使いそうなのでその時に面倒な事になら ないようによく使いそうなマークアップを リストとしてメモしておきます。 ちゃんとしたデモは本家で確認して下さい。ここにあるサンプルは僕のいい加減なサンプルです。尚、マークアップが見やすい様にするだけの為にコメントアウト入れていますが気にしないで下さい。 [note]追記 もう少し増やして見やすくしたものをダウンロード出来るようにしました。 [/note] プラグイン読み込み<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.css" /> <script type="text/javascript" src="h
これからのWEB制作はPCサイトだけではなく、iphoneなどのスマートフォンやipadなどさまざまなデバイスでの閲覧を前提として作成しなければいけません。 iphoneサイトやAndroidサイトはHTML5やCSS3にかなり対応しているので簡単そうなイメージもありますが、縦画面、横画面など変化することを前提に構築しなければいけませんし、Androidは機種によって解像度が違う、機種によってCSSが適用されないという昔のモバイルサイトより大変なことがおきているようです。 またシミュレーターを使ったり、実機をたくさん揃えたり、レンタルしたりとPCサイトより手間な制作の時代に逆戻りですね・・。 友人に聞いたら現在は案件よってはiphoneのみ対応、iphoneとdocomoを対応、すべて対応などさまざまなようですね。まあこれは予算によるのかもしれませんね。 僕はまだ本格的なスマホサイトの仕事
電話番号にリンクを設定する 続いて、ページ内に記載した問い合わせ用の電話番号にリンクを設定しましょう。といっても制作中のページをiPhoneで閲覧すると電話番号の部分にはすでにリンクが張られています。この状態で番号部分をタップするとすぐに通話アプリが起動して電話がかけられます。iPhoneはページ内に電話番号らしき数字の組み合わせを見つけると自動的にリンクを張ってくれるのです。しかし、この自動リンク機能は便利な反面、問題点もあります。 ・iPhoneでしか利用できない 自動リンク機能はiPhoneにしか搭載されておらず、Androidではリンクが張られません。 ・認識が不正確 自動リンク機能は数字の羅列とハイフンの組み合わせなどを解析してリンクを張っており、必ずしも解析が正しくない場合があります。たとえば、次のような電話番号ではない数字を誤って認識してしまう場合があります。 そのため、基本
.htaccess(mod_rewrite)でスマートフォン向けページへリダイレクトさせる方法 Posted by Hideki at 2011年5月 6日 14:15 タグ: Webサイト設計スマートフォン研究ノート .htaccess(Apacheのモジュールmod_rewrite)を利用して、スマートフォンでWebサイトにアクセスされた時に、自動でスマートフォン向けページにリダイレクトする方法を検討してみたので、記録しておくことにします。 前提条件 同一ドメイン内にスマートフォン向けページのディレクトリを用意する スマートフォン向けページのディレクトリを「/spn」とする ユーザーの希望に応じてPC向けサイト・スマートフォン向けサイトを選択して閲覧できるようにする .htaccessの設定例 RewriteEngine On RewriteCond %{REQUEST_URI} !^
何だか周りにiPhoneを持ってる人が増えてきたなぁと思う今日この頃です。 それにつれてiPhone用のサイトをコーディングする案件も増えて来ましたので、コーディングするときのポイントをまとめました。 iPhoneの特徴 まずは、iPhoneの特徴を見てみましょう。 一つの端末で複数の解像度を持つ iPhoneの特徴の一つとして、縦持ち・横持ちのときで横幅の解像度が変わります。 例えば、縦持ちのときは320pxで、横持ちのときは480pxとなります。 ※縦持ちのとき ※横持ちのとき そのため、320pxに最適化したコーディングをすると、横持ちのときに160px分の余白が空いてしまうため、320pxにも480pxにも対応出来るコーディングをする必要があります。 ※そのためには、デザインをしっかりと考えたものにしなければいけませんが…。 HTMLやCSSの実装状況はパソコンと同様 iPhone
こんにちは、ウェブ開発の林です。 スマートフォン向けウェブページを作る際、横幅ぴったりにしたいと思いませんか。 meta viewport というタグを使えば表示サイズを調整することができます。 ただそれを使ったとしても、Android / iPhone は端末により横幅が違うため個別に最適化するのは面倒です。 スマホ端末ごとにコードを分けることなく常に幅ぴったりにする HTML テンプレートを作りました。 こちらを参考に組んでみてはいかがでしょうか。 HTML テンプレートコード(ヒント付き) こちらの HTML コードを丸っとコピペして修正していくと楽だと思います。 追記: ライセンスフリーです。自由に使ってください。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title></title> <!--
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.
+1 ボタン 2 AMP 11 API 3 App Indexing 8 CAPTCHA 1 Chrome 2 First Click Free 1 Google アシスタント 1 Google ニュース 1 Google プレイス 2 Javascript 1 Lighthouse 4 Merchant Center 8 NoHacked 4 PageSpeed Insights 1 reCAPTCHA v3 1 Search Console 101 speed 1 イベント 25 ウェブマスターガイドライン 57 ウェブマスタークイズ 2 ウェブマスターツール 83 ウェブマスターフォーラム 10 オートコンプリート 1 お知らせ 69 クロールとインデックス 75 サイトクリニック 4 サイトマップ 15 しごと検索 1 スマートフォン 11 セーフブラウジング 5 セキュリティ 1
この記事の次の項目で紹介するが、グーグルがスマートフォン用のクローラを導入したことを受けて、スマートフォン向けサイトのウェブ担当者によく聞かれる代表的な質問や疑問について渡辺隆広氏が回答した。 スマートフォン用サイトをグーグルがどうやって認識・区別するかや、リダイレクトは301と302のどちらを使うべきかなど、あなたも抱いている疑問が含まれているかもしれない。挙げられているQ&Aのトピックは次のようなものだ。 今回のクローラーは、スマートフォン用サイトのみをクローリングすると考えて良いのか? Google は、PC 用サイトとスマートフォン用サイトをどのように区別・識別するのか? スマートフォン版 Googlebot-Mobile に見せるコンテンツはスマートフォン版で良いのか? 情報量は PC 版のほうが豊富なため、PC 版を見せたほうが検索ランキング的に有利ではないのか? UA 判定を
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く