タグ

htmlとwebデザインに関するokipooのブックマーク (3)

  • コーディングのスピードを上げる為の6つの方法

    2017年7月25日 Webサイト制作, 便利ツール 今より少しでもコーディングを早くできれば、細かいデザインや機能にも時間をかけて取り組めそう…という事で今回はコーディングのスピードを上げるためにできる事を紹介します。便利なツールを使ったり、ちょっとやり方を変えるだけでより早くコーディングができるようになると思います! ↑私が10年以上利用している会計ソフト! 1. コーディング手順を簡略化する これは自分のコーディング能力を高めて手順を省く、便利なツールを使って手間を省くという事です。例えば私は昔このような手順でコーディングを進めていました。 CSSのレイアウトをノートに書き出す レイアウト部分(ヘッダー・メイン・サイド・フッター)のHTMLマークアップ CSSでレイアウト部分のスタイリング 表示確認 うまく表示できない箇所の修正 ヘッダー内のHTMLマークアップ CSSでヘッダー内の

    コーディングのスピードを上げる為の6つの方法
  • ez-HTML

    充実したカスタマイズ、正確な入力支援、XHTML形式出力も記述ができる高機能・次世代HTMLエディタ。 開発開始からの累計ダウンロード数が100万を突破しました(2022月4月5日)。 最新版(ver 7.71)をダウンロード! (2.20MB) 2005年度 VECTORベストオンラインソフトウェア賞を受賞、 2007年度 Greva!プラチナ賞を受賞しました。 Index 市販の「ウェブサイト制作ツール」(以下WYSIWYGと省略)は画像なども簡単に挿入でき、レイアウトなども簡単にできますが、その反面font要素を乱用したり何度も編集している間ゴミのようにタグが残ってしまうという問題点があります。 当ソフトウェアは主に手打ちでHTMLソースを記述する人向けのために開発されています。 また、WYSIWYGで制作したHTML文書のちょっとした編集などにも使う事ができます。 また、このHT

  • Google chromeによる 楽々htmlデバッグ css・javascriptなども - The Voyage of a neuromancer

    chromeにはfirefoxのfirebugのパクリみたいなのが標準装備されている。最近はIE8にも似たようなのが搭載されたり。 はてなのデザインの改良なんかに凄く重宝しているので、その使い方などを紹介。(もちろん普通のwebサイトでもOK) 改良したい部分(又はその近く)を右クリックして「要素を検証」を選択すると、こんな画面が表示される。Developer Tools。 左側のソースにカーソルを合わせると、要素ごとにブラウザ上のどこに対応しているかがグラフィカルに表示される。要素をクリックすると、右側には適用されているスタイルシートが分かりやすく表示され、ダブルクリックすると値を編集出来る様になっている。編集した内容は即座に反映される。"Metrics"をクリックすると、margin,border,padding,width,heightなどがいくつになっているか表示され、やはりダブル

    Google chromeによる 楽々htmlデバッグ css・javascriptなども - The Voyage of a neuromancer
  • 1