タグ

codingに関するmimosafaのブックマーク (26)

  • Thematic WordPress Theme Toolbox: 10 extremely useful hooks

    HTML5 Starter TemplateWhen starting a new project, you need a starter template. Here is a concise and clean template to serve as a basis for your HTML5 projects. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Untitled</title> <meta name="description" content="This is an example of a meta description."> <link rel="stylesheet" type="text/css" href="theme.css"> <!--[if lt IE 9]> <script

    Thematic WordPress Theme Toolbox: 10 extremely useful hooks
  • ブラウザだけでJavaScriptを書いてみよう

    先日の誕生日前にSummally(サマリー)ページをさり気なく告知したのに、Wantsリストのモノを何ひとつ貰えませんでした。 バルセロナチェアあたり誰かくれると思ったのになぁ・・・ というわけで、まだまだ誕生日プレゼント絶賛受付中のアクアです。 今回はブラウザの「コンソール」についてのお話です。 開いてみよう Google Chromeを例にさっそく見てみましょう。 ショートカットキーはWinなら「Ctrl + Shift + J」、Macは「Command + Option + J」で表示されます。 いじってみよう 試しに「a」と入力してみましょう。すると・・・ そうなんです。コード補完されるんです。Googleさん優しいでしょ。 Hello World! 定番のあれを入力しまして、 エンターキーで実行! はい、出ました。 ということで、ブラウザ以外使わずHTMLファイルも作成せずにJ

    ブラウザだけでJavaScriptを書いてみよう
  • CSSが速くかけるようになるHayakuで、世界が変わるらしい - inkdesign

    27 Nov 2012 Zen CodingもといEmmetを使いこなすとまでいかなくとも、それなりに使ってはいるが、実はCSSではあんまり活用していなかった。 というもCSSに関しては、多少Emmetや他のコード補完プラグイン(パッケージ)の支援はあるものの、HTMLよりも手グセというか、自然とプロパティなり値なりをさっさと書いてしまうし、それほどありがたい、と思えるほどでもない。 またZen Codingにせよ、Emmetにせよ、短縮形のルールが決まっているし、それらを覚えないといけないので少し大変だ。 そこでHayaku、らしい 二度見しそうな名前だが、これはHayakuというSublime Text2のパッケージ。Emmetと違い、対象になるのはCSS(とCSSプリプロセッサ)であり、前述の通りCSSの記述に関してはこれといったツールを使っていない自分でも感動した。 ちなみにHay

  • 犯してはいけないHTMLタグの過ち10個

    【追記】 HTML5ではインラインとブロックの要素分類がなくなり、代わりに、メタデータ、フロー、セクション、ヘッディング、フレージング、エンベッディッド、インタラクティブというコンテンツの種類が定義されています。 2. 画像に代替テキストのalt属性が入っていない <img src="sample.gif" /> alt属性は、Webページに表示されるすべての画像に必須の要素ですので、必ず使用する必要があります。 <img src="sample.gif" alt="サンプル" /> 必須の要素ですので、特にテキストで表示する必要がない場合でも、alt=""としておく必要があります。 【追記】 HTML5では「Images whose contents are not known(どのような内容かわからない画像)」に限り、alt属性を省略することができます。写真共有サイトにユーザーが画像を

    犯してはいけないHTMLタグの過ち10個
  • HTML5でコーディングするときに役立つ10のオンラインツール

    最近ではすっかりおなじみになりつつあるHTML5。ブラウザの問題もあり、まだ広くは利用されていませんが、徐々にその範囲を拡大しつつあります。今日紹介するのはHTML5でコーディングするときに役立つ10のオンラインツールをまとめたエントリー「10 online tools to simplify HTML5 coding」です。 Initializr 様々なHTML5コーディングに役立つWEBサービス、チートシートなどが集められていますが、今日はその中から幾つか気になったものをピックアップして紹介したいと思います。 詳しくは以下 HTML5 Demos and Examples HTML5の独自機能のDemoを試せるサイトIE、firefox、opera、safari、Chromeとそれぞれのブラウザの対応状況をチェックできます。 HTML5 Canvas Cheat Sheet – Nih

    HTML5でコーディングするときに役立つ10のオンラインツール
  • コーディングスピードはまだ上がる!! <br>Zen-Coding カスタマイズ

    コーディングスピードはまだ上がる!! Zen-Coding カスタマイズ 2011-01-20 コーディング速度が"3倍!10倍!上がる"と言われてる Dreamweaver Documents and Settings/[ユーザー名]/Application Data/Adobe/Dreamweaver "バージョン"/ja_JP/ Configuration/Commands/ZenCoding/zen_settings.js Aptana [任意で保存したZen-Codingの場所]/zencoding.js(過去バージョンのファイル名は"zen_settings.js") Notepad++ [Notepad+の場所]/plugins/NppScripting/include/Zen Coding.js HTMLの言語を修正する(ついでにインデントも) 例えばhtml:xsで展開す

    コーディングスピードはまだ上がる!! <br>Zen-Coding カスタマイズ