Flexboxを利用してよくあるレイアウトを実装したサンプル集 | NxWorld

2017/11/16 118 users Flexbox NxWorld プレフィックス 見栄え CSS

一部ブラウザ（特にIE）で若干挙動が違ったりすることもあるものの、Flexboxを利用することで今までCSSだけでは難しかった見栄えが実装できたり、よりシンプルなCSSで実装できるレイアウトが増えました。 そんなFlexboxを利用してサイト制作時によく出てくるレイアウトを実装したサンプルをいくつか紹介します。 ※以下で紹介するものは基本的にプレフィックスを省略しているので、必要があれば各自で追記... 続きを読む

ペライチも複数webページもすばやく作り始められるやつ「Rin 4」作った - MEMOGRAPHIX

2015/08/31 97 users Boilerplate memographix RIN ヤツ

Rin 4 というのを作った。 Rin 4 - A lean, gulp-based HTML and SASS boilerplate by sanographix Rin 4 は「ペライチのWebページをすばやく作り始められるboilerplate」である Rin3.0 をアップデートしたもの。 Rin は、僕が普段 web サイト制作時に使っているフレームワークというかBoilerplate... 続きを読む

弊社の制作ガイドラインをクリエイティブ・コモンズ・ライセンスで公開します | ニュース・コラム | バーンワークス株式会社

2015/02/18 74 users 制作ガイドライン クリエイティブ・コモンズ 弊社 クオリティ

バーンワークス株式会社では、Web サイト制作時における制作物のクオリティを一定に保つため、社内における制作ガイドラインを定めていますが、このガイドラインを公開いたします。 - 制作ガイドライン - バーンワークス株式会社 - burnworks/burnworks-guidelines ： GitHub ガイドラインは 「Creative Commons （クリエイティブ・コモンズ） -- 表示... 続きを読む

メモしておきたい！サイト制作時に知っておくと「意外」と役に立つこと | コムテブログ

2014/08/04 281 users コムテブログ

今回はサイト制作において毎回使うこと、意外と面倒で忘れがちなものをメモしておきます。事前に知っておくことで効率的にコーディング、納品できると思います。 もくじ ドメイン＋サーバ １．独自ドメインでHPとgmail を運用させるまで ２．コマンド ３．IP制限 CSS ４．画像の回り込み ５．marginの相殺 ６．ショートハンド ７．ビューポート設定 ８．IEでCSS3を再現 IE対策 ９．fil... 続きを読む

センス上がった！タイプ別に分けたWebデザインの参考になるサイトまとめ | コムテブログ

2014/06/30 606 users コムテブログ センス webデザイン 参考 タイプ別

サイトのデザインセンス、または操作性などが良いのか悪いのかわからない。 オシャレで洗練されたデザインにするため、少しでもセンスを上げるために色々なサイトをチェックしておきたい。 今回はただWebデザインギャラリーサイトを紹介するのではなく、ページ別・職種・動き・制作別など「サイト制作時に役立つ」くくりでまとめました。コーポレートサイトやECサイト・自社サービスのデザイン考えるとき、提案前に一度は見... 続きを読む

サイト制作時に便利なダミーテキスト & ダミー画像生成ツール | NxWorld

2014/06/06 73 users ダミー NxWorld 生成 テキスト アバター画像

サイト制作時にまだ掲載内容がちゃんと決まっていなかったり校正中だったりすると、見た目をそれっぽくしたり全体のバランスを見るためにとりあえずでダミーのテキストや画像を入れることが多いですが、それらを手っ取り早く用意したい時に便利なツールを紹介します。よくあるジェネレータツールだけでなく、疑似個人情報の生成やアバター画像を生成してくれるといったような少し変わったタイプのものもあります。 サイト制作時に... 続きを読む

サイト制作時のデザインやコードの「ぶれ」をなくすスタイルガイドを作成するためのテンプレート -Style Guide Boilerplate | コリス

2014/06/02 167 users Bootstrapベース コリス ウェブサイト プロジェクト

ウェブサイトの制作時で大切なことの一つは、デザインやコードの「ぶれ」をなくすこと。 ウェブサイトを制作する際、プロジェクトに関わる全ての人が参考にできるデザインのスタイルガイドを作成するBootstrapベースのテンプレートを紹介します。 Style Guide Boilerplate Bootstrap Edition Style Guide Boilerplate -GitHub スタイルガイ... 続きを読む

これ結構使えた！サービスサイトやWordPressテーマで使われている小技まとめ | コムテブログ

2014/05/18 422 users コムテブログ WordPressテーマ 小技まとめ 縮小 拡大

ウェブサービスサイトや最近のWordPressテーマで使われているエフェクトや小技をまとめました。今回またjQueryが多くなってしまいましたが、サイト制作時に一手間加えたくなる小技集です。 もくじ サイト読み込み時 １．画像読み込み時、ローディング画像を表示／jQuery ２．読み込み時に文字を動かす／jQuery ヘッダー ３．文字の拡大・縮小／jQuery ４．入力補助／jQuery ５．伸... 続きを読む

jQuery：よく使用される機能をまとめて実装できるプラグイン | NxWorld

2013/05/30 406 users アコーディオン 備忘録 jQuery NxWorld 散乱

引き続きjQuery関連の備忘録。スムーススクロール・タブ切り替え・ロールオーバー・アコーディオンなどといった、サイト制作時によく使われる機能をまとめて実装することができるプラグインのまとめです。予め使用する機能がはっきりわかっていれば、こういった便利なものを使用することでファイルの散乱も防げますし、管理もしやすくなりますね。紹介するプラグインの中には必要な機能だけを選択してダウンロードできたりも... 続きを読む

サイト制作時のメモ 2012年前半 | Unformed Building

2012/08/16 259 users Unformed Building

ここ最近でサイトを作ったときに思ったことのメモです。 個人的なサイトを昨年末と今年の7月に1つずつ、仕事でやったのが春に1つ(結局なかったことにされたけど)、今やってるのが1つ。 昨年末のは一応レスポンシブウェブデザイン、7月のと春のは普通のソリッドレイアウト、今やってるのがスマートフォンサイト。 昨年末に作ったものについてははてなダイアリーの方でも書いたし、内容は被るけど改めて。 全般 HTML... 続きを読む

元画像群からSprite画像とCSSを生成「Sprite Factory」 - MOONGIFT|オープンソース・ソフトウェア紹介を軸としたITエンジニア、Webデザイナー向けブログ

2011/12/28 19 users ファイル名 クラス名 MOONGIFT 特徴 指定

Sprite Factoryはクラス名に元のファイル名がつけられるので、Sprite画像は見ずともクラス名の指定がしやすいのが特徴です。サイト制作時はもちろん、その後の更新時にも利用できるでしょう。 0 続きを読む

Web サイト制作時の参考文献リスト | WWW WATCH

2007/03/31 150 users WWW WATCH 参考文献リスト 原文 web ドキュメント

完全に自分用メモ代わりですが、Web サイト制作時に参考にする機会の多いドキュメントをまとめてみました。とりあえずは仕様書関連のみ。 英語で書かれたドキュメントばかりを並べてもなんなので、参考までに日本語訳されたドキュメントも私が知っている範囲内で併記してみました。ただし、日本語訳は完全に原文との整合性を保障するものではありませんので、あくまで参考までにご利用ください。 HTML 関連 HTML ... 続きを読む