季節の変わり目特に春にはリニューアルするサイトも多かったりします。そんなリニューアルやサイト制作時に使いたいオシャレパーツを集めました。 cssSlider 名前の通りCSSだけで動くレスポンシブスライダーです。クロスブラウザにも対応してます。 WOW.sliderのようにエフェクトからカラーなど好きなように選んで設置できるので、html&CSSがよく分からない人にも簡単に設置することができます。 MockupSlideshow
![リニューアルに使いたいオシャレな動きCSS&JSパーツまとめ20選 | 楽天ティップスRakutenTips](https://cdn-ak-scissors.b.st-hatena.com/image/square/56d27a8d9b2efcf5567886ae417520430303e3c1/height=288;version=1;width=512/https%3A%2F%2Fi1.wp.com%2Frakuten-tips.com%2Fwp-content%2Fuploads%2F2015%2F03%2FCaptionHoverEffects.gif%3Ffit%3D934%252C682)
「Rubyによるクローラー開発技法」で付録か何かで書こうか悩んだ末に書かなかったのが、kimonolabsの話です。kimonolabsは、クローラー/スクレイピングをオンラインで実行できるWebサービス(SaaS)です。クローラー本を書いておいて何ですが、9割の人は自分でクローラーを作らずに、この手のサービスを利用すれば事足りると思います。(書かなかった理由は、Ruby縛りサービスの継続性とスケジュールの問題です。主に最後) kimonolabsとは? kimonolabsは、先述のとおりWebスクレイピングをしてくれるSaaSです。会員登録してChromeの拡張をいれれば、すぐに使えるようになります。一般的に、Webスクレイピングする場合は、次のような手順が必要です。 対象ページのダウンロード ダウンロードしたページから、特定の箇所を抜き出す 抜き出したデータの保存 対象ページのダウン
「2.5dBUTTON」はフラットデザインに似合うボタンが作れるサイトです。マウスを乗せるとポコッと立体的に浮き上がるボタンが作成できます。作ったボタンはHTML、CSSごとダウンロード可能です。 以下に使ってみた様子を載せておきます。まず、2.5dBUTTONへアクセスしましょう。 試しにボタンを作ってみました。このようにスライダーを調整するだけで色や形を決めることができます。マウスを乗せると上記のようにポコッと浮き上がります。 HTMLとCSSも自動的に出力されるので、あとはこれらをコピペすればOK。 こちらが実際に使っているときの様子です。YouTubeのロゴを作ったり汎用性が高いですね。ぜひフラットデザインのボタンを作成したいときにご活用ください。 2.5dBUTTON (カメきち)
最近のソーシャルメディアの台頭により、ここ数年において、Webは更に力を増したといえるでしょう。中でも現役の大学生が、様々なアイディアを形にし、それをWebサービスという形で発信し続けているのが印象的な人もいるかもしれません。 そこで、あなたもWebサービスを作成したいという欲求にかられるでしょう。 Webサービスを作っている人が身近にいれば、その人に聞けばよいかもしれません。 しかし、そうではない人も多いはずです。 そこで、今日は、そんなあなたがWebサービスを作成するにあたって、参考にすべき学習用の資料を5個選びました。これを頼りにあなたの思いをWebサービスに変えて、世界に届けてください。 Webサービスを作成するにあたって身につける必要があるもの 覚える必要があるのは以下のいくつかの言語です。 ・HTML ・CSS ・プログラミング言語1つ(PHP, Python, Rubyなどな
作成:2014/06/9 Web制作 > トレンド感のある動きや、洗練された見え方を実現するために、知っておきたいことや方法など。Web制作の現場で知っておくべきことをまとめました。全部取り入れるのは無理ですが、押さえておくことで今以上に見栄えのするサイトを作れると思います。ここ最近のトレンドをおさらいしたいときに。 エンジニア速報は Twitter の@commteで配信しています。 もくじ ファーストビューで使いたいエフェクト 1.ロングシャドウ 2.ポリゴン 3.ラージフォトスタイル 4.ブラーエフェクト 5.フルスクリーン動画 6.画像シーケンス 脱ビットマップ画像 7.SVG 8.Webフォントを円で囲む 配色・フォント 9.配色(フラットデザイン) 10.タイポグラフィ(フラットデザイン) 11.フォント(フラットデザイン) 効果 12.Infinite Scroll(無限スク
「プログラミング初心者だけどWebサービスとか作ってみたいなー」という淡い夢を持ちつつも日々の生活に追われてプログラミングの勉強が継続できていない今日この頃、自分と同じように「明日から本気出す」という感じでプログラミングを学ぶ気持ちがある人向けに、プログラミングを学習できるサイトをピックアップしてみました。 1. Codecademy コードの書き方を学ぼう | Codecademy 世界的に有名且つ人気がある学習サイトです。HTML+CSSやJavaScript、PythonやRubyなど、いろいろな言語を学ぶことができます。ブラウザ内のエディタにコードを記述できるので開発環境を準備する必要がありません。またユーザーがプログラミングのレッスンを作れる機能もあります。 2. ドットインストール ドットインストール – 3分動画でマスターする初心者向けプログラミング学習サイト 国内で最も有
地味な離島ライター内藤です。普段はコーダーとして仕事をしていますが、たまにはデザイナーさんのように人の目に触れる仕事もしてみたい! そこで本日は、日々の業務で見かけてこれは使えるぞと思ったtableを、独自に再構築してソースコードを公開しようと思います。 table作成時に参考になるサイト 本題に入る、その前に。XPの公式サポートも終了し、HTML5+CSS3の普及が進んでいます。今更ながら、この技術でどんなtableが実現できるのか、とてもわかりやすく説明されていたサイトをまずご紹介します。 table専門参考ページ4選 table専門の参考ページを4つほど選んでみました。 CSS3を使って美しく装飾されたテーブルの作り方|Webpark CSS3でのtableの作り方を、見た目とソースから解説してあります。 テーブル|CSSデザイン|スタイルシート(CSS)|PHP & JavaScr
Photo by Daniel Cukier コーディング転職サイトpaizaを運営している関係上、「Webサービスを作りたいけど、プログラミング言語をどこから学んだらよいか?」という質問をよく受けることがあります。今回はプログラマ視点でプログラミングを学ぶときにつまずやすいポイントと、プログラミング言語の基礎を簡単に楽しく学べるサイトをまとめてみました。 最近はオンラインでプログラミングを勉強できるWebサービスが多数登場してきているので、以前よりプログラムを学ぶコストはぐっと下がっています!! 目次 ・プログラミング言語を学ぶときに躓くポイント ・学ぶ言語を選ぶのに役立つサイト ・すぐ書きはじめられるプログラミング学習サイト ・講義型のプログラミング学習サイト ・少しコードに慣れてきてからお勧めのサイト ・さらにスキルアップするのに最適なサイト ・基礎文法をマスターしたいなら(おまけ)
作成:2014/04/21 更新:2014/10/24 Web制作 > 前回コーポレートサイト制作が捗るjQuery プラグインをまとめましたが、今回はCSS版ということで、使用頻度が高いものと、これから必要になりそうなものを、忘れないようにメモしておきます。コーポレートサイトやWeb サービスサイトでさりげなく使われているものや、今後増えそうなものなど。 エンジニア速報は Twitter の@commteで配信しています。 もくじ 横並び 1.今までの回り込み解除 2.横並びや並び順 3.均等に並べる/段組み ナビゲーションメニュー 4.多階層 ドロップダウン 5.amazon風 メガドロップダウン 6.ドロワーメニュー コンテンツメニュー 7.モーダルウィンドウ 8.アコーディオン 9.タブパネル テーブル 10.ストライプテーブル 11.レスポンシブ+テーブル リスト 12.カウント
FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ
U-NOTEトップ イベント リクルートの事業課題を解決せよ。- ハッカソン「ReHack(リハック)」で生まれた、世の中を変える9つの種
FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ
Bootstrap3超速レビュー!刷新されたグリッドシステムを理解しよう! 白石 俊平(HTML5 Experts.jp編集長) 人気のCSSフレームワーク「Bootstrap」のバージョン3が正式にリリースされました。この記事では早速Bootstrap3をレビューし、特にグリッドシステムを掘り下げて解説してみます。 フラットデザイン採用、フルレスポンシブ! Bootstrap2からの変更点のリストは、公式のリリース文を参照してください。特に大きな変更点は以下のとおりです。 フラットデザインの採用 現在流行のフラットデザインを採用しました。ただこれは「流行りに乗った」のではなく、テーマの一つとして提供されているという位置付けのようです。 例えば以下は、Bootstrap3のボタングループです。 レスポンシブWebデザインの全面採用 以前までのBootstrapは、レスポンシブWebデザイン
作成:2013/07/22 更新:2014/11/01 Web制作 > 先日、お客さんのところへ提案にいったところ、「サイトを自分でも作りたいので定期的に講習会を開いて欲しい。Wordしか分からない。」と言われました。とはいっても、自分である程度、継続して勉強しておかないと、受講する人は2回目以降の受講内容を理解出来ないし、教える人も基本知識をしっかり身につけておかないと、質問に答えることもできません。 今回はWeb製作をするなら必ず抑えるべきこと、知識「0」から学ぶ、基本的な知識を習得できるスライド・サービス・サイトをまとめました。ディレクションにもOK。メジャーなもの中心です。とはいえ量が膨大になったので、必要な部分だけピックアップして学びましょう。※スライドがないものに関しては、お役立ちリンクをつけてます。 エンジニア速報は Twitter の@commteで配信しています。 もくじ
jQueryをメインにHTML5やCSS3を使ったリッチな表現のためのテクニックを紹介。まずはパララックスエフェクトの基本から。 Webサイトの55%で利用されているjQuery はじめまして。クラスメソッドのフロントエンドエンジニア、山田です。「jQuery×HTML5×CSS3を真面目に勉強」という連載をスタートします。 2005年2月にGoogle mapsが登場して以来、Web開発者の間でJavaScriptの株は上昇の一途をたどっています。その勢いはとどまることを知らず、リッチなWebコンテンツを作るには、Flashをはじめとしたプラグインに頼るという、それまでの常識をすっかり覆してしまいました。 さらに、HTML5やCSS3も登場し、各ベンダのブラウザがWeb標準の仕様に合わせて実装の足並みを揃え始めるなど、プラグインに頼らずともリッチなUIのWebコンテンツを少ない手間で作れ
これがずっとやりたかったんだよ!すべてのソリューションはかちびとで問題ない。@shintarowfreshです。 もうとにかくWordPressでアイキャッチ画像を用意するのが面倒極まりない。とはいえ設定しないとみっともない。という2重苦を抱えていたのですが、これからは開放されます、気持ちいい!! WordPressのアイキャッチ画像に任意のデフォルト画像を登録する方法 – かちびと.netWordPressのアイキャッチ画像に任意のデフォルト画像を登録する方法 – かちびと.net 設定に必要なIDの調べ方はコチラに。 Quick Tip: Saving a Default Post Thumbnail | Wptuts+ 後はもう書いているコードをコピペして終わり、イッツダン! すると こんなかんじで、新規投稿の際、指定のデフォルトの画像がハマっているわけで。 上書きしたかったら、新し
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く