読者です 読者をやめる 読者になる 読者になる

ホームページ制作講座

ホームページ制作のHTMLやCSS、JavascriptやDTDとかDreamweaverなどWEB制作について

制作費用が明瞭にわかるWeb制作サービス

ホームページ制作で疑問を持たれやすいことのひとつに費用の内訳がある。 ひどいところだと同じ作業内容で、顧客によって費用が違うWebコンサルティング会社も存在する。 その点、Webデザインの良質ホームページ制作、WordPress、スマホサイト・レスポンシブ…

jQueryって

jQueryについての説明になります。jQueryはオブジェクト型スクリプト言語JavaScriptライブラリの1種についての説明になります。 詳細については、John Resig(ジョン・レッシグ)氏によって開発・公開されており、バージョンは1系と2系に別れており、それぞ…

CSS heightとwidthプロパティのvh/vw/vmin/vmaxの知識

CSS heightとwidthプロパティのvh/vw/vmin/vmaxに関係のある知識が必要な場合は、サーチ検索では下の関連キーワードで検索してもよいでしょう。 CSS heightとwidthプロパティのvh/vw/vmin/vmaxについてより理解を深めるための検索キーワードの組み合わせには…

OGPとは

OGPに関する知識が必要な場合は、サーチ検索では下の関連キーワードで検索してもよいでしょう。 OGPについてより理解を深めるための検索キーワードの組み合わせには、ogp 測定器ogp 画像 サイズFacebook ogpTwitter ogpWordPress ogpogp 画像測定器ogp スマ…

パララックスサイトの致命的な問題点

何年か前から、爆発的ではないものの、緩やかに見ることが多い縦型動的視差効果のサイト、いわゆる”パララックス”なサイト。 こういったWebサイトについては、実はフルフラッシュサイトを結構見かけたときと似たような印象があります。 端的にわかりやすくい…

ホームページ管理・更新のWebry-更新無制限-Web広告

ホームページ管理・更新のWebry-更新無制限に関係するサービス・商品のWeb広告は、Yahooサーチ検索では下の関連キーワードで検索してもよいでしょう。ホームページ管理・更新のWebry-更新無制限についてのWeb広告の情報をより知るための検索キーワードに、Ya…

画像のtext-align:centerが効かない時の解決方法

ブロック要素内でimgタグをCSSでtext-align:centerで指定しても、ブロック内の中央に配置されない。テキストを配置した場合には正しくセンタリングされるのである。 imgタグのCSSセレクタにdisplay:blockプロパティが指定されていたので、優先度の高いセレク…

別ページ内へのアンカーテキストリンクがずれるの解決方法

別ページへのアンカーテキストリンクについての解決方法。アンカーテキストリンクで別ページの所定の場所にリンクしたいとき、なぜかID指定した場所に移動しないのである。今回の問題としては、JQueryによる画像制御部分がページ内に存在していたため、heigh…

Retinaディスプレイの情報

Appleについての情報。 Retinaディスプレイ(レティナ Display)とは、アップル社製の高精細ディスプレイが搭載されたモデルの呼称、もしくはディスプレイ本体のことで、「網膜」の意味をもつRetinaは、人の肉眼で識別できる限界を超える描写が可能なことに…

Photoshopで半角小文字のアルファベットが入力できないの解決方法

アルファベットの小文字入力についての解決方法。急にアルファベットの小文字が入力できなくなった。capsロックかなと思い、Shift+CapsLockで変換してみるが、大文字のまま小文字になるのである。見慣れない項目が押下されているので、こちらの設定を元に戻…

CDNの知識

CDN

"CDNに関係のある知識が必要な場合は、Yahooサーチ検索では下の関連キーワードで検索してもよいでしょう。""CDNについてより理解を深めるための検索キーワードの組み合わせには、cdnとはcdn$mfc-870cdnBrother mfc-935cdnp6026cdnmf8350cdncdnとは?p2p+cdnmf…

async属性の非同期処理JavaScriptの知識

async属性の非同期処理JavaScriptに関係のある知識が必要な場合は、Yahooサーチ検索では下の関連キーワードで検索してもよいでしょう。 言葉の組み合わせ"async属性の非同期処理JavaScriptについてより理解を深めるための検索キーワードの組み合わせには、as…

