思いは言葉に。 はてなブログは、あなたの思いや考えを残したり、 さまざまな人が綴った多様な価値観に触れたりできる場所です。
思いは言葉に。 はてなブログは、あなたの思いや考えを残したり、 さまざまな人が綴った多様な価値観に触れたりできる場所です。
はてなブックマーク Facebook 連携機能の追加を記念して、「はてなブックマーク Tシャツ」が当たるキャンペーンを実施します。 応募方法はかんたん。Facebook 連携機能を設定して、このページをブックマークするだけです。Facebook のニュースフィードにこのページのブックマークが投稿されていれば応募完了です。 キャンペーンは終了しました。たくさんのご応募ありがとうございました。 はてなブックマーク Facebook 連携機能を利用することで、自分がブックマークした内容をFacebook へ投稿したり、Facebook でシェアしたリンクをはてなブックマークに追加することができます。 ※Facebook連携機能は、はてなブックマークのPCサイトと、ブックマークレット、はてなブックマークGoogle Chrome拡張、はてなブックマークSafari拡張、はてなブックマークFiref
1.携帯向けサイトは横幅240px、スマートフォンサイトは320px 2.スマートフォンにあるといい viewport 3.携帯サイトをスマートフォン対応させる ■携帯向けサイトは横幅240px、スマートフォンサイトは320px 携帯電話(ガラケー、フィーチャーフォン)の横幅はほとんどのものが240px前後であり、一般的に携帯向けのサイトは横幅240pxで作られます。 一方、スマートフォンでは、タブレットなどもありますが、片手で持てるタイプのものは320pxのものが主流となっています。 携帯サイトをスマートフォンサイトとして利用するにはこの横幅の問題があり、『画像が小さくなる/レイアウトが崩れる』などの問題が発生します。 ■スマートフォンにあるといい viewport スマートフォンでウェブサイトを閲覧すると、特にPC向けに作られたページの場合は、小さい画面に収まるようにして小さく表示され
携帯サイトのスマートフォン対応のポイント! ~スマートフォン表示で最適サイズを設定する「viewport」~ 2011.03.07 2019.06.21 WEBデザイン 1.携帯向けサイトは横幅240px、スマートフォンサイトは320px 2.スマートフォンにあるといい viewport 3.携帯サイトをスマートフォン対応させる ■携帯向けサイトは横幅240px、スマートフォンサイトは320px 携帯電話(ガラケー、フィーチャーフォン)の横幅はほとんどのものが240px前後であり、一般的に携帯向けのサイトは横幅240pxで作られます。 一方、スマートフォンでは、タブレットなどもありますが、片手で持てるタイプのものは320pxのものが主流となっています。 携帯サイトをスマートフォンサイトとして利用するにはこの横幅の問題があり、『画像が小さくなる/レイアウトが崩れる』などの問題が発生します。
WEBサイトのデザインについて質問です。 CSSなどを切り替える事でガラケー用とスマートフォンの表示を変えることを考えております。 とはいってもガラケーとスマートフォンでは表現能力が段違いすぎますし、切り替えるといってもベースとなるHTMLは1つなので文字の装飾程度しか思いつきません。 ベースとして同じHTML(もしくはPHPなど)を使用しているが、CSSの切り替えだけでデザイン自体をガラケー用とスマートフォン用とで変えている(もしくは雰囲気がスマートフォンっぽいものを演出出来ているなど)所などあれば教えてください。 また、そういったガラケー・スマートフォン両用のサイトを作成するにあたって具体例などあれば教えてください。 ※検索等でスマートフォンサイトの作り方などの紹介は不要です。
基本のHTMLを作成する 最低限の制作環境が整ったところで、さっそく簡単なスマートフォン向けWebページを作成してみましょう。エディターを起動して、次のようなHTMLを用意します。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>スマートフォンサイトテスト</title> </head> <body> </body> </html> 今回はHTML5で記述していますが、基本的にはHTML4やXHTMLなど、PC向けのHTML/XHTMLがほぼ利用できます(iモードなど携帯サイト用のHTMLは正しく表示できません)。続いて、基本的なマークアップを施していきます。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>
初めての投稿となります。エンジニアのmatsuです。 携帯向けウェブサイトを1時間でスマートフォン対応する方法を紹介します。 概要 2011年4月7日のニュースにて携帯電話の新規契約数のうち、スマートフォンが占める割合が50%を越え、スマートフォンが本格的に普及する兆しが見えてきました。 現在、スマートフォン向けサイトを新規構築するためのチュートリアルは数多く出ていますが、既存の携帯サイトをスマートフォンに最適化する方法があまり紹介されていないのでこの記事で紹介したいと思います。 このチュートリアルを行うと以下のようになります。 実装 全部で8ステップあります。 このチュートリアルではブログのトップページを例にとって説明します。 前半では文字コードの変更、HTMLの変更といった構造を変更します。後半では絵文字や文字スタイルを行い、仕上げとしてHTML5のバリデーションを行っていきます。最初
iPhoneにはWebブラウザとしてMac OS X/Windows用のSafari(以下、PC版Safari)のサブセット版が搭載されている。iPhoneのSafariでは一般的なWebサイトのほとんどが閲覧可能だが、Appleが提供している「iPhone向けのWebサイトデザイン」に従ったデザインを施すことで、iPhoneで閲覧した際により操作しやすいWebサイトを構築できる。本記事では、このようなiPhone向けのWebサイトを作成するテクニックを紹介する。 なお、以下では主にiPhoneについて述べているが、iPod touchに搭載されているSafariについても仕様はまったく同一だ。 iPhone版Safariの特徴 iPhoneに搭載されているSafariは、PC版Safariに採用されているレンダリングエンジン「WebKit」を使用している。また、フォントについてもMac
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く