「プロが作ったWebサイトのあの“技”をウチのサイトでも(それもタダで)マネしたい!」――。そんな欲求に応えてくれる JavaScriptライブラリ/フレームワークが、ネット上にはたくさん公開されています。この連載では、国内外の商用サイトの優れたUIをお手本にして、なるべくカンタンに、手間をかけずに自分のWebサイトをブラッシュアップしていく方法を紹介します。
「プロが作ったWebサイトのあの“技”をウチのサイトでも(それもタダで)マネしたい!」――。そんな欲求に応えてくれる JavaScriptライブラリ/フレームワークが、ネット上にはたくさん公開されています。この連載では、国内外の商用サイトの優れたUIをお手本にして、なるべくカンタンに、手間をかけずに自分のWebサイトをブラッシュアップしていく方法を紹介します。
moongift.jp 必見!怖くなるくらい優秀なCMS「concrete5」 らしいです。 フムフム。 なにやらよさそうなので試してみました。 日本語化ける!とかブクマされてたので日本語化対応だけついでにやろうかな〜とか思ったのだけど特に化けることは無かったです。うーむ PHPとMySQLは両方内部エンコードをUTF-8で。 ダウンロードして配置する http://www.concrete5.org/ ここからダウンロードして解答し、適当なWEBサーバー上におきます ※特にDocumentRoot直下の必要ありません MySQLの設定をチェックする my.ini(my.conf)に sql-mode="STRICT_TRANS_TABLES,NO_AUTO_CREATE_USER,NO_ENGINE_SUBSTITUTION"の記述がある場合にはコメントアウトしておく STRICT_TR
海外に見る最近のWebサイト(特にトップページ)のデザインは、縦に何段かに分かれたデザインが多い。一番上は大きな画像とともに二段構成、その下が2×2のテーブル組みなどでサービスの特徴を書き、次に横並びの3段で利用者の声といった具合だ。 今時のWebサイトっぽいデザインが簡単に まぁテーブルで組めばできないことはない。だがそれはださい、ださすぎる。CSSだけでどうにかしたい所だが、ブラウザの互換性も含めて考えるとプログラマにはとても無理だ。Firefoxで見られるように何とか組んで、IEで見たら吹き飛んでいた…なんてなったらもうやる気がなくなる。そんなことになる前に使いたいのがMaloだ。 MaloはGoogle Code上で公開されているCSSフレームワークで、GPLの下に公開されている。 Maloが実現するのは複雑な、それでいて簡単に設定できるCSSデザインだ。ヘッダとフッターを設けた上
seekAttention 注目箇所だけハイライトのアニメーションで強調。 スクロール・ドラッグなど操作関連のjQueryのプラグイン
Web標準に従うことは、SEO効果、ユーザービリティ、メンテナンス性の向上など、Webサイトの利用者と制作者の双方にさまざまなメリットをもたらします。しかし、実際にWeb標準の仕様書に従ってWebサイトを制作しようとすると、制作者の頭を悩ませる多くの問題が待っています。本連載では、Web標準のメリットを最大限に生かすことをテーマに、仕様書には書かれていない部分を中心に取り上げ、実際のWeb制作現場で起こり得る問題について、解決の糸口をたらしていきたいと思います。 はじめに Web標準に従うことは、SEO効果、アクセシビリティ、ユーザービリティ、相互運用性、互換性、メンテナンス性の向上など、Webサイトの利用者と制作者の双方にさまざまなメリットをもたらします。しかし、実際にWeb標準の仕様書に従って「正しい(X)HTML+CSS」でWebサイトを制作しようとすると、制作者の頭を悩ませる多くの
ソーシャルメディアマーケティング.jpではソーシャルメディアを活用したマーケティング手法を解説していきます。SNS、ブログ、ソーシャルブックマークなど周辺ニュースの紹介もしています。 プラグインやテーマの追加、変更はおいておいて、ブログを立ち上げたらまずやることリストをこのエントリにまとめていこうと思います。見つけたもの、思い出したものを順次追加していきます。 これもやっといたほうがいいよ!というものがあればコメントもらえるとうれしいです。 Wordpress と Movable Typeのプラグインについてはまた後ほどまとめようと思います。 12月6日1:00 追記 戦略やコンテンツについて書かれていないというコメントをはてブでもらいました。ブログを始める前に考えておくべき戦略やコンテンツ作成の方針についても後ほどエントリを書こうと思います。 12月8日11:35 追記 F.Ko-Jiの
携帯サイトを運営する上で、携帯端末のみをアクセス可能にしたい場合にサーバーに設置が必要なサーバー定義ファイル「.htaccess」を簡単に生成します。キャリアや検索エンジンのクローラーごとに設定可能なため、例えば「auは許可し、docomoは拒否」といった設定も可能です。 アクセスを許可したいキャリアやクローラーを選択し、最後に「htaccess生成」ボタンを押すと、htaccess用に書かれたIP情報(自IP含む)が表示れます。表示内容をコピーし、「.htaccess」という名前で保存した後、自分のサーバーにアップロードすれば完了です。 以下の携帯キャリアとモバイル向け検索エンジンに対応しています。 ※スマートフォンは対象外です。 携帯キャリア (5) NTT docomo, au by KDDI, SoftBank, 旧willcom(新Y!mobile), 旧emobile(新Y!m
Usability Postから、一枚の画像で、四隅が角丸のパネルを実装するスタイルシートを紹介します。 Scalable Content Box Using Only One Background Image demo 仕組みは、全体を囲む「div」と見出し「h2」に同じ背景画像を指定し、それぞれポジションを「bottom」と「top」にして配置するものです。 仕組みのイメージ 本文のテキストは、背景画像の長さ分(デモでは1000px)までテキスト量が増えても正常に表示されます。 見出しは、同じく見出しの長さ分(40px)までとなります。 追記: 下にある「Update」に、本文量がどれだけ増えても大丈夫なバージョンがあります。 demo 2
いま評判の"編集しやすい"CMS『Concrete5』とは? あなたは「Concrete5」を知っていますか? CMS(コンテンツ マネジメント システム)というと、大きく分けて3つくらいに分類される。ひとつは昔からのCMSで、PHPNuke/ Xoops/ Mambo/ Ploneなどが存在する。もうひとつはブログエンジンで、WordPress/ Movable Type/ Nucleusなどだ。そして最後にWikiエンジンだ。Yukiwiki/ Pukiwiki/ DokuWiki/ MediaWikiなどが挙げられる。Wikiを除くCMSに共通するのは公開画面とコンテンツ管理画面が分かれているということだ。ユーザの権限によって管理者とサイト利用者の画面が分かれ、管理者は管理画面にログイン後、サイトのコンテンツ編集・デザイン変更・モジュール追加などを行なう。Wikiの場合は共同編集が基
これまで多数のCMSを見てきたが、ここまで完成度が高いと言えるものに出会ったことはなかった…そう言えるくらい凄い。このどきどき感はDekiWikiに触れた時に感じたものに近い。 見たまま編集できるCMS CMSと言えば、ユーザ画面と管理画面に分かれていて、管理画面はモジュールやテーマの設定、各項目の並びを指定するのが通常だ。実際の出力結果はシステム任せで、その点が柔軟性に欠ける点でもあった。 しかしこれは違う。見たまま編集でき、さらに高い柔軟性を維持している。 今回紹介するオープンソース・ソフトウェアはconcrete5、デザイン、管理、コンテンツ作成全てが高度なCMSだ。 相当個人的な感情が入ってしまっているのは、同じようなシステムを構築する予定があったからだ。だがconcrete5は完成度も高く、多少の改造さえ施せば十分な気がする。やはり下手に開発コストをかけるよりもオープンソースで探
会社でプログラミングはしてるけど、プライベートでWebサービスを作って公開するには、どうすればいいんだか・・・という過去の私みたいな人のために。 とりあえず、前提として。 Webサービスを構築するためのある程度のスキルはある 何を作りたいかも決まっている でも、自分でゼロからスタートして公開までの段取りがよく分からん 1.開発言語、フレームワーク、データベースを決める 何はともあれ。持ってるスキルにあっているものが良いと思うけど、新しい言語やフレームワークにチャレンジするのも楽しいかも。お好きなものをどうぞ。ただ、all in oneなフレームワークだと、色々揃えなくてもいいから楽。 言語を決めたら、それに合わせた開発環境を用意して、Hello Worldが動く程度には動作を確認しておく。 私の場合は 言語はruby フレームワークはRuby on Rails データベースはpostgre
業務システムを構築する際に、一覧表を表示するという処理は多い。そしてそのデータを並べ替えたり、チェックボックスを入れたりしたいというニーズも多く発生する。場合によってはカラムを並べ替えたり、一括更新したいなんて言われることもある。 ソートも並べ替えもページネーションも全部こみこみ それを一つ一つ実装していては非常に工数がかかってしまう。そこで使いたいのがこのSigma Gridだ。 Sigma Gridはテーブルの表示とソート、データ編集などを可能にする超豪華ライブラリだ。LGPLライセンスの下に公開されているオープンソース・ソフトウェアだ。 Sigma Gridはデータの表示に際してJSONでデータを渡す必要がある。そのため既存のシステムにそのまま組み込むのは難しいかもしれない。だがその変更してもあまりあるメリットを享受できるに違いない。 画像表示とクリックアクションの例 まずカラムごと
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く