爆速でHTMLコーディングするためのtips - Qiita
心構え ・HTMLは最小限にする ・JSも最小限。不要なら ・デザインとか全部決まってから手を付ける。 開発環境 ・リアルタイム入力補完ができるエディタ （プログラマならEcripseとかEmeditorとか、MacならCodaか） ・動作確認の InternetExplorer ＞Macで動いてWindowsでレイアウト崩れた！Windowsが悪い！ ←なに言ってんだ・・・？？ ・おまけでDreamwaver。 下準備 ・予め画像を切り出しておく。 HTMLコーディング開始 ・画像切り出しは全部後回しにして、 ZencodingでHTMLを「一気に」組む。 HTML”だけ”組む。 IDやclass名もここでつけちゃう。 ブラウザで開くとめちゃくちゃだけど気にしない。 文字も入力しない。 画像やCSSパスを設定する。 ・作ったHTMLをDreamwaverにコピペして、 Dreamwave
レスポンシブWebデザインのウェブサイトを半年運営してみて思ったこと
昨年2011年10月に仕事で運営に携わっている大学ウェブサイトでレスポンシブWebデザイン (しかもフル可変グリッドレイアウト) を導入して、はや半年。約6ヶ月間、レスポンシブWebデザイン（RWD）で制作したウェブサイトを運営してみて思ったことをまとめてみました。これからレスポンシブWebデザインを導入したいと考えている方の参考になれば幸いです。 プロジェクトの概要 大学のウェブサイトをリニューアルするにあたり、さまざまな状況や制限などを考慮、また、今後3〜5年を見据えて、レスポンシブWebデザインを取り入れた制作を行いました。大学公式ブログでもリニューアルについて紹介しているので、ぜひそちらもご覧ください。そこで書いたように、以下のような思いもあり、このリニューアルを行いました： 今回、新しい試みを行った背景には、このウェブサイトが「大学のウェブサイト」であることが大きな要因の一つとし
CSS で作るスマートフォン向け片手操作メニュー
ちょっとしたお遊びなんですが、普段は画面の下の隅に隠れてて、クリック （タップ） で展開、いくつかのショートカットメニューが表示される、しかもスマートフォンだと片手だけで操作しやすいみたいな UI を CSS と超簡単な JavaScript （jQuery 使用） で作ってみたので紹介。 久々にこの手のネタ書いた気がしますけども… ちょっとしたお遊びなんですが、普段は画面の下の隅に隠れてて、クリック （タップ） で展開、いくつかのショートカットメニューが表示される、しかもスマートフォンだと片手だけで操作しやすいみたいな UI を CSS と超簡単な JavaScript （jQuery 使用） で作ってみたので紹介。多分言葉で言っても伝わりにくいと思いますので実際のサンプルをまずは見てみてください。 CSS で作るスマートフォン向け片手操作メニュー サンプル 現在最新版の Firefox
Webサイトの制作スピードを、より向上させる目的で作られたスターターキット・99lime - かちびと.net
結構参考になったので備忘録がてら ご紹介。Webサイトの制作スピードを より向上させるために、汎用的なUI を集めて、マークアップも綺麗な状態 で済むように設計されたスターター キット、というかフレームワークです。 制作スピードを向上させる目的で作られたHTML5フレームワークです。レイアウトだけでなく、汎用的なUIも備わっていて、class名1つ付けるだけでタブやスライドショーを実装出来るようになっています。 そういった仕様にする事で、シンプルで綺麗で可読性の高いソースを保てるように設計されていたりと、結構参考になるスターターキットですよ。フレームワークは自作してるので良い部分を組み込んでみようかなと思いました。 タブやドロップダウン、スライドショーなどを備えているだけでなく、class名1つで実装出来るようになっているので、綺麗なソースを保持する事が出来るようになっています。 いろいろ
カウントダウンに関連したWEBサイトテンプレート集:phpspot開発日誌
40 Useful Under Construction Template Collection | Tripwire Magazine - tripwire magazine カウントダウンに関連したWEBサイトテンプレート集。 あまりこれまでこういうものを特集したものはなかったかも。あと何日でオープン！というページを作る際の参考にできそうです。 いざつくろうとなると、ちょっとトンチが効いてるなとか、センスあるなという物を作ろうとすると普段はあまり作らないものに関しては時間がかかりそうですが、こうしたものを参考に自分なりに組み立てた方がいいアイデアが出たりして捗りそうですね 関連エントリ お洒落なECサイトデザイン集３８ 次のサービスに使えるかもしれないロゴデザイン集２２ 奥行きをうまく使ったサイトデザイン集３０
ist-jo.in - ist jo リソースおよび情報
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.
スマフォサイトでよく見るパーツのコードサンプル集 | 07design.blog
最近スマートフォンサイトの案件が増えてきました。そこで、個人的によく使いそうなコードをEvernoteにまとめたりしていたのですが、 まだまだスマフォサイト構築のノウハウ記事も少ないですし、共有しておこうと思います。…最近スマートフォンサイトの案件が増えてきました。 そこで、個人的によく使いそうなコードをEvernoteにまとめたりしていたのですが、 まだまだスマフォサイト構築のノウハウ記事も少ないですし、共有しておこうと思います。 すべてのデモ（chromeなどのwebkit系ブラウザまたはスマートフォン実機でご覧ください） download ヘッダーの右にメニュー <h3>ヘッダーの右にメニュー</h3> <!--ヘッダーの右にメニュー--> <header class="header1"> <h1><a href="#"><img src="title.png" alt="SIT
iPhone/iPad/Android/PC対応、Webアプリの画面をドラッグ＆ドロップで開発する「Maqetta」、オープンソースで開発中
iPhone/iPad/Android/PC対応、Webアプリの画面をドラッグ＆ドロップで開発する「Maqetta」、オープンソースで開発中 Webアプリケーションの開発において、タブやボタンやスライダーなど、さまざまなコントロールを画面上にレイアウトしていくためには、これまでHTMLとJavaScriptを組み合わせた面倒なコーディングが必要でした。 それを、ビジュアル開発ツールの画面上でドラッグ＆ドロップで開発できるツール「Maqetta」がオープンソースとして開発されています。PCの画面だけではなく、iPadやiPhone、Androidなどの画面にも対応しています。 Maqettaはもともと米IBMが開発していたツールで、4月に非営利団体のDojo Foundationにオープンソースプロジェクトとして寄贈されました。 Maqetta自身もHTML5のWebアプリケーションとなって
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Lightboxサンプル