今すぐ知っておくべき！モダンな10のWeb技術
エンジニアやデザイナー、Web担当者が今すぐ知っておくべきモダンな10のWeb技術を紹介しています。Webデザインの世界が根本的に変化し、Webサイトの構築ははるかに簡単に高い技術でできるようになりました。ぜひ覚えておきましょう。 テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査 本稿は、Designmodeのブログ記事を了解を得て日本語翻訳し掲載した記事になります。 本記事は、ライターのJake Rocheleau氏によって投稿されました。
Webサイトの品質をアップさせる便利ツール＆機能のまとめ | ベイジの社長ブログ
成熟市場においては、品質の高さでは優位性を築けなくなると言われます。しかし、だから品質にこだわらなくても大丈夫、と考えるのは早計です。裏を返せば、品質の高さが当たり前になっているため、少し品質が低いだけでブランドを大きく傷付けやすい環境になっているとも言えます。 そういった考えもあって、今年行っている当社のブランド再構築活動の中では、高い品質を担保するためのレギュレーションの整備に力を入れてきました。あわせて、当社として利用する品質を維持するためのツールや機能も改めて洗い出してみました。今日はこの内容を公開させていただきます。 JavaScriptエラーを無くす JavaScriptのエラーは、大きな問題が起こっていないように見えても、大事な機能が動かなくなったり、スペックの低いマシンで極端に挙動が遅くなったりすることがあります。各ブラウザのデフォルト機能で簡単にチェックできますので、エラ
30分、JavaScriptで作るWebサービスのモックアップ - ゆーすけべー日記
Instagramは日本のユーザーも多く、日常を切り取った写真がほとんどで、 またお洒落なものも混じっているのでたまに眺めると気持ちがホッコリしたりします。 特定のキーワードでInstagramの最新の写真を検索したい時があります。 例えば、みんなが今どんな「ご飯」を食べているのか、今日の「日の出」はどのような具合なのか、 がInstagramの写真を通して分かるかもしれません。 Instagramの写真検索サービスを探してみると、 Instagram自身が検索機能を提供してないので他の第三者が作ったサービスがいくつか出てきます。 使ってみたところ、もう少し自分で見た目やら機能を変えてみたいなーなんて思いました。 そこで、「Instagramの今の写真を検索できるサービス」といういわばWebサービスを作りたい欲求にかられます。 今回はこのようなちょっとした欲求から考えた「Webサービスのモ
jQueryで画面遷移のないサイトを作ろうとしたときのちょっとしたメモ
jQueryで画面遷移のないサイトを作ろうとしたときのちょっとしたメモ jQueryを使って画面遷移のないサイトを作ろうとしたときのちょっとしたメモです。 サーバーとやり取りをする、Ajax的なことは書いていないのであしからず。 投稿日2012年02月03日 更新日2012年02月03日 リンク（href）を無効にする 画面遷移のないWebサイトでもJSのない環境やSEOも考慮して href にリンク先を設定したいときがあります。 hmtl <a href="hoge.html" id="btn">ボタン</a> このような場合だと #btn にイベントを設定しても画面遷移してしまいます。 click イベントに「e.preventDefault()」と記述すればhrefを無効にになり画面遷移が行われません。 javascript $('#btn').click(function(e){
あなたは何点？Webデザイナーのためのクイズサイト12
2014年9月29日 便利ツール Webサイト制作や色彩感覚、タイポグラフィの知識をクイズ感覚で勉強できるサイトをまとめてみました。どれも短時間で楽しみながらできるものばかりなので、気軽に挑戦できますよ！Webデザインや制作の勉強中のあなたも、ベテランさんのあなたも、ぜひ試してみてください :) ↑私が10年以上利用している会計ソフト！ 休憩時間にサクッと挑戦！ 選択問題やドラッグ＆ドロップでできるゲーム感覚な問題いろいろ！ 1. HTML/CSS HTML5実力テスト HTML/CSSコース 「実力テスト」という名のクイズサイト。HTML/CSSコースではHTML5とCSSの基本問題がクイズ形式で出題されます。制限時間は15分。「HTMLやCSSを見てどのように表示されるか？」「smallタグは何を意味するか？」などなど、問題を解きながら勉強になります！
Flash(SWFファイル)のキャッシュを防ぐ方法 | Arch
キャッシュを防ぐ方法はAdobeのサイト（http://kb2.adobe.com/jp/cps/228/228621.html）より、3つあるのですが、 ここでは『ファイル名のあとに ? でパラメータをつけてリンクを設定する方法』を使いたいと思います。 このパラメータをリロードのたびに変えることで、Flashのキャッシュを防ぎます。 ではどのように変えるのかというと、Javascriptで現在の日付と時刻を取得し、それをパラメータとして付け加えます。 Flashの表示方法は、『swfobject.js』を用いる方法が一般的ですので、これを使います。 ちなみに、swfobject.jsはこちら（http://code.google.com/p/swfobject/）からダウンロード。 まず、<head>～</head>内に時刻を取得する『reload.js』と、swfを表示する『swfo
「ノンプログラマーのためのjQuery入門」のスライドが凄く分かりやすいですね - かちびと.net
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 Twitterに流れてきたスライドがとっても 分かりやすかったのでブログでより多く の方に拡散。ノンプログラマー向けの jQueryの基本講座。これからjQuery を使おう、という方は読んでおくと良さ そうですね。 ノンプログラマー向けにjQueryの基礎をスライド化してくれています。 @pocotan001さん作のスライドです。 このスライドを見ながらコーディングする、というより、基礎知識を頭に入れるのに適したスライドだと思いますので気軽にご覧になってみて下さい。ハードルがかなり下がると思います。 また、当ブログでもjQueryプラグイン等の情報を取りあえげていますので合わせてどうぞ。 jQueryのリファレンスサイトと入門書籍 [2011.09.21アップデー
Web制作をこれから始める人の為のスキル・HTML・CSS・ブラウザ・写真素材入手の基礎情報*ホームページを作る人のネタ帳
Yamadaです。 かれこれWeb屋暦が14年くらいになるんですが、こうしてWebに携わっていると、3ヶ月周期で情報の入れ替えをしていかないと、正直追いつかないと感じます。そんな激流のようなWeb業界にこれから飛び込もうと言う新卒の方や、中途の方に送るバイブルとなればと思います。 というわけで改めて春ですし、これからホームページ（Webサイト）を作成してWeb屋さんになる方へ送るお勧めサイト集です。 後編はこちら Web制作を始める人の為のスキル・ワイヤーフレーム・SEO・マーケティング・Webサービスの基礎情報 忘れないで欲しい事 Web制作には、様々なスキルが求められます。 しかしその技術が、いつの間にか消えていったり、使えなくなったりしました。新しいデザイン、新しいコード、新しい言語、新しい環境、様々なものがあります。しかし、それらを追い続けていくうちに、一つ、とても大事な事を忘れて
jQueryでスクロールしても上に固定されるメニュー｜Webpark
よく見かけるタイプのjQueryを使ったスクロールしても上に固定されているメニューを紹介します。最近FC2ブログの上部に現れた検索バー（このブログは非表示にしてます）みたいな感じです。 <script type="text/javascript"> $(function() { $(window).scroll(function(){ var scrollTop = $(window).scrollTop(); if(scrollTop != 0) $('#nav').stop().animate({'opacity':'0.5'},400); //スクロール時 else $('#nav').stop().animate({'opacity':'1'},400); //一番上にあるとき }); $('#nav').hover( function (e) { var scrollTop =
コア・JavaScript ( JavaScript. The Core. ) - oogattaの勉強日記
この文章は、 Dmitry A. Soshnikov さんの、 ECMAScript に関する優れた記事 "JavaScript. The Core." を許可を得て翻訳したものです。世の中に、 JavaScript のブラウザ API や、実装系に関する記事は多々あれど、 ECMAScript の仕様に則って、ここまで詳しく説明してくれている記事は殆ど無いと思います。今回は翻訳できておりませんが、文中で参照されている Dmitry さんの ES3 シリーズも、読み応えのある（ ECMAScript3 の仕様の副読本としても読める）素晴らしい内容ですので、是非チャレンジしてみてください！（ご要望があれば訳します翻訳許可を頂いたので、この記事内で参照されている章から逐次翻訳を進めます！）。 ちなみに Dmitry さんは、計算機科学や数学にも明るい方でらっしゃいます。が、私は違います。極力
最近気になってきたjQueryについて色々調べてみました - もとまか日記
最近、「jQuery」というキーワードをよく見かけます。 これって何だろ？と思ったので調べてみたら、JavaScriptのライブラリのようで。 てことで、最近ちょっと気になってたJQueryについて調べてみました。 jQueryの概要 まずは難しいことは抜きにして、以下を読んでみると分かりやすいです。 はじめてのjQuery jQuery仕様関連 一応ですが、仕様について。 jQuery 日本語リファレンス 必要に応じてみればいいかな？と思ってるので、まだ細かくは見てません。 初心者向けの基礎知識、基礎講座 最初は初心者向けの記事を読んでみると良さそうです。 ASCII.jp：40分で覚える！jQuery速習講座一晩で覚えるjQueryの逆引き基礎サンプル7つjQuery事始め・コピペに頼らず、基礎知識を理解して実際に動かしてみるjQuery 開発者向けメモ サンプル、プラグイン 調べてて
これからnode.jsを始める人のためのインストール系エントリまとめ - 小さい頃はエラ呼吸
はじめに node.jsが熱いですね。 これからnode.jsを勉強したり、node.jsで何かアプリケーション作ってみたいという人のために、node.jsの環境構築（インストール）系のエントリを集めてみました。 サーバサイドJavaScript Node.js入門posted with amazlet at 14.02.16清水俊博 大津繁樹 Jxck 小林秀和 佐々木庸平 篠崎祐輔 高木敦也 西山雄也 アスキー・メディアワークス 売り上げランキング: 247,116 Amazon.co.jpで詳細を見る プラットフォーム別に分けてみましたので、お好きな環境でnode.jsに触れてみてください。ざっと眺めてみた感じ、Macでやるのが一番簡単みたいです。 Windows + cygwin Windowsでもcygwinを入れてあげてればnode.jsは動きます。 node.jsをWindo
モバイルアプリケーション開発のためのHTML/CSS/JavaScript関連技術まとめ
モバイルアプリケーションをHTML/CSS/JavaScriptなどのWeb標準技術を用いて開発するためのさまざまなツールや環境が登場しています。1つ前の記事で紹介した「jQuery Mobile」もその1つですが、それ以外のものもここでまとめて紹介しましょう。 jQuery Mobile jQuery Mobileは、JavaScriptライブラリとして知られるjQueryのプラグインです。オープンソースで提供されています。 「マークアップドリブン」をコンセプトとし、HTMLを記述していくことで、あらかじめ用意されているボタン、メニュー、ダイアログボックス、などのモバイル対応のタッチユーザーインターフェイスを備えたアプリケーションを開発できます。 クロスプラットフォームに対応し、iOS、Android、WebOS、Windows Phone、Symbianなど多数のデバイスでそのまま動作
ゆーすけべー日記
サキとは彼女の自宅近く、湘南台駅前のスーパーマーケットで待ち合わせをした。彼女は自転車で後から追いつくと言い、僕は大きなコインパーキングへ車を停めた。煙草を一本吸ってからスーパーマーケットへ向かうと、ひっきりなしに主婦的な女性かおばあちゃんが入り口を出たり入ったりしていた。時刻は午後5時になる。時計から目を上げると、待たせちゃったわねと大して悪びれてない様子でサキが手ぶらでやってきた。 お礼に料理を作るとはいえ、サキの家には食材が十分足りていないらしく、こうしてスーパーマーケットに寄ることになった。サキは野菜コーナーから精肉コーナーまで、まるで優秀なカーナビに導かれるように無駄なく点検していった。欲しい食材があると、2秒間程度それらを凝視し、一度手に取ったじゃがいもやら豚肉やらを迷うことなく僕が持っているカゴに放り込んだ。最後にアルコール飲料が冷やされている棚の前へ行くと、私が飲むからとチ
シンプルながらユーザビリティに大きな貢献。郵便番号から住所を入力補完する·js-zip2address MOONGIFT
js-zip2addressはGoogle日本語入力APIを使い、Webブラウザ上での郵便番号から住所を入力補完する。 [/s2If] zip2address.jsはJavaScript製のオープンソース・ソフトウェア。ECサイトをはじめとして個人情報の入力フォームでは一般的になってきている郵便番号から住所を引く機能。実装方法は様々だか、この郵便番号と住所の変更は意外と回数が多い。 サンプル 回数が多いということはメンテナンスコストが大きいことを意味している。都度アップデートされるだけでなく、削除されるデータも多い。そこでメンテナンスフリーで使える手法を紹介しよう。それがzip2address.jsになる。 zip2address.jsの特徴は大きく分けて二つある。一つはデータ元としてGoogle日本語入力APIを利用しているという点だ。確かにGoogle日本語入力では郵便番号を入れると住
GSkinnerの作ったJavaScriptライブラリが素敵すぎる件 | fladdict
Flash界のコーディングゴッドGSkinnerがJavaScriptのCanvasをFlashライクに使うライブラリを作った。 この人、確か僕と同い年ぐらいかちょい下なんだよね。。。会う度に超へこむ。 画期的というか、確実にかゆいところに手が届くライブラリで、下みたいなのがサクサクJSでいける。あいかわらずソースは美しいし、ドキュメントも完備。 game sparkles rollover localToGlobal globalToLocal sprite sheets ざっと見た感じFlashでいうところの、Stage, MovieClip, Sprite, Bitmap, Matrix, Stage, EnterFrameとキーフレームアニメがサポートされてる感じ。これは素敵。 このライブラリそのものもスゴいんだけどポイントは、GSkinnerがJSやりだしたってことは、365日以
リッチすぎるデータグリッド等を実装できるJavaScriptライブラリ１５:phpspot開発日誌
15 JavaScript Data Grids to Enhance your HTML Tables | Hot Scripts Blog リッチすぎるデータグリッド等を実装できるJavaScriptライブラリ１５。 WEBページに実装するグリッドを選ぶ際にかなり参考にできそうです。 スタンドアロンで動くものや、JavaScriptやMootoolsプラグインのものがまとまっています dhtmlxGrid SigmaGrid jTPS – Datatable jQuery Plugin DataTables – Data Table jQuery plugin Flexigrid for jQuery MyTableGrid OmniGrid 全部見る 関連エントリ シンプルなグリッドをレイアウトにオーバーレイ表示できるjQueryプラグイン「Griddy」 グリッドアコーディオンで新
JavaScriptを使った縦書きライブラリ·竹取 JS MOONGIFT
竹取 JSはJavaScript製のオープンソース・ソフトウェア。Webの世界（というよりもコンピュータの世界）では横書きが標準になっている。ずっと見続けていると、いつの間にか違和感がなくなっているが日本語は基本的に縦書きだ。 横書き文章をJavaScriptで縦書きに ワードプロセッサなどでは縦書きモードもあるが、それをそのままWebに反映するのは難しい。長音記号やカギ括弧などそのまま縦向きにしても使えない文字もある。そうした点を網羅した縦書き表示ライブラリが竹取 JSだ。 竹取 JSの面白いのは標準の左から右に書かれる文章をJavaScriptを使って縦書きにしている点だ。さらにそれだけでなく、長い文章の場合はスクロールが出るのだが、標準の上から下のスクロールで読み進めることが出来る。 強調は傍点に！ ルビ表示にも対応し、さらに強調表示は傍点になる。下線は左側に表示されたり、リストや画
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Site Under Maintenance
Site Under Maintenance