HTML5コーディングでまず注意したいこと

CSS3ではベンダープレフィックスもそれほど気にしなくてもよい程になってきており、HTML5でのマークアップも今後はわりあい普及していくのではないでしょうか。とはいえ、別のDTDがいつどのように採用されたり、拡張されたりするのかわかりませんし、あまり…

レスポンシブデザインとWebページサイズ

Web制作の現場において、画像やリッチコンテンツのサイズなどは気にされることが多いのですが、ブロードバンドの普及によって、Webページ自体のサイズが気にされることはあまりないかもしれません。数キロバイトの違いは、もはやあまり気にする必要はないで…

DreamWeaverでコーディング高速化機能 コードナビゲータ

DreamWeaverでマークアップ作業中に、もはやCSSの編集なくしてホームページ作成は極めて難しいことが多いのですが、CSSセレクタの編集も、数が増えるとなかなかプロパティや値の修正に手間がかかってしまいます。 そこでプロユースのHTMLエディタDreamWeaver…

JavaScriptのdocument.writeがHTML5で非推奨のときにとる対策

さてJavaScriptでテキストや値をHTML上に書きだすときに、document.write("テキスト"); などの記述はよく使われてきましたが、HTML5ではdocument.writeは非推奨とされています。document.writeはブラウザのレンダリングに悪しき影響を与えるとして、HTML5の…

アウトラインとHTML5でのsection/articleの違いなんか

xhtml1.0ではかなり構造化を意識した記述がデフォルトになりましたが、セマンティックといういみでは、まだまだdivとpタグ、リストタグが多用されるだけで、厳密にはソースコードの構造からは文章構造を読み取ることができませんでした。HTML5になり、文章構…

新しい高品質画像形式BPGに関する記事

画像品質をある程度保ちながら、画像サイズを同程度のJPEG画像に比べ、概ね半分以下のファイルサイズで作成できる新たな画像形式「BPG」。「BPG」はFabrice Bellard氏により開発された新しい画像形式です。可逆圧縮やアルファチャンネルにも対応し、色空間の…

箇条書きリストul,ol,dlタグの意味と使い方について

HTMLタグで文法上箇条書きで使用されるのは、ulタグ、olタグ、dlタグが主に利用されますが、これらのリストタグの意味と用途について。● ul(Unordered List)ul(アンオーダードリスト)タグは..........● ol(Ordered List) ol(オーダードリスト)タグは、順序…

CSSセレクタのプロパティの値inheritに関する記事

CSSプロパティ値でたまに"inherit"なる値が設定されていたりする。inherit(インヘリット)とは、『継承』という意味で、このセレクタの親要素のプロパティ値を強制的に継承させるという意味です。継承させたい同一のプロパティ値が大量にある場合は有効ですが…

ベンダープレフィックス記述方法についてのわかりやすい説明

CSSプロパティにはブラウザ独自の拡張機能が実装されていたり、CSS草案段階で先行して実装することがあるため、拡張機能であることを明示するための記述がベンダープレフィックスです。 ベンダーとは提供元や売り手を意味し、プレフィックス(Prefix)とは接頭…

ユーザーエージェント(UA)文字列をわかりやすく説明

UA(ユーザーエージェント)とは、一般に情報アクセスの方法を意味しますが、Webにおいてのユーザーエージェントとは、HTTPユーザーエージェント(HTTP_USER_AGENT)ことや、それを識別するための名称文字列を意味する。 HTTPユーザーエージェントといった場合…

新しい通信プロトコルSPDYとHTML/2.0

2010年6月リリースのChromeから標準で搭載されている通信プロトコル技術、SPDY(スピーディー)について。 Google独自の技術として採用された技術ですが、IETF(インターネット技術の標準化を推進する任意団体です)によってWeb標準の仕様化がすすめられています…

記号、点3つの文字…の読み方と入力方法について

小さな・(中黒)三つ続いた2byte文字『…』の読み方と入力方法について。 まず『……』ような文字列をリーダーもしくはテンセン、ロクレンテンといい、『------』のように小文字の横棒が続く文字列を破線リーダー、テンセンと読みます。 『‥』二点リーダー、テン…

レスポンシブデザインモードを切替ためのショートカット-Firefox Developer Edition

