JavaScriptをあまり使いたくない、使えない。 速度の面やSEOとして、CSSで実装したい。 そんな方のために、JavaScriptで実装されがちなものを、HTML・CSSのみで実装してTipsにしてみました。 IE11〜、iOS Safari 9.2〜、Androidブラウザ4.4〜でだいたい動きます(ベンダープレフィックスが必要な場合も)。 デメリットもあるので、合わせて確認してみてください。 バルーン表示
JavaScriptをあまり使いたくない、使えない。 速度の面やSEOとして、CSSで実装したい。 そんな方のために、JavaScriptで実装されがちなものを、HTML・CSSのみで実装してTipsにしてみました。 IE11〜、iOS Safari 9.2〜、Androidブラウザ4.4〜でだいたい動きます(ベンダープレフィックスが必要な場合も)。 デメリットもあるので、合わせて確認してみてください。 バルーン表示
iPhone X が発表されて間もなく、ディスプレイの「切り欠き」については至るところでちょっとしたイジリ合戦が始まっています。中には実際に信じてしまっている人もいるほど秀逸なものがありまして、それがこちら。 思わずクスッときてしまいますが(笑)、まあ当然こんなことにはなりません。 iPhone X にはディスプレイの上下左右に iOS の占有領域が存在し、それ以外(アプリのタッチイベントを認める領域)を Safe Area と呼ぶようです。Safe Area の外にある上部領域にはステータスバーとして時計やアンテナのインジケータなど iOS のシステムアイコン等が並び、下部の領域には iPhone X で導入された「ホームバー」が存在することになります。 では iPhone X の Safari で Web サイトを表示した場合に一体どのようになるのか?それを Web 上の情報を元にまと
テキストエディタや Dreamweaver など、外部で作成した html メールを Microsoft Outlook 2010 で送信する方法。 →「テンプレート」として登録して送る 用意するもの:htmlメール用にコーディングされたhtml (html メールの作成方法は、別途記載する予定) 画像は外部に送るものならサーバにアップ。 社内用程度なら添付でかまわない。 「ファイル名を指定して実行(Windowsマーク+R)」で %appdata%\microsoft\stationery を記入し、Outlookのテンプレートのフォルダを開き、コーディングしたテンプレートをそのフォルダにコピーする。イメージもある場合は一緒でかまなわい。 Outlook2010を開き、「ファイル」→「オプション」→「メール」と辿り、「ひな形およびフォント」をクリック 「ひな形」のタブの「テーマ」をクリッ
Blog / Gmail HTML Email Development: Why Your CSS Is Not Working (and More) In the ever-changing world of email marketing, understanding the ins and outs of Gmail is paramount. We probably don't have to tell you that a lot of people use Gmail... but we will. According to Sinch Mailjet's new report, The path to email engagement 2024, 71% of consumers in its global survey said they have a Gmail acco
サイトを運営していると、サイト内のページの移動や削除、またはサイト自体の移転をすることがあります。その場合、リダイレクトという処理を用いて新たなページに転送を行いますが、正しい知識と手順を以って対応しなければ、検索順位の下降、ページランクやドメインエイジの喪失といったSEO的なペナルティを招いてしまいます。 そこで、そのようなペナルティを受けないために、ページ移動・サイト移転時の正しいリダイレクトの設定方法と、代表的なリダイレクトの種類やその実装方法をご紹介します。 リダイレクトの種類 リダイレクトには、HTMLやJavaScriptといったクライアントサイドプログラム、PHPやPerlといったサーバサイドプログラム、あるいは.htaccessの設定変更を行う等、様々な対応方法があります。そのうちのいくつかを、実際のサンプルソースとともに解説します。 metaタグによるリダイレクト hea
というわけで、今年も色々と読んでおくべきエントリーをまとめておきます。 正直読み返した上でリンクをぺたぺた貼っていったので、すんごい時間かかりましたけど、どいつもこいつも良記事でございます。読まずにいるとむしろ損する勢いでございます。 デザイン WEBデザインが短期間に上達した方法 | FEVDES BLOG 『これは、自分が新米デザイナーだった頃にやっていた、デザインの上達方法です。上手くデザインができない!上手くなるにはどうすればいいの?など、どうすればデザインが上達するのかわかならい人の参考になれば幸いです。』 たった1枚に込められたクリエイティブすぎる17個の広告 この記事の2億円、2人っていう広告がほんとうに色々な意味で印象的。 2013年の4大人気Webデザインのトレンド | Flips Blog Web担の小技 2013年のトレンド、今年のうちに。 50万件の投稿分析でわかっ
Web Componentsとは 本稿では、Google I/O 2013の中から、「Web Components」に関するセッションをレポートする。 「Web Components」は、簡単にいうと、Web(HTML)をコンポーネント化するための仕組みで、再利用性やメンテナンス性、開発効率を上げるのに大きな効果があるといわれている。 今年のGoogle I/Oでは、次の2つのセッションでWeb Componentsについて解説があった。 Web Components: A Tectonic Shift for Web Development(Google Chromeチーム 開発者Eric Bidelman氏) 資料:http://www.WebComponentsshift.com/ 「Web Components: A Tectonic Shift for Web Developme
奈良県警察ウェブサイトのソースコードに本気を感じました。 http://www.police.pref.nara.jp/
meta 要素に対する Microdata の指定について、過去に書いた記事に間違いがあったので修正とその解説。また、itemprop 属性もつ meta 要素や link 要素の body 要素内での使い方に関しても解説してみます。 もうちょっと早く書こうと思ったんですけどこんなに間が空くとは…… 去年の末、HTML5 Advent Calendar 2012 の記事として、「Microdata を使ってみよう。サンプルソースで学ぶ Microdata」 を書いたんですが、その中で 2箇所ほどサンプルソースに間違いがあるのをご指摘頂いて修正したんですね (ご指摘感謝です)。 そのうち、1つの間違いは単純な記述抜けというか、ミスだったんで置いといて、もう1つ、私が meta 要素に対して itemprop 属性を指定したサンプルで、同じ要素に name 属性をあわせて指定してたのをご指摘頂
Microsoft公式のIEのデベロッパサイト「modern.IE」から、古いブラウザをサポートしつつモダンブラウザ用のサイトを制作する時に役立つアドバイスをクロスブラウザの観点や、HTML, CSS, JavaScriptの実装時ごとに紹介します。 20 tips for building modern sites while supporting old versions of IE 下記は、各ポイントを意訳したものです。 クロスブラウザ HTML CSS JavaScript クロスブラウザ ウェブサイトはすべてのブラウザで同じように見える必要はありません。 例えば、最新のブラウザではよりリッチなUIを提供し、古いブラウザではソリッドに機能させます。 開発をシンプルにするために、堅実なテンプレートを利用しましょう。 動作が安定しているスタンダードにフォーカスを合わせて制作する。 スタ
DOCTYPE 宣言はなぜ作られたのですかという質問がありました。 HTML 文書の先頭には必ず DOCTYPE がなければならないとされています。しかし確かに DOCTYPE は一見何の役割も果たしておらず、無駄な行にしか見えません。なぜそんな DOCTYPE が作られ、今も必要とされているのかを理解するためには、少し昔の話をする必要があります。 SGML になりたかった HTML HTML は元々 SGML と呼ばれるマーク付け言語を参考に作られました。正確には SGML はマーク付け言語ではなく、マーク付け言語を定義するための枠組み、メタマーク付け言語とでも言うべきもので、どのような要素や属性、タグや実体参照を組み合わせてマーク付け言語を構成するかを SGML の規定に従って記述することになっていました。これが文書型定義 (DTD) であり、 DTD を宣言・参照するのが DOCTY
Web ページからデータを抽出してデータベースに突っ込むことに性的興奮を覚えるみなさん、 ScraperWiki 使うとキモチイイですよ。以上です。 そうではないみなさんには少々の説明が必要かと思いますので少々書きます。 ScraperWiki はスクレーパ(Web ページをスクレイピングするスクリプト)とスクレイピングで得られたデータを共有しようぜっという Web サービスです。Wiki と名が付いていますが Wiki っぽいページ構成になってるわけではなく、スクレーパやデータを誰でも編集できるようにして成果を共有するという理念が Wiki と共通しているのが由来みたいです。 ScraperWiki を使うとスクレーパを作るのがラクになります: Web ベースのエディタでスクレーパを書き、その場で実行できる PHP、 Python または Ruby が使える(HTML パーサなどのモジュ
昨日までのことは既にご承知だと思いますが、残された中でどうしても、最重要であるということで2点、先ほど財務大臣、それから与党の政策責任者の方々いらっしゃいましたけれども、1点目は中小企業支援対策、法律が3本あって、若干重複もあるということで、それを統合してわかりやすくといいましょうか、効率的な法律にすると同時に、内容も充実をするということで、中小企業を中心にした事業体の連携した異業種間を含めた連携によるプラス効果を支援するための補助金について、トータル26億円、一部認められておりましたけれども、ぜひ要求どおりお認めいただきたいということで26億円増になりまして、これを認めていただいたわけでございます。 2点目が物理探査船でございまして、今まで、内示から昨日の復活折衝もゼロでございましたが、財務大臣、それから両政調会長のもとで私なりのご説明を申し上げまして、その結果、17年度で約101億円、
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く