web画面をキャプチャーする方法 - 城好きwebプログラマーの生態メモ - 仕事編
仕事でweb画面のキャプチャーをとらないといけなくなってイロイロ調べてみました。 web画面をキャプチャーする方法はいくつかあって、例えば外部サービスのSimpleAPIとかHeartRails Captureとか利用する手もあります。 単純なものだったらこれですみそうなんだけど、今回は作業環境が社内なので外部からのアクセスが届かない、動的に生成したいのでリアルタイムに欠ける、などなどがあってこれらは使えそうにないので別の方法を。 ということで外部サービスなどに頼らずに内部で生成しましょう、と思って調べてみるとwkhtmltoimageという便利なものがあるので、これを導入。 まずこのサイトからダウンロードして解凍。 $ sudo -s $ cd /usr/local/src $ wget http://wkhtmltopdf.googlecode.com/files/wkhtmltoim
[JS]フォームのエラー判定を行い、アドバイスを表示するスクリプト -Ketchup
カスタマイズ性に優れた、フォームのエラー箇所にツールチップをふわりとアニメーションで表示するスクリプトを紹介します。 Ketchup Ketchupは既存のフォームにも簡単に導入が可能で、マークアップの変更やツールチップのデザイン変更も簡単に行えます。 また、エラー判定も多彩な項目で設定が可能です。 入力の有無 最大・最小文字数 最大・最小数値 メールアドレスのチェック urlのチェック 日付のチェック ユーザーネーム（a-z0-9_-）のチェック など これらの判定は組み合わせて使用することも可能です。 設置方法は、スクリプトとスタイルシートを外部ファイルとして記述し、各フィールドに下記のように追加します。 HTML（変更前）
さらばテーブルレイアウト！CSSビギナーの濃い1日 (1/4)
そろそろテーブルレイアウトから脱したい、でもフルCSSレイアウトへの移行はまだちょっと不安――。そんな“CSSビギナー”なWeb制作者のためのセミナーイベント「CSS Nite ビギナーズ」が11月1日、東京都内で開催された。 XHTML＋CSSの基本から、ワークフロー、さらにはブラウザー間の調整テクニックまで、CSSを使ったWeb制作入門者のためのプログラムがみっちりつまった6時間。その中から特に本誌読者にも役立ちそうなトピックをいくつか拾ってみた（セミナーの概要についてはコラムを参照）。 どう進める？ Web制作のワークフロー 個人的に独学でWeb制作を始めた。企業での実務経験はないので、効率的な作業の進め方が分からない――。初心者がつまづく“分からない”の1つに、実作業のワークフローがあるのではないだろうか。そうしたノウハウは、やはり実務として日々バリバリ取り組んでいる人の教えを請う
30分でできる！Webサイトを高速化する6大原則 (2/4)
2.画像はサイズを指定せよ！ 画像サイズは必ずHTMLのwidth属性とheight属性、もしくはCSSのプロパティで指定する。サイズを指定することによって、ブラウザーは画像ファイルのダウンロードが完了する前にレイアウトを計算できる。結果、ページの表示にかかる時間は短縮される。 ●記述例：HTMLのwidth属性、height属性を利用した場合 <img src="web+directions+east.png" alt="画像 Web Directions East ロゴ" width="100" height="100" /> ●記述例：CSSのwidthプロパティとheightプロパティ利用した場合 img{ width: 100px; height: 100px; } このとき、画像自体のサイズとHTMLで指定するサイズを一致させることが大切だ。たとえば、200×200ピクセルの画
W3C勧告に忠実なHTMLエディタ兼ブラウザ「Amaya 10.0」 | パソコン | マイコミジャーナル
SVGの編集など他にない機能を備えるHTMLエディタ兼ブラウザ「Amaya 10.0」 World Wide Web Consortium (W3C) は2月29日、Webブラウザの機能も備えたオープンソースのHTMLオーサリングソフト「Amaya 10.0」 (3月3日時点の最新バージョンは10.0.1) をリリースした。同チームのWebサイトでは、各種UNIX系OSに対応するソースコードのほか、WindowsとLinux、Mac OS X向けのバイナリパッケージが公開されている。 今回のリリースでは、HTML 4.01とXHTML 1.0、XHTML Basic、XHTML 1.1、HTTP 1.1、MathML 2.0の一部、そしてCSS 2の多くの機能とSVGの一部をサポート。ツールバーやパレットのデザインが一新されたほか、コンテキストメニューにはリンクの操作やカット / コピーと
ez-HTML
充実したカスタマイズ、正確な入力支援、XHTML形式出力も記述ができる高機能・次世代HTMLエディタ。 開発開始からの累計ダウンロード数が100万本を突破しました（2022月4月5日）。 最新版(ver 7.71)をダウンロード！ (2.20MB) 2005年度 VECTORベストオンラインソフトウェア賞を受賞、 2007年度 Greva!プラチナ賞を受賞しました。 Index 市販の「ウェブサイト制作ツール」（以下WYSIWYGと省略）は画像なども簡単に挿入でき、レイアウトなども簡単にできますが、その反面font要素を乱用したり何度も編集している間ゴミのようにタグが残ってしまうという問題点があります。 当ソフトウェアは主に手打ちでHTMLソースを記述する人向けのために開発されています。 また、WYSIWYGで制作したHTML文書のちょっとした編集などにも使う事ができます。 また、このHT
[Think IT] 第1回：携帯サイトとPCサイトはここまで違う！ (1/3)
XHTML Mobile Profileに対応したHTML 本連載では、「PCサイトを制作してきたけど、携帯サイトは初めて」といった企業や個人クリエイター向けにPCとモバイルの違いなどをふまえ、携帯サイトを公開するまでの入門的なノウハウを紹介していきます。 まず、今回はHTMLの種類やタグ、CSSなど携帯ブラウザによる違いと、画面サイズやキャッシュ容量などの端末による違いについて紹介していきます。 では、早速携帯サイトを作る上でマークアップの基本となるHTMLについて説明します（図1-1）。携帯電話はPCと比べても非常に早い進化を遂げてきたため、どれも基本はHTMLを基準に作られていますが、携帯ブラウザ（iモード、EZweb、Yahoo!ケータイ）で表示可能なHTMLの仕様には実に多くの種類が存在します。 現在市場に出回っている機種ということに限定すれば、XHTML Mobile Prof
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