簡易的なエミュレータとして役立つFirefox Developer Edition。 レスポンシブデザインモードを利用すれば、スマホサイトやフィーチャーフォンサイトの簡易的なビューアとして利用できるので便利です。レスポンシブデザインモードのショートカット―キーは....…

target属性blank問題?についに終止符を。

さて、HTML5やCSS3などが最近では割合使いやすくなりましたが、W3Cや体制盲従論者などを巻き込んで、HTMLやCSSについて、やれこの記述が正しいとか、W3CやWebスクールの先生がいってるので間違いないとか、わりとどーでもいいことでかなり得意げな感じで勝ち…

co.jp com net jpドメインの違いと意味、費用

インターネット上のホームページURLであるドメインには、トップレベルドメイン(ドメイン名最後の項目)に『co.jp』『com』『net』『jp』などありますが、その違いとメリット、年間費用について。まず大きな違いについては、年間費用や用途、取得条件がこと…

Dreamweaverのリンク切れチェック機能の活用

アンカーテキストのリンク先がない場合、いわゆるリンク切れのときにはいくつかのデメリットがあります。・顧客に注意を受ける・検索エンジンからの評価が微妙に低くなる・閲覧ユーザーをがっかりさせるなど。リンク切れのチェックはDreamweaverを利用しての…

ポスター印刷で販売促進と経費削減

ポスター印刷について。 近年では、販売促進の手法も随分様変わりしている部分もありますが、いかんせん費用対効果が見えずらく、場合によっては新興広告分野はまだまだ吹っかけられたり、高額だったりします。 そんな中で100年以上の歴史がある街頭広告は、…

不用品回収業者にどうして依頼するのか

不用品回収 大阪の記事。 日常生活や一般的なビジネスには、必ず不用品や粗大ごみなど、特別な方法をとりお金を払わないと回収できない物がたくさんありますが、そのような需要に合わせて、近年では行政の処分以外にも、沢山の不用品回収業者が開業していま…

セブ島へ留学 - 英語英会話スクール

最近、英語や英会話の語学留学先として日本でも注目を浴びているのが、フィリピン・セブ島への語学留学です。■セブ島 留学 についてなぜビーチリゾートのセブが注目されているかというと、大きく3つの理由が挙げられます。》ポイント1.留学費用が安く済む 海…

FirefoxのJavaScript有効と無効設定

以前のバージョンでは、オプションからの設定が可能だったのだが、最近のバージョンではプラグインあabout:configからしか設定できないらしい。アドレスバーに、『about:config』を入力して、警告画面を確認して、設定項目一覧の画面をブラウザ上のウィンド…

LightboxでIEの背景が黒で透過しない不具合の対処、解決方法

Lightbox(JQuery)を利用して、サムネイルをクリックすると大きな画像を表示させるスライドショーを利用してみる。Firefoxでは問題なく、大きな画像が表示されると、外側の背景は元のページを黒で透過させて背景ページが見えている。ところがIEで表示させると…

アンカータグ属性rel="nofollow"について

あるサービスサイトのブックマークを見ていたら、rel="nofollow"と自動的にされていた。記憶によれば、これはリンクジュースなどの流出を防ぐために、...............................させるための記述だったような。Googleサポートの情報をもとにすると、や…

Google Maps API コントロールセットのカスタマイズ - ホームページ制作講座

Google Maps APIのコントロールセット、地図の左上にでている拡大縮小のボタン類などの表示・非表示、有効・無効などのカスタマイズのまとめです。■コントロールセットの表示内容を個別設定するコントロールセットの個別表示は以下の設定で可能です。表示・…

Dreamweaver一括置換でアンカーリンクのみを外す

ワイルドカードを利用したDreamweaverの一括置換の応用で、異なるリンク先とアンカーテキストのたくさんのリストのアンカーリンクを一括で削除します。これはテーブル内にある大量にあるアンカーテキストとアンカーリンクがすべて別々のテキストとリンク先UR…

丸数字(丸付き数字)の①②③機種依存文字の数値参照の入力方法

①②③機種依存文字は意外とそのまま変換してそのまま入力してしまい、あとで端末を変えて閲覧したときに文字化けに気が付いたりすることがあります。機種依存文字は参照文字で必ず入力するようにクセをつけておくとよいでしょう。丸数字は数値文字参照で以下の…

