You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
注意※Twitterのツイート数の取得のコードについて この記事のコードでは後日、ツイート数の取得ができなくなるとご指摘いただきました。確認したところ2013年5月7日に行われるTwitterの仕様変更によりツイート数の取得ができなくなってしまいます。(それについての記事)その他はてブ、いいね数のコードにつきましては正常に動作します。問題のコードはサンプルとして残しておきますが、ご利用の際はくれぐれもご注意ください。今回の件についてご指摘くださった方々に御礼申しあげます。そして、すべてのユーザーの方々に不確かな情報を提供してしまったことをお詫び申しあげます。 さらに追記※Twitter APIの仕様変更について Twitter APIの仕様変更後もこのコードで動作し続けています。もともとAPIのリファレンスにも載っていませんしいつ仕様が変更されるかわかりません。ご利用の際はくれぐれも気をつ
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.
かっこいいテーブルをデザインしたい。 そんなあなたにおすすめなのが、『A CSS styled table version 2』。デザイナーならこう作るCSSスタイルテーブルだ。 このエントリーでは、クリーンなソースでコーディングされたテーブルが2つ紹介されている。 » Example 1 背景画像は使わず、セルに背景色を使った例 » Example 2 背景画像を使った例 どちらもページのソースを見るのが早いだろう。 シンプルでとても綺麗なテーブルに仕上がっていると思う。 デザイナーならこう作るCSSスタイルテーブル、チェックして作っていきたいですね。 プランナー、アートディレクターにたくさんのことを教わりました。「とりあえず手を動かすのがレイアウトの基本」だと。あとデザインはピクセルよりも見た目。人間の目にはくるいがあるから見た目で綺麗にそろっていればいい。とにかく手を動かしていこうっ
Creating a table with dynamically highlighted columns like Crazy Egg's pricing table Update Aug 29, 2007: Examples 9 and 10, and the downloadable zip now accommodate for JavaScript-disabled browsers. Update Aug 28, 2007: links to examples fixed. Again. I like Crazy Egg's pricing table on their Pricing & Signup page. When you click on "Sign Up" for an option, that plan's column highlights, the othe
HTML/CSS/JavaScriptを書くために行ったVimの設定やインストールしたスクリプト等をざっとまとめてみた。「VimでWeb開発を100倍効率的にする方法」といったような生産性を上げるための設定の類ではない。 HTMLファイルを:makeで文法チェック tidy.vimが用意されているので、HTML Tidyをインストールし、.vimrcに以下のように書くだけで良い。 autocmd FileType html :compiler tidy autocmd FileType html :setlocal makeprg=tidy\ -raw\ -quiet\ -errors\ --gnu-emacs\ yes\ \"%\" tidy.vimのmakeprgでは日本語が化けるので-rawを追加する。 HTMLファイルのインデントをやり直す gg=G ノーマルモードではggでファイ
DocBookがややこしいのは、変換先としてさまざまなフォーマットに対応しており、そしてそのそれぞれの形式ごとにさまざまな方法がある点です。インターネット上にたくさんの情報があるのですが、あまりにたくさんの情報があり、混乱し、結局、あきらめてしまうことだと思います。ですので、以下ではいろいろな方法を紹介するのではなく、私が取った方法のみに限定して話を進めたいと思います。 DocBookは、決められたタグでXMLファイルを作成し、それをHTMLやPDF等にのさまざまな形式に変換します。ここでは、変換先としてHTMLファイルに限定して話を進めます。 まず、DocBook XMLファイルの文法を定めたスキーマを取得する必要があります。ここでややこしいのが、世の中にはスキーマの種類がたくさんあるということです。DocBookはRELAX NGをメインのスキーマとして用いています。そして、RELAX
CodeMirrorはJavaScript製のオープンソース・ソフトウェア。Webブラウザのテキストエリアの貧弱さは言うに事欠かない。メモ帳レベルの機能しかなく、とても使い勝手が悪い。HTMLを作成する場合はWYSIWYGなエディタに変換するCKEditorのようなソフトウェアも存在するが、Webブラウザ上でプログラミングしたいと思うような機能はない。 テキストエリアをハイライト もしWeb上で開発者向けのサービスや環境を提供しようと思うならCodeMirrorを使ってみるといいだろう。CodeMirrorはテキストエリアを開発のしやすいエディタ環境に変化させてくれるソフトウェアだ。例えばJavaScript/HTML/CSS/Python/Rubyといった言語向けにハイライト表示する機能がある。 それらは各言語向けのCSSとJavaScriptで作られたパーサーによって作られている。また
Styling Code Snippets with CSS demo デモでは、ノートスタイルが二種類と視認性に優れたブラックタイプが一種類紹介されています。 三種類ともHTMLはシンプルで、クラスを記述するだけでデザインを適応できます。 グリーンのノート <textarea name="code" class="css" cols="60" rows="5"> pre { font-size: 12px; padding: 0; margin: 0; background: #f0f0f0; border-left: 1px solid #ccc; border-bottom: 1px solid #ccc; line-height: 20px; background: url(pre_code_bg.gif) repeat-y left top; width: 600px; over
システマチックでない、いわゆる静的なWebサイトを構築する仕組みが変わり始めている。Concrete5やZimplitに代表されるような、その場で見たままにWebサイトを作り上げていくという流れが強まっているのを感じている。 ユーザ画面をそのまま編集する これまでのCMSでは管理画面を通してユーザ画面を変更していた。だがこれでは距離ができてしまい、本当に提供したかった内容が伝わらないかも知れない。見たままに即座に反映されるなら、自分たちの思いをそのままに投影できるはずだ。 今回紹介するオープンソース・ソフトウェアはLTSun-Engine、ユーザサイトを編集するCMSだ。 LTSun-Engineはユーザが閲覧しているWebサイトのコンテンツをその場で編集し、反映することができる。WYSIWYGエディタを通すので、ポップ内での編集にはなるのだが、編集後にPublishをクリックすれば反映は
yamazakiです。最近だいぶあたたかくなってきましたね。おかげで日中眠くて仕方ないわけですがいかがお過ごしでしょうか。 ウノウに入る以前も含めてそれなりに長いことHTMLとCSSを書いてきたわけですが、今回は試みに、「だいたいこういうところに気を使われたHTMLだと、CSSでのデザイン適用やレイアウトがやりやすいな」というこれまでの経験則を簡単ですがまとめてみたいと思います。 まあ、このあたりはCSS書く人とHTML書く人の間でちゃんとルールを決めておけばいいだけの話なので、そもそも何の役に立つのか疑問といえば疑問ですが(笑 たとえばユーザがCSSを書いてスキンを作れるようなサービスを作る際、どういったHTMLにするかを決める、みたいな時には少し参考になる、かもしれません。 ID、クラスを適切に割り振って、要素がCSS側から一意に特定できるように たとえばグローバルナビゲーションとカ
今回のポイント 1行あたりの文字数の目安 1段落の文字数の目安 段落に含む文字数 行間調整の考え方 字間調整を使ったロゴ風味見出し 日本語というのはもともと縦書き文化です。文字も筆で縦書きしていくときに書きやすいように作られています。現在PC画面上で見るフォントは,活字印刷物のフォントとは違い,横書きで読みやすいようにもともとの字体から若干形を変えられています。それでも起源である縦書きの形を完全に壊すことができないので,やはり横書きでは読みづらいようになっています。 日本人が苦痛を感じることなく読める横書き1行あたりの字数は20字+α程度だと言われています。意識して雑誌などを見るとたいていが!)25文字から28文字程度です。用紙,つまり本のサイズがA4を超えるような大判になると,1ページを左右2段組に分けて25~28字程度に調整されています。 一方,縦書きの場合には識別許容量はグンと増加し
APIが提供されていないサービスから欲しい情報だけを取得するには、HTMLなどから自前でスクレイピングを行うしかありません。PHPでのスクレイピングに役立つライブラリなどをまとめてみました。 PerlやRubyには色々と便利そうなものが見つかるのですが、PHPにはなかなかこれといったものがないですね。 Webスクレイピングライブラリ HTMLScraping HTMLをXML化してDOMやXPathで操作できるクラス。主にHTTP_Request+HTMLParser(XML_HTMLSax3を含む)/Tidy+Cache_Liteという構成で、スクレイピングに必要なものが一通り揃っている。ライセンスはLGPL他。 WebScraper シンプルな汎用スクレイピングクラス。HTTP_Client+HTMLParser(XML_HTMLSax3を含む)という構成で、XPathで要素を抽出でき
HTML-lintというと、まあ一般的にはAnother HTML-lintを指すだろう。って何処の一般なのかは知らんが。Another HTML-lintは非常に良いサービスで、単なる文法チェックにとどまらず、いわゆる宗教的と呼ばれるたぐいの文法であるとか、WCAGに基づくアクセシビリティのチェックまでも出来たりする。 あー便利だ、便利。マジ便利。 このチェックは採点方式で行われるのだが、DTD的にはあくまでValidな文書であっても、実際には減点されたりもする。たとえば、span要素が空だったり、p要素の中がbr要素だけだったりとか、こういうのは減点される。Authorは減点されるのを防ぐがためだけに、見栄え的に影響をあまり及ぼさない範囲、つまりたとえば空白を入れてみたりする。今のAnother HTML-lintではそれでも警告を発する。いやー素晴らしい。単にDTD的にValidかI
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く