間違いやすいHTML5の要素を再確認 | バシャログ。
こんにちは。koyaです。 突然ですが、龍が如く7はプレイしましたか？ 今まで龍が如くシリーズをプレイしたことはありませんでしたが、物語の舞台が関内、伊勢佐木町だったため思わず買ってしまいました。 見覚えのある景色を走り回るのはプレイしてて楽しかったです。横浜にゆかりのある方には是非触って欲しいです。 さて、今回はタイトルの通りよく間違いを見かけるHTML5の要素についてまとめたいと思います。 僕もマークアップを始めた頃は<section>と<article>の違いなどがさっぱりだったので、初心者の方など参考にしていただければと思います。 section要素 article要素 div要素 ul、ol要素 section要素 section要素は文脈のセクション分けをするためのタグです。本で言うと目次のようなものですね。 文脈を分けるためのものなので、見出し要素(h1〜h6)が要素内に必ず
【Adobe XD】最近の主なアップデートを振り返る【2019年7月時点】 | バシャログ。
こんにちは。sitoです。最近のAdobe XDのアップデートを振り返ります。 コンポーネント ５月のアップデートから実装されたコンポーネント機能。 それまでのシンボル機能では、一部の要素だけ色やサイズを変更したい場合、別のシンボルとして作成する必要がありました。 これがコンポーネント機能の登場によって、マスターコンポーネントへの編集は全てのインスタンに適応、個別インスタンスの編集はそのインスタンスのみに適応されるようになりました。シンボルと比べて、再利用可能なアセットの編集がより柔軟なものになりました。 ガイド 待ち望んでいました、ガイド機能。 こちらの５月のアップデートから実装されています。 多角形ツール 以前の記事で、多角形を描画できるプラグインを紹介しましたが、正式に機能として実装されました。 書式設定の強化 書式設定オプションに、 すべて大文字 すべて小文字 単語の先頭のみ大文字
PhotoshopとIllustratorで角丸を作成、修正する方法を探ってみた。 | バシャログ。
こんにちは。mackyです。 今日は、タイトルにある2つのデザインツールを行ったり来たりしながら角丸という一見シンプルなテーマで掘り下げてみようと思います。 けっこう「へー」って思うところもあったのでまとめておきたいと思います。 Photoshop（環境：CS5.1） プラグインをいれてしまう。 Photoshopで角丸のオブジェクトを描くとき、単純に左のツールバーから角丸長方形ツールを選択しタブでWとHを入力、丸みも設定すれば完成。ですが、Photoshopはここからがちょっと力不足です。（※CCでは属性パネルから簡単に角丸の編集が可能になりました。参考：http://www.adobe.com/jp/jos/photoshopmagazine/howto/photoshop/rounded-rectangles.html） そんなときに使えるのが、「Rounded Rectangle
スマホサイトの矢印付きメニューをCSSのみで実装する。 | バシャログ。
こんにちは もうすぐ待ちにまったGWですね。今年は、多い人で11連休とかあるんじゃないでしょうか。そんなことしたら…もう、社会復帰できる自信がないmackyです。 さて、 そんな今日は、スマホサイトのメニューの定番デザインである、 矢印付きメニューをcssのみで実装してみようと思います。 CSSのみで実装する定番の矢印つきメニュー こんな感じです。 まずはHTMLを用意します。 HTML <ul> <li><a href="#">シーブレイン七不思議</a></li> <li><a href="#">シーブレインあるある</a></li> <li><a href="#">シーブレイン3つの掟</a></li> <li><a href="#">minamiが行く横浜うまいもの日記</a></li> </ul> css * { margin: 0; padding: 0; } a { disp
まだまだ使うよ！便利なFireworksの時短ペースト紹介 | バシャログ。
Dlifeで新たにスタートした「4400 未知からの生還者」が気になって仕方ないmackyです。Dlifeとビールさえあれば…。どうぞよろしくお願いします！ さて今日は、まだまだバリバリ使わせてもらっているFireworksの、ペーストにフォーカスしてみようと思います。 Fwの便利ペーストその① ～属性のペースト編～ 属性のことなるテキストを配置します。 一番上の属性に統一させます。 ではまず、 Ctrl+Cで統一させたい属性のテキストをコピーします。 次に、 属性を変更したいテキストを選択し、Ctrl+alt+shift+Vでペースト。すると… もう完成ですね。 ビギナーには知っておくと嬉しい時短ショートカットですね。 Fwの便利ペーストその② ～マスクのペースト編～ マスクの扱いは早めに制しておきたいですよね。 画像を用意します。 マスクしたい形のオブジェクトを描きます。 オブジェクト
2012 年バシャログ。人気エントリーまとめ [デザイナー・コーダー編] | バシャログ。
年末ですね。お正月に向けて冬眠の準備を始めた seki です。 昨日に続きまして、バシャログ。1 年の人気記事まとめをお送りいたします。 振り返ってみると、今年の流行がまるわかり！復習もかねてフムフムと読み返してみて下さい。 バシャログ。2012 年人気エントリーまとめ [デザイナー・コーダー編] 様々なイケてるUIを参考にできるサイト Google HTML/CSS Style Guide の推奨ガイドラインまとめ web高速化のためのコーダー向け圧縮ツール・サービスまとめ 【CSS】実はこんなに便利！cssのセレクタ指定方法をちょっとだけ掘り起こしてみた Illustrator の時間短縮！ウェブやチラシで使うアクセスマップの作り方 【WordPress】お問い合わせ内容も管理画面で管理できてトレビア～ンなフォームプラグインinquiry form creator フォームを改めて考え
バシャログ。[B!]新着記事・評価 - はてなブックマーク
キーボードショートカット一覧 j次のブックマーク k前のブックマーク lあとで読む eコメント一覧を開く oページを開く ✕
パートナー | WEBサイト制作 株式会社シーブレイン
Web サイト制作に必要な全工程の理解と知識 Web サイト制作に必要な全工程をワンストップサービスで提供可能。 一部の工程のみの対応でも、前後の工程に考慮した対応をします。 数百を超える Web サイト制作経験により培われた高いスキル。 効率的な制作手法による高い処理能力。 既存リソースの活用によるコストパフォーマンス オープンソースのソフトウェアやライブラリ、フレームワークなど、既存のリソースを積極的に活用することで顧客要望を実現します。 フル開発のほか、MovableTypeやWordPressなどブログシステムのカスタマイズでの対応も可能です。 データベースと連動した更新しやすい動的コンテンツや動画との連携など、ワンランク上のFLASHコンテンツを制作します。 ユーザの視点に立ち、使いやすいインターフェースデザインを設計します。 Web標準に準拠したクオリティの高いXHTML＋CS
バシャログ。のデザインをリニューアルしました。 | バシャログ。
バシャログ。をご覧いただきありがとうございます。 2007 年 2 月 1 日に公開されて以来、ずっと同じレイアウトで運営していた当ブログですが、本日はじめての（プチ）リニューアルをいたしました。 →リニューアル以前のデザインはこちら（JPG） 今回のリニューアルにより 2 カラムから 3 カラムのレイアウトに変更しました。 記事をカテゴリで分類するようにしました。 タグクラウドは FLASH で表示するようにしました。 といったあたりが変更になっています。 使い勝手など、どんどん向上していきたいと思っていますので、ご意見やご感想などいただけますと幸いです。 今後ともバシャログ。をどうぞよろしくお願いいたします。
料理上手になるための必須アイテムとテクニック
料理のテクニックを習得しよう 何回か失敗すると、自分には料理の才能がないと諦めてしまう人が多いです。 しかし練習を繰り返せば、少しずつでもスキルは上達します。 ですから諦めずに、何度も挑戦してください。 失敗が続いている人は、今まで使っていた道具や、料理の方法を見直してみましょう。 > More アレンジをしないように 初心者が勝手なアレンジを加えると、おいしくない料理になってしまいます。 それが失敗する原因なので、最初はレシピをしっかりと見て、その通りに作ってください。 ある程度の経験を重ねてから、少しずつ食材や調味料の分量を変えて、自分好みの味に近づけましょう。 > More まずは、料理に最低限必要な道具を用意してください。 鍋や包丁という道具が一般的ですが、全く料理に慣れていない人は、無理に使わなくても良いと思います。 例えば電子レンジで調理ができるように耐熱容器を購入したり、包丁
バシャログ。スタッフがWeb制作をお手伝い！「バシャログ.biz」オープンしました！ | バシャログ。
いつもバシャログ。にお越しいただき、ありがとうございます！ おかげさまで当ブログも開設から 2 年半近く経ち、沢山の方に読んでいただいてます。 これからもWeb制作についての情報をどんどん発信していこうと思いますので、引き続きよろしくお願いします。 さてさて。 このたび、バシャログ。スタッフによるWeb制作サービスをスタートしました！ その名も「バシャログ.biz」です。 今回はサイトの紹介記事にしようかと思ったんですが、やはり百聞は一見にしかず。 実際に見ていただければと思います。 実績やスタッフからのメッセージなど、ブログでは見られない一面も見られるかも？ Webサイト制作についてのご相談・お見積もりは無料で承っておりますので、お気軽にご相談ください！ バシャログ.biz - Webサイト制作・Webシステム開発ならおまかせください
パートナー | WEBサイト制作 株式会社シーブレイン
Web サイト制作に必要な全工程の理解と知識 Web サイト制作に必要な全工程をワンストップサービスで提供可能。 一部の工程のみの対応でも、前後の工程に考慮した対応をします。 数百を超える Web サイト制作経験により培われた高いスキル。 効率的な制作手法による高い処理能力。 既存リソースの活用によるコストパフォーマンス オープンソースのソフトウェアやライブラリ、フレームワークなど、既存のリソースを積極的に活用することで顧客要望を実現します。 フル開発のほか、MovableTypeやWordPressなどブログシステムのカスタマイズでの対応も可能です。 データベースと連動した更新しやすい動的コンテンツや動画との連携など、ワンランク上のFLASHコンテンツを制作します。 ユーザの視点に立ち、使いやすいインターフェースデザインを設計します。 Web標準に準拠したクオリティの高いXHTML＋CS
HTML をシンプルに保ちつつ、ブロック要素の段組みを実現する方法 | バシャログ。
HTML をシンプルに保ったままブロック要素を段組みする方法です。 ↑のように写真を横並びで表示したい、というケースはよくあると思います。 まず、上記の HTML ソースがこちら。 <div id="photo"> <ul> <li><img src="hoge1.jpg" alt="サンプル1" width="160" height="120" /></li> <li><img src="hoge2.jpg" alt="サンプル2" width="160" height="120" /></li> <li><img src="hoge3.jpg" alt="サンプル3" width="160" height="120" /></li> </ul> </div><!-- /#photo --> 今回のサンプルでは、ボックスと余白が以下になっています。 全体の横幅（500px）が決まっていて
短期集中連載企画： コレだけ読めばバッチリお勧め書籍紹介「第 1 回 XHTML+CSS 編」 | バシャログ。
バリバリの現場スタッフである当ブログの執筆者が、それぞれの得意分野でお勧めの書籍をご紹介する短期集中連載企画。全 8 回の予定でお送りします。 第 1 回目は 「XHTML+CSS 編」です。 STEP1 「なぜ WEB 標準に準拠する必要があるのか」 現役のデザイナーやコーダーでも「なぜ WEB 標準に準拠する必要があるのか？」を理解している人はそれほど多くないのではないでしょうか。 まだ WEB 標準が一般的ではなかった時代、当時主流だったテーブルでのレイアウト手法に慣れてしまっていた自分は、それまでに培ったノウハウとは違うベクトルの技術を覚えるために時間を割くことに抵抗がありました。 しかし、この本を読んで頭の中のモヤモヤは消し去りました。そして必死に XHTML+CSS を勉強し始めました。 この本には XHTML や CSS の実践的なテクニックはそれほど書いてありません。しかし
バシャログ。 | 横浜・馬車道で働くWEBサイト制作スタッフのブログ。
【お知らせ】バシャログ。メンバーが所属する株式会社シーブレインのWebサイト制作サービスのサイトがリ... お知らせ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
SVG画像のHTMLでの使い方 | バシャログ。
cssでPhotoshopのように画像にエフェクトを追加する方法 | バシャログ。