18禁マーク無料ロゴダウンロードAI/PDF

アダルトサイトなどの入り口で見かける18禁マークのロゴを無料でダウンロードできるサイトを探してみる。特に用途はないのだが。利用やダ.......................... ダウンロードについては》 ホームページ制作のロゴダウンロード

Javascriptでメール送信フォームいろいろなチェック

JQueryなどで簡単にチェックできるライブラリも多いのですが、シンプルなJavascriptのメールフォームチェックについて。通常の入力チェックから、メールアドレスの正誤チェック、ラジオボタンやチェックボックス、プルダウンメニューのselectタグやテキスト…

レスポンシブWebサイトデザインとは

レスポンシブWebデザイン(responsive web design)とは、Webデザインの手法を表す言葉の一つで、.....................................................................に対応させること。近年では、Webサイトの閲覧環境がパソコンだけではなく、スマートフ…

FlexSlider2スライドショーで矢印アイコンが表示されない

スマホでも利用できる多機能型JQueryスライドショー・FlexSlider2を利用しようとDLする。簡単なカスタマイズを始めると左右の矢印ボタンアイコンが表示されていない。代わりに、小さく"f002"と"f001"と小さな文字が二文字目で折り返されて四角で表示されてい…

InternetExplorerは動作を停止しました-IE起動しない

普段はほとんど使用しないブラウザ、IneternetExplorer。ある日突然IEが起動しなくなっていた。「InternetExplorerは動作を停止しました」ダイアログが表示されインターネットオプションすら見られない時の対処。どうもアドオンあたりに問題がありそうなので…

HTMLタグrole属性

HTML5からタグ属性にrole属性が追加されています。XHTML策定中の属性と予定されていたようで、HTML4.01やXHTML1.0で厳密には文法的にサポートされない属性となります。アクセシビリティを意識したHTML5マークアップでは、対応アプリなどの条件も必要になりま…

Dreamweaverソースコード行番号の表示方法

Dreamweaverでソースコードを編集する際、左側に行番号が表示可能ですが、非表示になってしまっている場合の行番号の表示・非表示の設定方法メニュー...........................を入れる。これでソースコード編集画面の左側に行番号が表示される。 詳しくは…

CSS3セレクタnth-childとnth-of-type

CSS3から追加されたセレクタのnth-childとnth-of-typeのプロパティ。 ■nth-childとは .Parents .Child:nth-child(n) と記述する上記の例では、.......を指定することができる。 リストアイテムなどの何番目だけborderを指定したいとか、背景色を変更したい場…

W3C[ダブリュースリーシー ]-HP用語

W3C(World Wide Web Consortium/ワールド・ワイド・ウェブ・コンソーシアム)とはWWW(World Wide Web)で使用される各種技術の......になる。 アメリカのティム・バーナーズ=リーにより創設され、1994年10月に設立され、.........などによって運営されている。…

Google Chromeプラグイン-FlashやJavaを無効にする方法

Google Chromeの仕様は、気が付くと変わっていたりします。 FlashプラグインやJavaプラグインを停止したい場合の方法 もしくは有効にしたい場合の方法 Chromeアドレスバーに ・・・詳しくは、ホームページ制作のWEB制作システム》 と入力してアクセスする…

vertical-align、CSSプロパティ

CSSのプロパティにvertical-align=縦方向(垂直方向)揃えの位置指定がありますが、あまり使うことがないので、結構曖昧だったりします。 vertical-alignとは、行間中のテキストや画像を垂直方向(縦方向)の揃え位置を指定するできます。 注意点はvertical-ali…

ヒラギノフォントなどのStd(スタンダード)とPro(プロ)の違い

ヒラギノ角ゴは普段何気なく使用することも多いのですが、末尾につくStnとProがあります。以外に気にせず直観的にフォントを選択していましたが、Stn(スタンダード)とPro(プロ)の違いについてです。千都フォントライブラリーサイトのよくある質問と回答集の…

JQuery使用時の$ドルマークの意味は?

ホームページ制作でも、ダイナミックな動きで演出したい機能があり、その場合、JQueryが利用されることも多いのです。その場合、JQueryの機能を利用する際に、HTMLソースコードに$マークがついた記述を埋め込む場合があります。$(function(){ $('button').r…