サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
都知事選
www.netyasun.com
初心者でも簡単作成 Webサイト(ホームページ) パソコン インターネットの勉強、情報 NetyaSun ホームページ作成、運営ガイド ホームページの作り方 ホームページの作り方、作成ガイド ホームページの作成や運営は、敷居が高く難しく感じたり、 インターネットのセキュリティや経費の不安もあるかもしれませんが、 近年は、ブログや掲示板をはじめ、インターネット上で気軽に投稿するユーザーも多く、 少し勉強するだけで 意外と簡単に自分だけのホームページが公開出来るのです。 趣味のWEBサイトから始まり、お店や会社の宣伝や通販も可能です。 英会話を覚えるよりも簡単で、パソコンのキーボードが打てれば十分です。 ただ、難しい参考書や制作ソフトなどの細かい部分で諦めたり、 間違った知識で修正不能になる人も多々いますので、 正しく覚え無理をせずに出来る範囲で作成しましょう。 初めてのホームページ作成から運
初心者でも簡単作成 ウェブサイト(ホームページ) パソコン インターネットの情報 NetyaSun ホームページ 背景画像 表示・設置方法 HTML,CSS ホームページの背景画像 HTML,CSS,background-image 画像の表示は、htmlで下記のように記述しますが、 <img src="***.gif" width="*" height="*" alt="*"> 背景画像は、CSS background の各プロパティを利用します。 各要素毎に対して背景画像1枚の各プロパティ指定が可能。 全ての各要素に指定可能でウェブサイトデザインでは良く利用されるプロパティです。 background-color : ; background-color : ; の : ; 内に背景色を指定(画像の下に配置する色) HTML,CSS カラーコード一覧表 background-image
初心者でも簡単作成 Webサイト(ホームページ) パソコン インターネットの勉強、情報 NetyaSun 検索エンジン登録方法 Google Yahoo Bing ホームページ 作成、運営管理ガイド Google ウェブマスターツール Yahoo サイトエクスプローラー Google Analytics アクセス解析 Yahoo!アクセス解析 Google Yahoo Bing 検索エンジン 登録方法 検索エンジンの登録は、 各検索エンジンのクローラーが世界中のウェブサイトを駆け巡り 勝手にインデックス登録していきますが、ユーザーに役立つウェブサイトを探し求めています。 より早く検索エンジンにインデックスされると検索エンジンから訪問されるので コンテンツが揃い次第、Google Yahoo Bing の各検索エンジンに登録申請をしましょう。 各検索エンジンへの登録・申請・巡回要請 Goog
初心者でも簡単作成 Webサイト(ホームページ) パソコン インターネットの勉強、情報 NetyaSun 画像クリックで拡大表示 LightBox v2.05 LightBox v2.05 設置方法 画像をクリックすると、拡大画像で表示したい場合、 昔はHTMLで別ページとして表示したり、Javascriptでサイズを揃えた別窓表示が多かったのですが、 数年前頃から販売(ショップ)サイトなどの商品表示で、お洒落に表示(動作)する方法が増えてきました。 定番のJS、CSS、jQuery、LightBox、何が良いでしょう? 手っ取り早いのは、JavaScriptアプリケーション 定番のLightBox LightBox v2.05 の表示/動作をみてみましょう(下記リンクをクリック) LightBox v2.05 の表示/動作 LightBox (v2.05) LightBox v2.05
検索エンジン Google 「グーグル」 「ググる」や「グーグル先生」と呼ばれ、インターネットで探し物なら Google が、目的のWEBサイトを見つけてくれる。 Googleで検索してみよう http://www.google.co.jp/ Google 便利検索 一発で簡単検索 例えば、自力でお店のホームページを作るのに、まずはデジカメを選びたい場合、 デジカメと言う単語(単キーワード)をタイプして検索ボタンをクリックすると、 「デジカメ」に関する優秀なウェブサイトが上位表示されますが、 多すぎてお目当てのデジカメを見つけるには時間が掛かりそうなので もう少し、絞って複合検索してみます。カシオのデジカメを探したい場合、 カシオ デジカメと空スペースで区切って複合検索(AND検索)。 3つでも4つでも目的のキーワードを複合させるところがポイントです。 カシオかパナソニックのどちらか表示す
初心者でも簡単作成 Webサイト(ホームページ) パソコン インターネットの勉強、情報 NetyaSun メールの不達問題。迷惑メールにならない為にSPF,DKIM 独自ドメインのメールが相手に届かない事があるりますが、 商用サイトの独自ドメインでも1%程度は不達になるとも云われています。 (但し、発信元が原因で数十%もの高確率で不達になる場合もあるようです) 迷惑メールの学習フィルタに掛かり遮断されたり、迷惑メールフォルダに振り分けられたり、 原因は様々ありますが、大事なメールが高確率で届くように出来る範囲で自己対策をしましょう。 迷惑メールになってしまう原因 メール自体に問題(メール内のキーワードや添付ファイルの数量や容量規制) サーバやソフトの学習フィルタで認定 運営しているサーバ自体がスパムサーバ(ブラック)に認定 過去にスパム業者の所持していた中古ドメイン 別経由のメール 例えば
HTML,CSS ホームページの背景色や文字色 (フォントカラー) 色を使うメリット イメージ・デザインの統一、デザイン性の向上、オリジナリティ。 赤字やマーカーと同様で目立たせる。 文字色が浮き出て立体感がでる。 目に優しい色が使える。 画像に合う色を適応。透明化も可能。 色を使うデメリット 背景と文章の同色部分が被ったり、使いすぎると読み難くなる。 目が疲れる場合もある。 青系色はリンクアンカーと間違える。 色名にオンマウス(onmouseover)、カーソルで背景色が変更(要ワイド画面) W3C標準 基本16色 10進数 例: rgb(255,0,0)
初心者でも簡単作成 Webサイト(ホームページ) パソコン インターネットの勉強、情報 NetyaSun JavaScriptを有効/無効にする方法 各ブラウザ別 JavaScript ジャバスクリプトとは、 Sun Microsystems社とNetscape Communications社開発のプロトタイプベース型ウェブブラウザ用スクリプト言語(プログラミング言語。略:JS)。 ウェブサイトの構成はHTML、 デザインはCSS、 対してJavaScriptはコンテンツを動作をさせる為の言語。 画像を動かしたりマウス動作でアラートを出したりボタンでプログラムを便利に動作させますが、JavaScriptでマウスカーソルがハートになったり雪や虫の画像が飛びまわったり、頻繁なアラートや別窓、右クリック禁止などでJavaScriptがジャバに、いやジャマになります・・・。 面倒ですがケースバイケ
初心者でも簡単作成 Webサイト(ホームページ) パソコン インターネットの勉強、情報 NetyaSun Google ウェブマスターツール 登録方法 Google ウェブマスター ツール 登録マニュアル Google ウェブマスター ツール https://www.google.com/webmasters/tools/siteoverview?hl=ja Google ウェブマスターツールとは、 Googleのクロールや検索評価の確認ができるサイトオーナー用の無料ツール。 検索情報を表示してくれたり、不適切なサイト情報を知らせてくれたり、 「SEOツール」と呼ばれるほどの豊富な機能が充実しています。 Google ウェブマスター ツール新規登録手順 Googleアカウントの作成・登録 Googleアカウントのメールを受信 メール文章中の【URI(1)】をクリックしアカウントを有効にする
ホームページ作成 運営、管理、SEO など ホームページ(ウェブサイト)情報 主に、質問された事などを初心者にも分かりやすく、役立つ情報として掲載していきます。 商用サイト(会社、店舗、ネットショップ)から各種団体や個人(趣味)などの ホームページを最小限の費用で制作・公開し、最大限活用てみましょう。 ホームページ作成 メニュー ホームページの作り方 ホームページの作り方 ホームページの作り方 2 WEBサイト 公開 WEBサイト構造,HEAD 見出しや段落 文字の色や大きさ マークアップ(タグ) ボックス 非奨励タグ W3C文法 リンクの設定 テーブル リスト 画像 カラーコード 一覧表 背景画像の表示方法 背景画像 壁紙 枠線 画像枠、影 CSS 配置、調整 サイト構築 キーワード ブログ Seesaa ブログ サーバ 公開設定 独自ドメインの必要性 DNS .htaccess 検索エ
初心者でも簡単作成 Webサイト(ホームページ) パソコン インターネットの勉強、情報 NetyaSun Google Apps MXレコードの設定 ホームページ 作成、運営管理ガイド Google 便利検索 Google 利用ガイド Google ウェブマスターツール Google Apps DNS MX設定方法 この独自ドメインのメールアカウントをGoogleのサーバで使うために、 DNSのMXレコードをGoogleに向ける設定です。 前ページの Google Apps 登録方法にて、 HTMLファイルのアップロードかTXT レコードの変更 などが済み、Googleが所有権を確認するまで少々待ちましょう。 所有権の確認が完了してから次に進みます。 所有権の確認をHTML ファイルをアップロードで設定した場合は、 ネームサーバの指定先のDNS設定でMXレコードを設定します。 ネームサーバ
初心者でも簡単作成 Webサイト(ホームページ) パソコン インターネットの勉強、情報 NetyaSun スーパーリロードとは ブラウザのキャッシュを無視し、強制的にWebサーバーからファイルをダウンロードする方法。 「フルリロード」「強制再読み込み」ともいう。 WEBページや画像などのファイルを編集後、転送・表示で確認すると、 何も変わらず、古いファイルが表示される場合がある・・・ これは速度の向上のため、ブラウザのキャッシュが、前回保存したファイルを表示してしまうからだ。 通常なら、ブラウザの更新ボタン、または、F5キーで更新されるが、 ブラウザキャッシュが強烈に効き過ぎて、再読み込みでも更新されない場合がある。 キャッシュを毎回削除するのも面倒なので、スーパーリロードで読み込んでしまいましょう。 インターネットエクスプローラー IE Windows Internet Explorer
初心者でも簡単作成 Webサイト(ホームページ) パソコン インターネットの勉強、情報 NetyaSun Mozilla Firefoxを軽くする方法 WEB制作者・開発者達に愛されるブラウザMozilla Firefoxですが、 低スペックPCで長時間ヘビーに連続利用するとパソコンが激重になる。メモリリークは? 酷い時には、1秒程度のタイムラグが起きる。この辺がFirefoxの限界かな。 一旦閉じてから再開すれば軽くなりますが、ズルズルと連続使用してしまう。 メモリ食って高速化するは良いが、食い過ぎメタボで重くなり、火狐が狸に化けるようだ・・・ この重さが、Firefoxの唯一の欠点なので、何とか調整して快適に利用したい。 Firefoxの状況・注意点 ダウンロードマネージャ 履歴の消去 再起動ボタン 最小化でメモリ解放 メモリーキャッシュを設定 Back/Forward機能(bfcac
オプション2 textarea オプション2 ※ 重複設定に注意 多量のスペースや改行は自動削除 空行を削除 カンマ前後に空白削除 \n改行⇒カンマ 連続カンマ⇒1個 最後のカンマを削除 カンマ⇒\n改行 全空スペース⇒半角 全空スペース⇒削除 簡易制作した個人用ツール(作者環境用の仕様)ですが、 SyntaxHighlighterとカンマ区切り用に少々改良して公開。 (改行コードは、あえて\r,\nで分けずに\nで書き出し) チェックボタンも優先順まで考慮していないので、 オプションを上手く利用し自己責任で動作や変換結果の確認を! SyntaxHighlighter <!-- HTML HEAD --> <script type="text/javascript" src="scripts/shCore.js"></script> <script type="text/javascr
HTML,CSS,JS,Perl,PHPなどの各ソースコードをWebサイト上に綺麗に再現。 NetyaSun ソースコード表示 ホームページ 作成、運営、管理ガイド 行番号や各行背景色で見やすい ソースコード ビュー ライブラリ SyntaxHighlighter エディタのようにWebサイト上に綺麗にソースコードを表示する方法。 ソースを書くプロ達や未来の開発者のための学びの場である HTML,CSS,JS,Perl,PHPなどのマニュアル・解説サイトなどで、 PREソースコードを行頭番号付きでカッコよく表示するソース ビューア SyntaxHighlighter SyntaxHighlighter:Download ソース上にオンマウスで の操作タブがソースの右上に表示されるようになった。 ソースを別窓ビュー表示したりクリップボードに保存や印刷も可能な優れものです。 <?xml ve
初心者でも簡単作成 ウェブサイト(ホームページ) パソコン インターネットの情報 NetyaSun ホームページの枠や影 表示・設置方法 HTML,CSS ホームページの枠線 HTML,CSS,border 画像やオブジェクト、表の枠線は、HTMLのborder属性で太さや表示設定も出来ますが、 ボックスの枠線なども合わせ、CSS border で設定しましょう。 背景画像を隙間に表示させて枠のように表現する事もできます。 borderの各プロパティは、各上下左右に対して、太さ・スタイル・色の指定が可能。 全ての各要素に指定可能で、ウェブサイトデザインでは良く利用されるプロパティです。 border-width : ; border-width : ; の : ; 内に太さを指定 border-style : ; border-style : ; の : ; 内にスタイルを指定 borde
HTML,CSS 背景画像の保存・表示方法 画像の保存方法 目的の背景画像を右クリックして「名前を付けて画像を保存」 画像にマウスカーソルを当てる右クリック名前を付けて画像を保存 フォルダを選択名前を変更しても良い保存 画像の表示方法 (画像名が b001.gif の例) background属性での記述(<body background=" ">)は非奨励属性なので、 CSS (style属性,style要素,link要素 の各方法)で記述。 <body style="background-image: url(***.gif);"> body{ background-image: url(***.gif);} /* CSS */ url(***.gif) の( )内は、画像パスを適切に記述する事。 画像が表示されない場合 背景画像の表示方法 を読んで再設定。 それでも、画像が表示されな
TITLE タイトル SEO的にも文字化け防止の意味でも文字コードの次に記述したいのが、title です。 <title></title> <title> と </title> の間にタイトルを記入します。 例1:<title>HEADのTITLE設定 WEBサイトの作り方</title> 例2:<title>HTML構造とHEAD内の設定 - ホームページ作り方</title> まずは、30全角未満で、そのぺージに見合ったタイトル(余裕があればメインのサイトタイトルも)で、 文の切れ目で空スペースを入れる(または、 - , | などで区切る)。 ブラウザのタイトルバーに表示されたり「お気に入り」の登録名になったり 検索結果のタイトルに表示されたり検索エンジンの最重要キーワードになります。 短か過ぎず長過ぎず、各ページ毎に各タイトルを設定する事。 タイトルを見てクリック(訪問)するユーザー
このページを最初にブックマークしてみませんか?
『ホームページ 作成、運営、管理ガイド』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く