Reckoner における Datadog Browser Test の活用事例 / Datadog Browser Test at Reckoner
Twitter CPIのTwitterアカウントでは、サイト、サーバー管理者のための重要なセキュリティ情報や、サイト運営者のためのヒント、お得なキャンペーン情報をお知らせしています。 Follow @cpiadjp Tweets by cpiadjp 掲載内容について、当社は情報の掲載には細心の注意を払っておりますが、完全性などについて保証を行うものではありませんので予めご了承ください。 掲載されている情報をご利用いただいた際に、損害が発生・誘発した場合や、情報自体の真偽性・合法性・道徳性・著作権の許諾等について問題が発生した場合などについて、当社は一切の責任を負いません。掲載されている情報を利用したサイト製作については、ご自身の責任において行ってください。
ジャンル別にさがせるHTMLタグリスト HTML&CSS Web制作リファレンス - ホームページの構築・運用 - HTMLタグ スタイルシート テンプレート JavaScript Webツール カラーチャート 掲示板 Home HTMLタグ HTMLの基本 HTML5で廃止予定の要素と属性 HTML5で廃止予定の要素と属性 Webテンプレート HTML+CSSサンプルコード集 HTML5について HTML5は、HTML4に代わる次世代バージョンのHTMLです。 既に移行を進めているサイトもあるようですが、2011年1月現在、HTML5はまだ正式には勧告されていません。(2012年に勧告予定?) ※以下の情報は、2011年1月現在のものです。 【移行への準備として】 以下は、HTML5で廃止が予定されている要素と属性の一覧です。 これからWebサイトを構築するのであれば、(HTML5への移
作成:2013/10/15 更新:2014/11/01 Web制作 > 先週、WordPressとEC-CUBEのレイアウトを変更しなければいけなくて、久しぶりにいじっておりましたが、忘れていたり知らなかったことが沢山ありました。レイアウトはSEOやUIにも深く関係しているのもあり、ここらへんでCSSやHTML5を触るときに参考にすると捗る記事を一回まとめようと思います。今回はCMSやオリジナルサイトを作るうえで「知っておくと必ず役立つ」ものをまとめました。 エンジニア速報は Twitter の@commteで配信しています。 もくじ 定番まとめ 1.勉強になるテクニック/サンプルまとめ 基本知識 2.セレクタ 3.メディア クエリ 4.コーディング規約 5.フォント 6.CSSスプライト 7.アニメーション 8.正確なHTML使用方法 9.CSSハック 10.書き方/読み方 定番まとめ
現在、公開しているMaterial - テーマ ストア - はてなブログに ソーシャルボタンについてご相談があったので回答の1つとして実装してみました。 他のテーマを使っている方でもそのままコピペもしくは調整することで使えると思います。 続きを読む jQueryを使ってテーブル内でアコーディオンするための方法をご紹介します。 開くボタンを押すと隠れていたコンテンツが開閉するようになっています。 テーブルをすっきり見せたいけど詳細なども表示させないといけないときのUIとして参考になるかもしれません。 続きを読む はてなブログテーマ「Material」でタイトル画像をアップロードした際、画面に最適化するようにしました。またCSSを追加するだけで海外サイトのように画像に薄い色が重ねっているようなカスタマイズ方法もご紹介します。 続きを読む
HTML5でiPhoneやAndroid向けのハイブリッドアプリを作るのが最近の流行りみたいです。ハイブリッドアプリとは、外面は普通のアプリとしてAppStoreやGoogle play marketでインストールできるものの、その中身や一部がHTML5で記述されているアプリです。 最近の有名な例だと、CookpadやLinkedIn、はてなスペース、少し前にネイティブに移行してしまいましたがfacebookのモバイルアプリもHTML5を使って記述されていました。GREE界隈で言われているらしいガワネイティブっていう言葉もハイブリッドアプリを指します。ちょっとググってみると、2016年には企業向けのアプリの50%がハイブリッドアプリになるという予測もあります。 ハイブリッドアプリの何がいいかというと、Objective-CとかJavaとかがわからなくてもウェブ系技術者であればAndroid
なんだかidea*ideaさんの たった一行でブラウザをシンプルなメモ帳に変える方法 という記事が話題になってまして、ブラウザをメモ帳代わりにするっていうお話なんですが…いろいろ調べてるうちにブラウザ上で動作するエディタができちゃいました。 contenteditableとは 件の記事ではWebブラウザのURL欄に data:text/html, <html contenteditable> というのを入力して開くと、ブラウザ自体がメモ帳のようにテキスト入力できるようになるよ!というネタでして、確かにテキスト入力すると書き込めるようにはなってるんですが残念ながら保存はできません。 ブラウザの【保存】でもhtmlとしてしか保存できないしなんだかテキストは実態参照になって(chromeで保存した場合)たり…といった感じなのです。 そもそもこのコードの【contenteditable】っての自体
ゼロからあなた自身のページを作る時のガイドとして利用されることを目的とし、最小限の要素で構成されたHTML5の基本に忠実に作成したテンプレートを紹介します。 HTML5 Bones HTML5 Bones -GitHub HTML5 Bonesの構成 HTML5 Bonesは非常にシンプルで、jQuery, Modernizeなどは含まれていません。含まれている外部のライブラリは、クロスブラウザ用にNormalize.css、IE8以下用にHTML5をレンダリングさせるためのhtml5shivだけです。 使用している要素もページを作成する最小限の要素で構成されており、テンプレートを利用するにあたり各要素をどのように使うべきか、インラインでコメントで細かく説明されています。 下記に、そのインラインコメントを翻訳しました。 年末年始をまたいで制作者のIanさんとやり取りをしていたので、公開に時
この順序で指定するのが必須というわけではありませんが、durationとdelayの順序だけは決まっており、逆にすることが出来ません。 記述例) transition /* * @transition-duration * @transition-property * @transition-timing-function * @transition-delay */ transition: .3s background ease .5s; 当記事執筆時点(2012年11月)では、このプロパティに対してベンダープレフィックスをつけて指定することになります。 ベンダープレフィックスをつけてみた - transition -webkit-transition: .3s background ease .5s; -moz-transition: .3s background ease .5s;
※image via 003 FREE WEB GRAPHICSデバイスの多様化に伴い、拡張性の高いWebアプリの重要性が見直されています。サイバーエージェントのデカグラフを構成するサービスも基本的にはWebベースで作られていますが、これはアプリの改善スピードを上げたり、各サービス間の回遊性を高めるという狙いもあるようです。 ただし、スマートフォンユーザーはネイティブアプリ先行でサービスに触れているため、これまでのWebアプリでは当たり前だったことが、今ではストレスに感じてしまうことも多いです。HTML5の登場やJavascriptのライブラリの充実などにより、最近ではリッチなWebアプリを作る環境が急速に整ってきてはいますが、それでもスマートフォン向けに満足度の高いWebアプリを提供するハードルは非常に高いと言えると思います。 そこで、「もっさり&カクカク」な印象のあるWebアプリの操作
こんにちは、鴨田です。 個人的に仕事の大半はスマートフォン関連なので、 最近のマークアップはほとんど全てHTML5+CSS3で行っています。 とはいえ、PC向けのサイトではまだまだHTML4.01、XHTML1.0、CSS2.1を使用している場合が多いと思います。 ですので、今回はHTML5+CSS3を導入するにあたって、役立つと思う7つの設定について、書きたいと思います。 1.HTML5の初期テンプレート案 <!DOCTYPE html> <html> <head> <meta charset=utf-8 /> <title>HTML5 初期テンプレート</title> <!-- reset.cssの設定 --> <link rel="stylesheet" media="screen" href="reset.css" /> <!-- Viewportの設定 --> <meta nam
Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp
面白法人カヤックがサイトリニューアル! いきなり手前みそで恐縮ですが、今年の夏、面白法人カヤックがコーポレートサイトを2年ぶりにリニューアルしました。 「世界一更新頻度が高く、カヤックの活動がひと目で分かるコーポレートサイト」をコンセプトに、可読性が高く容量も軽いサイトに仕上げました。 ひと目見るだけで、最近のカヤックの動向が分かるようにニュースでTOPページを構成し、日々リアルタイムにカヤックの最新の情報を発信します。 技術的には、ブラウザのウィンドウサイズによって拡縮する画像はベクターファイルであるSVG(Scalable Vector Graphics)画像で置き換えたり(SVGはベクトル形式の画像のため、拡大してもボケない)、CSS3を用いることで画像の使用を極力控えたりするなど、ページの軽量化を実現しています。 カヤックサイトのCSSテクニックを丸ごと伝授! 本稿では、サイトリニ
HTML5 旋風、吹き荒れてますね!(^0^)/ さて、ものすごく突然で恐縮ですが、この度「HTMLファイ部」、設立しました! 株式会社カヤック(本社:神奈川県鎌倉市、 代表取締役CEO:柳澤大輔、http://www.kayac.com以下「カヤック」)は、HTML+CSSコーディング、JavaScript プログラムを担当する職種が所属する「HTMLファイ部」を発足いたします。 これまでHTMLおよびCSS、JavaScriptの担当者は、プログラマが所属する技術部、デザイナが所属する意匠部ME課(MEはMarkup Engineerの略)に分かれて所属していましたが、昨今のHTML5の進化と普及を受けて、HTML、CSS、JavaScriptの担当者は「HTMLファイ部」にて活動をスタートします。 そんなHTMLファイ部員が今回お送りさせていただくのは、 HTML5 について基礎から
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く