タグ

関連タグで絞り込む (14)

タグの絞り込みを解除

HTMLに関するsaekiemiのブックマーク (25)

  • 1時間で携帯サイトをスマートフォン対応にする方法 | GREE Engineering


    初めての投稿となります。エンジニアのmatsuです。 携帯向けウェブサイトを1時間でスマートフォン対応する方法を紹介します。 概要 2011年4月7日のニュースにて携帯電話の新規契約数のうち、スマートフォンが占める割合が50%を越え、スマートフォンが本格的に普及する兆しが見えてきました。 現在、スマートフォン向けサイトを新規構築するためのチュートリアルは数多く出ていますが、既存の携帯サイトをスマートフォンに最適化する方法があまり紹介されていないのでこの記事で紹介したいと思います。 このチュートリアルを行うと以下のようになります。 実装 全部で8ステップあります。 このチュートリアルではブログのトップページを例にとって説明します。 前半では文字コードの変更、HTMLの変更といった構造を変更します。後半では絵文字や文字スタイルを行い、仕上げとしてHTML5のバリデーションを行っていきます。最初
    1時間で携帯サイトをスマートフォン対応にする方法 | GREE Engineering
    saekiemi
    saekiemi 2011/04/26
    携帯サイトを持ってたらこれ試してみたい。やりたい超やりたい
    リンク

  • kanmisikou.net - 初音ミク フォント 制作 志向 甘味 ニコニコ 感性 状況 リソースおよび情報

    This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

  • Wireframe Showcase

    Greenlight App Design Creative Navy Greenlight App Design Project Information: The mobile application enables people to submit incidents in the workplace.…

    saekiemi
    saekiemi 2010/12/22
    ウェブサイトのデザインを、そのワイヤフレームと共に紹介しているサイト。面白いし参考になるなあ。
    リンク

  • 永久保存版！？携帯コーディング、これだけ読めばすぐできる！ | KAYAC


    マークアップエンジニア︵以下、ME︶のtacamyです！(`・ω・´) カヤックでは、デザイナーもHTMLコーディングをしてくれています。 ︵いつもありがとうございます！︶ そんなワケで、本格的にHTMLコーディングはしないけど、 ちょこっとしたページなら組みますっていうデザイナー向けの、 ﹁コレだけ読めばすぐできる﹂シリーズを始めました。 第一回は﹁携帯コーディング﹂についてです。 携帯はPCとは全くの別物なので、なんとなく敬遠しがちですが、 最低限の内容であれば覚えることも少ないですし、 一度覚えてしまえばスタンダードがしばらく変わらないので、覚えておいて損はないですよ！ 携帯コーディングの基本 基礎の基礎 文字コードはShift-JIS CSSはインラインで指定︵タグに直接style属性を追加する︶ 画像を含むページ容量100KB以内︵HTML自体の容量は9KB以内︶ 画像はgifか

  • HTML5についてのおさらい｜Web制作 W3G


    Updated 2010.07.29 / Published 2010.07.29 これからHTML5を使いはじめようという方に向けたHTML5のおさらいです。HTML5の記述方法にはじまり、導入にあたって間違いやすいところや勘違いしがちなところをまとめてあります。 hgroup, header, footer要素の説明を含めた続きもあります(続HTML5についてのおさらい)。 HTML5の記述方法 まず最初に、必ずDOCTYPE宣言を行います。HTML5には公式のDTDがないので、すごくシンプルになっています。 <!DOCTYPE html> 続いて、html要素にドキュメントの言語を宣言します。 <html lang="ja"> そして順番にhead要素ときて、文字エンコーディングの指定ですが、charset属性が新たに利用できるようになりました。 <meta charset="UTF
    HTML5についてのおさらい｜Web制作 W3G

  • シンプルなテキスト・HTMLエディタ Crescent Eve (フリーソフト)


    Crescent Eve はシンプルなエディタです。 こだわりの基本機能とHTML編集機能を持っています。 ︻雑談︼ ある日のふとした疑問 ～ HTMLを書く道具 ～ ある日、メモ帳等のテキストエディタでHTML書いている人が意外に多いことに気がつきました。 ﹁多機能で優秀なHTMLエディタは沢山あるのに、なぜかな﹂ ﹁もしかして、軽くてシンプルなSDI形式のHTMLエディタが求められているのだろうか﹂ ﹁よし、作ってみよう！﹂ ﹁あくまでシンプルに、テキストエディタとしても使えるようにして、タグはキーボードから自然に入力補完できるようにしよう﹂ ﹁手作業でタグを打ち込んだら間違いが出るから、文法チェック機能をつけよう﹂ ﹁文字コードの自動認識は、絶対失敗しないようにしよう﹂ ・・・というような考えから Crescent Eveを開発することにしました。 その後 公開以来、多くの方に好評を
    saekiemi
    saekiemi 2010/05/20
    シンプルで分かりやすいのに超高機能。エディタはこれ以外考えられません。
    リンク

  • 覚えて良かったCSSテクニック « zaru blog

    ここ最近、覚えてよかったなーと思ったCSSテクニックをまとめてみる CSSテクニックは時代とともに変わっていくけれど、ここ1年ほどスタメンレベルで使うCSSテクニックが絞られてきたので、ここらでちょっと個人的にもまとめておこうかと。 liボックス 幅：190px マージン：15px liボックス ダミーテキスト。ダミーテキスト。ダミーテキスト。ダミーテキスト。ダミーテキスト。 liボックス ダミーテキスト。ダミーテキスト。ダミーテキスト。ダミーテキスト。ダミーテキスト。 <li>にはクラスを指定せずに、左右にぴったりくっ付くように配置が可能。 <style type="text/css"> #box1{ width: 600px; } ul{ width: 615px; margin: 0 -15px 0 0; overflow: hidden; _zoom: 1; font-size:7

  • 少しのコードで実装可能な20のCSS小技集


    2019年5月17日 CSS CSSハックに続き、このCSS小技集も私のブックマークにずらりと並んでいたので、整理も兼ねて記事にしてみました。CSSのお勉強を始めたばかりの頃にブックマークしておいたものも多数。。ということで初心者さんからベテランさんまで参考にしてみてください！ ↑私が10年以上利用している会計ソフト！ コードはサンプル内の﹁HTML﹂や﹁CSS﹂タブをクリックしてくださいね！ 少しのコードで実装可能なCSS小技集 シリーズ ︻第2弾︼少しのコードで実装可能な20のCSS小技集 ︻第3弾︼少しのコードで実装可能な15のCSS小技集 まずはCSS基礎編 1. divを中央揃えにする ほとんどのサイトが基準となるdivを画面の中央揃えに設定しています。左右のmarginをautoにして中央揃えに。 See the Pen Center Div by Mana (@manabox
    少しのコードで実装可能な20のCSS小技集
    saekiemi
    saekiemi 2010/04/15
    おさらい的に
    リンク

  • Onixslot88: Situs Judi Slot Online Terbaru RTP Gacor Hari ini Resmi 2024

    Salah satu aspek yang membuat Onixslot88 unggul adalah tingkat RTP (Return to Player) yang gacor. Tingkat RTP yang tinggi menjadi daya tarik utama bagi para pemain yang mencari peluang besar untuk meraih kemenangan. Dengan menawarkan persentase kembalian yang lebih tinggi, Onixslot88 memberikan keuntungan tambahan kepada para pemainnya, menciptakan lingkungan di mana peluang besar menanti. Keamana

  • css-lecture.com

  • https://css-tricks.com/examples/CleanCode/Beautiful-HTML.png

    saekiemi
    saekiemi 2009/11/10
    美しいHTMLの条件
    リンク

  • bodyに設定しておくと便利な3つのポイントとおまけ｜CSS HappyLife

    CSS（スタイルシート）でbodyに設定しておくと便利な5つのポイント - デザインウォーカー | DesignWalker - ロサンゼルスで働くウェブデザイナーの日記を読んで、ボクなりな最初に指定して置くと良いポイントを上げたくなったので書いちゃいます。 むしろこのサイトの方向性的に有った方が便利だよなーと。 書くきっかけを頂き、感謝いたします。 ちなみに、最初に指定しておくポイントってそれぞれだと思うので、一つの参考として読んでいただければ幸いです。 最初にbodyに指定しておくと便利だと思う3つを。 body { background:#FFF url(../img/share/bg.gif) no-repeat left top; font-family:Verdana, "ＭＳ Ｐゴシック", sans-serif; font-size:80%; } じゃあ、詳細について色々書

    bodyに設定しておくと便利な3つのポイントとおまけ｜CSS HappyLife

  • もう、class名やid名で悩まないんだからっ！！｜CSS HappyLife


    class名やid名って付ける時悩みませんか？ 今でもボクは結構悩むんですが、そんな悩みを解決する為に、人さまのソース覗きまくってよくあるclass名とid名を拾ってきました。 これで、チョットだけ作業効率アップ！？ 2010年6月10日追記‥ この記事自体、2007年1月15日に書かれてるんでかなり古いです。 あくまでも参考程度に留めてもらうのが良いかと思います。 今だったら、html5の要素を参考にしたりして付けるのが、今後の事を考えると良いのかなーと思います。 また、善し悪しの判断はせずに公開しているものですが、位置に関するのは仕様変更に弱くなるのでオススメはしません。 全体に使えそうな感じ wrap wrapper top-wrapper wrapperAll frame mframe all-frame container page pagetop all allContent
    もう、class名やid名で悩まないんだからっ！！｜CSS HappyLife

  • これはもう使用しない方がいいウェブデザインのトレンド


    昔流行ったけど、これはもう使用しない方がいいものや人気がすたれているウェブデザインのトレンドをWeb Design Ledgerから紹介します。 Most Used and Abused Web Design Trends of All Time 以下、その意訳です。 過激な表現も一部あるので、留意ください。 はじめに 鏡面反射 アクア フラリッシュ コーヒーカップ 地球 コミックフォント ストックフォト ペーパー ポラロイド 特大のRSSアイコン 音の自動再生 カウンター マーキー ブラックの背景 スプラッシュページ スキップの無いイントロ ブラックの背景 はじめに トレンドは、ウェブデザインにおける良くないキーワードではありません。実際に、下記のリストのものはその時々でウェブデザイナーを鼓舞させました。これらのアイデアは影響が非常に大きくかったので、大量のクローンが作りだされました。
    saekiemi
    saekiemi 2009/10/08
    胸にグサグサ突き刺さるぜ！
    リンク

  • はてな[日記タイトルを画像にする・日記タイトルに背景画像を入れる2]


    調べたい部分をクリックしてください。日記のテーマによってちょっと見栄えが違うと思いますが、勘で補ってください。日記画像は﹁はてなダイアリー日記﹂からです︵元画像︶。 ︵2004年9月25日作図︶ ※まだ作図できてませんが、とりあえずはてなダイアリーガイド﹁CSSセレクタ - profileモジュール﹂を登録します。︵2004.10.9︶
    はてな[日記タイトルを画像にする・日記タイトルに背景画像を入れる2]

  • 正規表現をいまのうちに覚えておきたい人のためのリソース集

    HTML5で正規表現がサポートされる、といったことをきっかけに、正規表現はプログラマだけでなくWebクリエイター全体のスキルとして求められていくものになっていくのではないでしょうか（参考：あまり知られていないけれど、HTML5では正規表現が使えるようになる ）。 ここではそうした正規表現の初学者や、一度挫折したけど再入門したい人、そしてより高度な内容をマスターしたいすべての人のためのリソース集を作りました。 初学者向けには「はじめての正規表現」 「はじめての正規表現」は、文字通り正規表現という言葉は知っていても中味はよく分からない、という初学者の方にぴったりのコンテンツ。紙芝居形式のプレゼンテーションで楽しく正規表現について把握できます。 はじめての正規表現 初学者の方には、次の2つの記事も手っ取り早く読めて概要を把握できますので紹介しておきます。 使うほどに良さが分かる正規表現（1/2）

    正規表現をいまのうちに覚えておきたい人のためのリソース集

  • css-eblog.com - このウェブサイトは販売用です！ - css eblog リソースおよび情報

    This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

  • ソースが公開されているcss小技11エントリーまとめ


    cssを使った小技テクニックの エントリーが様々なブログで 公開されていますが、必要な時に 探すのが面倒なのでまとめます。 ソースコードを公開している記事に 絞ってまとめています。 CSSで実装する、ちょっと凝ったパンくずリスト cssでパンくずをデザインする方法とサンプル CSSで実装するちょっと凝ったパンくずリスト CSS︵スタイルシート︶でbodyに設定しておくと便利な5つのポイント ユーザービリティ︵見易さ︶を考慮したbodyに設定する。CSS HappyLifeさんも 記事を参考に別コードを公開。 CSS︵スタイルシート︶でbodyに設定しておくと便利な5つのポイント CSSだけでフレームを作るテクニック frameタグを使用しないで擬似フレームを作成。IE6対応。 CSSだけでフレームを作るテクニック テキストに影を付け印象的にするJSとｃｓｓでテキストに影を付けるテクニック
    ソースが公開されているcss小技11エントリーまとめ

  • CSSで検索フォームの見た目を変更


    CSSで検索フォームの見た目を変更 ネタがなくなってきたので、このブログ内のデザインネタでも。 タイトルの通り、検索フォームをcssで見た目を変えてしまおうという内容。 このエントリの右上部分に検索フォームを置いてるわけですが、とりあえずまずは変更する見た目の画像を用意。私が用意したのはこのinputのテキストフォーム用の画像とその部分のhover時、focus時用の画像(IE6では関係ないんですが)inputのボタン部分の画像の3つ。 こいつが通常時のフォームの背景画像。 こいつがhover時、focus時の画像。 こいつがボタン(のつもり) 元々ボタン代わりの虫眼鏡アイコンはフォーム部分に被せるつもりだったのでそのつもりで書き出し。ということでこんな中途半端な感じの画像になっとります。XHTMLソース <div id="searchbox"> <form action="xxxxxx

  • 使えるCSSライブラリー - 短期集中連載 | バシャログ。

    saekiemi
    saekiemi 2009/06/19
    いい感じにまとまってるなー。活用できそう。
    リンク
  • 1 2 次のページ

お知らせ

もっと読む

公式Twitter

  • @HatenaBookmark

    リリース、障害情報などのサービスのお知らせ

  • @hatebu

    最新の人気エントリーの配信

はてなブックマーク

公式Twitter

はてなのサービス

  • App Storeからダウンロード
  • Google Playで手に入れよう
Copyright © 2005-2024 Hatena. All Rights Reserved.