タグ

Web制作に関するsoma1080のブックマーク (456)

  • はてなブログ | 無料ブログを作成しよう

    来年も作りたい!ふきのとう料理を満喫した 2024年春の記録 春は自炊が楽しい季節 1年の中で最も自炊が楽しい季節は春だと思う。スーパーの棚にやわらかな色合いの野菜が並ぶと自然とこころが弾む。 中でもときめくのは山菜だ。早いと2月下旬ごろから並び始めるそれは、タラの芽、ふきのとうと続き、桜の頃にはうるい、ウド、こ…

    はてなブログ | 無料ブログを作成しよう
  • 無駄なdiv要素やclassだらけのマークアップから卒業する方法

    グリッドベースのレイアウトを作成すると、ついついdiv要素を多用してしまいがちですが、意味のあるデータにはそれに適した要素を使用し、無駄なdiv要素やclassだらけのマークアップから卒業する方法をWebdesigner Depotから紹介します。 Fight Div-itis and Class-itis With the 960 Grid System 下記は各ポイントを意訳したものです。 はじめに CSSのフレームワーク:960.gsの場合 classの乱用を避ける リスト要素の使用 画像とキャプションの使用 複数の見出しとパラグラフの使用 子要素のclassは親要素に はじめに 数年前までウェブページの設計はテーブルがスタンダードでした。そしてCSSはそれを大きく変え、今日ではCSSのフレームワークがウェブページの設計を容易にしてくれています。 しかしながら、このCSSのフレームワ

  • WEB制作、プロの無料サービス活用術 第1回 - MdN Design Interactive

    作業効率がアップする隠れた使い方教えます! WEB制作、プロの無料サービス活用術 ──デザインに使えるツール(1) クラウド隆盛の昨今、ソフトウエアと同等か、それ以上に便利な機能を持ったオンラインサービス/ツールが豊富に取りそろってきた。記事では、オンラインサービスの中でも無料利用が可能なものを選りすぐり、Web制作を6つのシーンに分類してより快適に作業するための 82の活用術の中から、Web制作に使えるデザインに特化した無料オンラインツールの活用法を13点紹介する。デザインの幅を広げ、Webサイトの質を高める実践方法を試してほしい。 Tweet [technique 01] オンラインで格的な画像編集をする 「pixlr」 [technique 02] 繰り返し用の背景画像を作成する 「Tiled backgrounds designer」 [technique 03] カラーパター

    WEB制作、プロの無料サービス活用術 第1回 - MdN Design Interactive
  • HTML/XHTMLマークアップ・CSSコーディングガイドライン | enoq(エノーク)

    HTML/XHTMLマークアップ・CSSコーディングサービス - ciqlie(シクリエ)では、コーディングガイドラインに基づいたHTML/XHTMLマークアップ・CSSコーディングを行います。このページではコーディングガイドラインの一部を掲載しております。 案件によってはガイドラインと一部異なる設計・実装を行う可能性がございますのであらかじめご了承ください。 ディレクトリ構成 命名規則 HTMLマークアップ CSSコーディング アクセシビリティ ディレクトリ構成 html ├common/ │ ├css/ │ │ ├import.css [各CSSファイル読み込み] │ │ ├common.css [各ブラウザスタイル調整定義] │ │ ├structure.css [サイト構造定義] │ │ ├editorial.css [サイト構成定義] │ │ ├component.css [サイ

  • Web制作者的 お客さんに実はお願いしたいこと(Vol.1) | マイペースクリエイターのお仕事日記―フォックス株式会社制作部のブログ

    Web制作に係わっていると、お客さんからいろいろなことを言われたりします。 また、制作に関するやり取りの中で、こちらが予想だにしないリアクションがあったりすることもしばしばで、それだけに苦労も楽しみも多いものです。 こまっちゃうな~の図(写真はイメージです…) どうしても、その業界に身を置く者とそうでない人との間には、認識の違いや感覚のギャップが存在します。 それは当然のこととして受け止めますが、それでもやっぱり、「いくらなんでもそれはやめて~」ってこともあるわけで。 これはWeb制作スタッフなら多かれ少なかれ、誰もが感じることです。いつも読んでるWebデザイナーさんのブログにも、先日こんな記事が載っていました。 『クライアントからのムチャぶり迷言集:Webクリエイターボックス』 「あ~、あるある!」といったことから、「さすがにそんな人いないよ~」という過激な内容まで… ニヤニヤしなが

  • Webサイトを作ったらまずやるべきことチェックリスト | Web担当者Forum

    今日は、Webサイトを作ったらまずやるべきことのチェックリストを紹介しましょう。サイトは作るまでも大切だけど、作ってからのアクションも同じかそれ以上に大切。 すでにサイトを運営している人は、やってないものがないか確認してみましょう。 サイト運営日記をスタートする(変更点を日付と一緒にメモしていく)XMLサイトマップを作って更新内容が含まれるようにするGoogleウェブマスターツールにサイトを登録する → https://www.google.com/webmasters/sitemaps/XMLサイトマップを登録するURLのwwwあり/なしの統一を指定するサイトリンクの表示をチェックして調整(以降随時)Yahoo!サイトエクスプローラーにサイトを登録してXMLサイトマップを登録する → http://siteexplorer.search.yahoo.co.jp/live Webmaste

    Webサイトを作ったらまずやるべきことチェックリスト | Web担当者Forum
  • 簡単作業でスピードアップ!パフォーマンスアップまとめ - EC studio デザインブログ

    以前にWeb Directions East 「パフォーマンスアップのウェブ技術 WDE-Express」で パフォーマンスアップについて記事を書きました。 今回はその記事や色々参照した・セミナーを元に実際に改善をおこなって、 どれだけ高速化したかデータ上で確認し、まとめてみました。 できるだけ手間をかけずに簡単にできる改善方法をおこなってみたので、 しばらくリニューアルの予定はないが、サイトの表示を早くさせたいという方は ぜひ試してみてください。簡単作業でパフォーマンスアップできます。 CSSのコードを短縮して書こう え?こんなこと?と思うかもしれないですが、 どんどんコードを書いていくうちに肥大していくものです。 もう一度見直してコードを軽くしていきましょう。 今回コードの見直しのために使用したサイトはclean CSSです。 clean CSSを参考にカラーコードの短縮、 不必要な

  • 直帰率を下げるには? ユーザーが直帰する4つの理由 | ウェブ力学

    自分のサイトの直帰率が気になって、直帰率を下げたいと考えている人は多いのではないでしょうか? そこで直帰率を下げる方法を単刀直入に説明したいところですが、その前にまずユーザーが直帰する理由を知る必要があります。直帰率と一口に言っても直帰する理由はユーザーごとに異なり、対応策もその理由によって異なるからです。極端な話、直帰率が高くても問題が無いケースだってあります。 ここでは、ユーザーが直帰する理由を4つに分類して対応策をまとめてみました。あなたのサイトの直帰率が高い原因はどれに当てはまるかチェックしてみてください。 反射的に「違う!」と判断される そのページを訪れたユーザーが内容をほとんど見ずに、反射的に直帰してしまうことがあります。こういった滞在時間の短い直帰はコンテンツの内容以前の問題であり、早急に改善する必要があります。 原因としては、「デザインが極端に稚拙」、「レイアウトがブラウザ

  • URLとURIの違いとは? パーツの構造・名称・意味も大解説! | 初代編集長ブログ―安田英久

    URL(Uniform Resource Locator)とURI(Uniform Resource Identifier)の構造の違いはご存知ですか? Webページのアドレスを指す場合はどちらを使うべきなのでしょう。URLを分解して「https:(スキーム)」「#(フラグメント)」「?(クエリ)」「パス(path)」などの名称・意味についても解説します。 今日は、ノウハウというよりは、豆知識を。「URL」という呼び方と「URI」という呼び方がありますが、どう違うのか、あなたはご存じですか? Webページのアドレスを指す場合は、どちらを使うべきなのでしょうか。 URLとURIは何が違うのか結論から言うと、URIとURLは同じものではありません。「URI」のほうが広い概念で、「URL」はURIの部分集合です。同様の仕組みに「URN」というものがあります。 その3つを別のものにたとえてわかりや

    URLとURIの違いとは? パーツの構造・名称・意味も大解説! | 初代編集長ブログ―安田英久
    soma1080
    soma1080 2010/03/09
    結構、混同しがち。
  • 札幌Web制作のシンクグラフィカ

    シンクグラフィカについて ようこそ。シンクグラフィカのWebサイトへ。SYNCK GRAPHICAは札幌でホームページ制作やスマートフォンサイト作成・Webサイトリニューアルやシステム開発を行なっています。ホームページのご相談・作成やメールフォームを中心としたフリーCGI・Javascriptの配布などをメインに活動を行なっております。比較的変なスクリプトを多数配布しておりますので、ぜひ色々見てください。特にメールフォームは秀逸なプログラムだと自負しております。 Web制作素材ダウンロード サイト内検索CGIやメールフォームCGI、WordPressやMTなどでも使えるUTF-8対応のメールフォーム、さらにさらに効果計測ができるメールフォーム、またランダムバナーなどのJavascript、履歴書EPSファイルなどのホームページ作成で役立つ素材を公開しております。 メールフォームプロCGI

    札幌Web制作のシンクグラフィカ
    soma1080
    soma1080 2010/03/08
    無料で高機能なメールフォーム
  • HTML5 & CSS3 ブラウザ別サポート状況

    What is an IP Address? An IP (short for “Internet Protocol”) address is a unique number assigned to every machine that connects to the internet. Nowadays, you can have multiple computers behind a router that share a single IP using Network Address Transformation (NAT). If you have ever used a wifi hotspot to access the internet, you’ve shared an IP address with someone. What’s the Difference betwe

    soma1080
    soma1080 2010/03/07
    各ブラウザの対応機能チェックリスト。これは印刷して手元に置いていたほうがいいかもしれない。
  • 12 Standard Screen Patterns

    2010 Update- 15 patterns and 80 new examples By Theresa Neil As Bill mentioned in an earlier post, we don’t want to limit this blog to just the principles and patterns found in the book. For that you can check out our Explore the Book section. In the spirit of that, I want to share an additional set of principles and patterns I have been using for RIA design. While the book takes a much more consu

    soma1080
    soma1080 2010/03/06
    サイトのレイアウト時に役立ちそうなレイアウトパターン集
  • Fantastic Content Sliders for your Inspiration

    Content sliders are extremely versatile forms of navigation that can be used to display all sorts of information, such as images, popular posts, social information and product features. Some have automatic slideshow capabilities or buttons to scroll sideways or up and down, and most of them feature a transition effect, usually a slide motion. Sliders can be great focal points on websites and blogs

    Fantastic Content Sliders for your Inspiration
    soma1080
    soma1080 2010/03/05
    インスピレーションのためのファンタスティックなスライダーまとめ
  • 日記 | ヨモツネット

    blog移行しました。新しいblogで更新を続けています。 XMLェ… text ja 2012-07-08 http://www.yomotsu.net/wp/?p=603 XMLェ… 日々の出来事2012年7月8日日曜日 ブログ作りなおそうかなーと思って、この Webサイト をみなおしてたら、Web ページのメタ情報としてダブリンコア (RDF) を混在させていたことを思い出した。バリデーターにかければ、グラフも取り出せて みたいな感じになる。でも結局あまり意味なかったです多分。いまは OGP とかありますしね。 Web ページは XHTML にしてたけど、ブログのコメントで参照先のない数値参照とか混ぜられると XML パースエラーになるし、XML だから他の語彙混在できるけど、RDF くらいしか混ぜてなかったし、XHTML 意味なかったです多分。いまは HTMLSVG 混在でき

    soma1080
    soma1080 2010/03/05
    clearfixのコードについて
  • mineoで節約暮らし✨

    mineoを契約する時の初期費用、けっこうかかりますよね…。 ①契約事務手数料・・・3300円 ②SIMカード発行料・・・440円 ①+②で合計3740円となりますが、申し込み時にエントリーパッケージ(エントリーコード)を使えば、①の契約事...

    mineoで節約暮らし✨
    soma1080
    soma1080 2010/03/04
    携帯の機種情報サイト
  • Thematic WordPress Theme Toolbox: 10 extremely useful hooks

    This page provides an overview of all important pages on CatsWhoCode.

    soma1080
    soma1080 2010/03/02
    iPhone向けサイトに使えるsnippet集
  • 今年は「表示速度最適化(RSO:(Web Page)Rendering Speed Optimization)」の元年になると思う | Webディレクションやってます blog

    Webディレクターとして名村晋治がプロジェクトマネージメントやディレクション業務に当たっている時に感じている問題解決の手法やセミナー等で話をしている内容、自身が使っているプロマネにおけるツールなどWebディレクションに関する情報の紹介しています。 2年ぐらい前からじょじょにだと思うのですが、サイトの「表示速度」について言及される事がネットの中で増えてきているかと思ってます。 もちろん、「○秒以内に表示しないとユーザーは逃げる」的な表示速度論ってのは大昔からあって、別のそれ自体は目新しい事でもなんでもありません。 ただ、その表示速度に関するレベルが冒頭の2年ぐらい前から結構高いレベルで争われるようになってきている感覚があります。 それは海外の方とチャット等で技術トークを結構しているのですが、その場でもやっぱり表示速度の向上に関する話題が増えてきている事でも実感がありました。 といった事から、

    今年は「表示速度最適化(RSO:(Web Page)Rendering Speed Optimization)」の元年になると思う | Webディレクションやってます blog
  • 国産限定・Web制作時に覚えておくと便利な14のフリーのWebサービス

    最近、国産のWebサービスも かなり勢いがあるなぁと思ったので ちょっとまとめてみました。よく 紹介されるのは海外製ですが、 それに劣らないMade in Japanの Web制作者が知っておくと便利そうな フリーのWebサービスをご紹介します。 順不同です。日語が完全に通じる海外Webサービスも今回は省いて純国産のWebサイト制作に一役買ってくれそうなWebサービスをご紹介したいと思います。出来る限り高性能だったり多機能なWebサービスのみにしたつもりですが主観入ってます。 Color of Book 国産サービスで一番多用しています。AmazonAPIを使って雑誌の表紙を抜き出し、その表紙からカラーチャートを生成。アイデアが素晴らしいですね。雑誌は表紙のデザインや色で惹きつけるよう考えられている事が多いのでWeb制作時のカラー選定にかなり参考になるのでは。 Color of Book

    国産限定・Web制作時に覚えておくと便利な14のフリーのWebサービス
  • 携帯サイト制作って何が大変なの? | 株式会社シンメトリック公式ブログ - 携帯開発から生まれる技術情報

    メール送信画面が立ち上がるようにする <a href="mailto:address@docomo.co.jp?subject=問合せ&body=メール文" mce_href="mailto:address@docomo.co.jp?subject=問合せ&body=メール文">お問合せ</a> ”宛先 :address@docomo.co.jp 件名 :問合せ 文 : メール文”としてメールを送信する画面を立ち上げます。 ボタンひとつでトップに戻れるようにページ内リンクをつくる <a name=”id”> ↑↑戻りたい場所に記載 <a href="ファイル名.html#id" mce_href="ファイル名.html#id">▲TOP</a> ↑↑リンクをつくる場所に記載 au,Softbank携帯で見て、違いを観察。 異なるキャリアの携帯でみると表示はどのように変わるのか、

  • case:MobileDesign! モバイルサイトのデザイン紹介ブログ

    case:MobileDesign! モバイルサイトのデザイン紹介ブログ 引っ越ししました。 http://case-mobile-design.com/ case:MobileDesign! モバイルサイトのデザイン紹介ブログ > 2010-02-15 >