Thiết kế web cơ bản ppt

Chúng tôi sẽ minh họa tại sao một website [...] Mẹo thiết kế web Để giúp những các bạn mới bắt đầu học thiết kế web, tôi đã viết ra một danh sách các điều nên làm trong thiết kế web và h

Thiết kế web cơ bản

1 Nguyên tắc thiết kế

Nguyên tắc thiết kế

Nguyên tắc thiết kế: Làm thế nào để tạo ra một trang web thân thiện, dễ sự dụng, trang web phải có nguyên tắc về màu sắc, cầu trúc, quản trị

11 bí quyết để tạo ra một web thật hấp dẫn!

Một website muốn thu hút được người xem đồng thời giữ được sự quan tâm của những người này phải hấp dẫn và dễ sử dụng Điều này nghe có vẻ đơn giản nhưng thực tế, chúng ta rất hay [ ]

Làm thế nào để có 1 website ?

Để có một website bạn phải tiến hành những bước sau Bước 1: Đăng ký tên miền xay dung websiteTên miền (Domain name) là một tên dễ nhớ để gán cho một địa chỉ trên internet, thí dụ: www.business.com Nó thay [ ]

Domain name và web Hosting là gì?

Tên miền (Domain name) là định danh của website trên Internet Tên miền thường gắn kèm với tên công ty và thương hiệu của doanh nghiệp Tên miền là duy nhất và được cấp phát cho chủ thể nào đăng [ ]

Sự khác biệt web Tĩnh & web Động

Tìm hiểu về web Tĩnh & web Động web tinh & web dong- Website tĩnh là website chỉ bao gồm các trang web tĩnh và không có cơ sở dữ liệu đi kèm - Web động là thuật ngữ được dùng để [ ]

Website là gì

website Hẳn ngôi nhà là thứ rất gần gũi với bạn ! Và để nói về một căn hộ sẽ không có gì khó khăn cho việc hình dung của bạn Chúng tôi sẽ minh họa tại sao một website [ ]

Mẹo thiết kế web

Để giúp những các bạn mới bắt đầu học thiết kế web, tôi đã viết ra một danh sách các điều nên làm trong thiết kế web và hy vọng sẽ giúp bạn tạo ra trang web thật thiết thực [ ]

Làm thế nào để thiết kế một trang web hấp dẫn, thân thiện với người dùng

Có vài điều quan trọng hơn trên trang web hơn "tiện ích", bởi vì Internet là một tương táckhông gian và không phải một cách đường phố Bạn muốn cải thiện kinh nghiệm của người truy cập, làm cho [ ]

Thiết kế web, các trang web liên quan đến vô số các môn có tay nghề cao từ các loại hình

để bố trí & màu sắc Màu sắc nổi bật, đặc biệt là vì nó cung cấp các ấn [ ]

Mẫu website doanh nghiệp

Mẫu website thiết kế cho doanh nghiệp với đầy đủ các tính năng hội tụ [ ]

2

Mẫu web tin tức

Web giới thiệu SP

Mẫu website phong cách số

Mẫu website thời trang

Mẫu web điện thoại

Mẫu website salon auto

Hướng dẫn HTML

Hướng dẫn sử dụng HTML từ cơ bản đến phức tạp Chúc các bạn học tập thật tốt Các bạn download tài liệu, mẫu HTML cơ bản

Bảng màu mã HEX và tên màu trong HTML

Color Name Color HEX Color AliceBlue #F0F8FF AntiqueWhite #FAEBD7 Aqua

#00FFFF Aquamarine #7FFFD4 Azure #F0FFFF Beige #F5F5DC Bisque #FFE4C4 Black #000000 BlanchedAlmond #FFEBCD Blue #0000FF BlueViolet #8A2BE2 Brown

#A52A2A BurlyWood #DEB887 CadetBlue #5F9EA0 Chartreuse #7FFF00 Chocolate

#D2691E Coral #FF7F50 CornflowerBlue #6495ED Cornsilk #FFF8DC [ ]

Kiểu font chữ trong html

Diễn giải Các thẻ kiểu chữ trong ngôn ngữ HTML cho phép bạn điều khiển được vẻ bề ngoài của bản thân các ký tự - chẳng hạn chúng ta có thể định dạng một từ là đậm hoặc nghiêng [ ]

Khối trích dẫn HTML

Diễn giải Khối trích dẫn thường được dùng trong các trường hợp sử dụng các trích dẫn

mở rộng Toàn khối trích dẫn sẽ được căn lề thụt vào cả ở hai phía và tạo thành một khối riêng so với [ ]

Ký tự định dạng trước trong HTML

Diễn giải Kiểu ký tự định dạng trước cho phép bạn có thể bảo toàn các dấu cách và dấu xuống dòng trong trang văn bản HTML y như khi bạn gõ vào trong quá trình soạn thảo Điều đó [ ]

Danh sách trong html (list)

Danh sách có trật tự Danh sách có trật tự tự động đánh số từng thành tố của danh sách

Mã nguồn Kết quả <OL> <LI>Yếu tố 1 <LI>Yếu tố 2 <LI>Yếu tố 3 </OL> 1 Yếu tố 1

2 Yếu [ ]

Đường kẻ ngang HTML

Diễn giải Đường kẻ ngang chủ yếu được dùng để phân định một trang Web thành những phần có tính logic và dễ nhìn Có không nhiều khả năng đồ hoạ trong ngôn ngữ HTML, bởi vậy đường kẻ ngang [ ]

Xuống dòng và chia đoạn trong trang HTML

Khi bạn đánh máy một văn bản trong một chương trình soạn thảo văn bản nào đó, bạn có thể chỉ cần bấm phím Return để kết thúc một dòng hay một đoạn văn, nhưng bạn sẽ cần phải làm [ ]

Chèn hình trong HTML

Nếu bạn muốn Web site của mình nổi trội hơn, bạn phải theo xu hướng đồ hoạ với các hình ảnh được chọn kỹ lưỡng Làm thế nào để chèn hình vào trong khi các tập tin HTML chỉ có [ ]

Làm việc với các liên kết siêu văn bản (HTML)

Thẻ HTML dùng để thiết lập các liên kết siêu văn bản là <A> và </A> Thẻ <A> hơi khác so với các thẻ khác mà bạn đã gặp vì bạn không thể dùng nó một mình mà phải kèm[ ]

Bổ sung định dạng và các tiêu đề trong html

HTML bao gồm nhiều thẻ làm đẹp cho văn bản trong trang Bạn đã thấy ở trên, một từ hoặc một câu sẽ hiện thành dạng chữ đậm như thế nào khi được đặt vào giữa các thẻ <B>

và [ ]

Văn bản và các đoạn trong HTML

Thẻ HTML dùng để thiết lập các liên kết siêu văn bản là <A> và </A> Thẻ <A> hơi khác so với các thẻ khác mà bạn đã gặp vì bạn không thể dùng nó một mình mà phải kèm[ ]

Cấu trúc cơ sở HTML

Các trang Web khác nhau, tẻ nhạt hay sinh động, vô nghĩa hoặc rất cần thiết, nhưng tất cảđều có cùng một cấu trúc cơ sở, nên đa số các trình duyệt đang chạy trên hầu hết các kiểu[ ]

Dữ liệu HTML được xác định bởi yếu tố HTML Các yếu tố HTML HTML là một yếu tốtất cả mọi thứ từ các từ khóa bắt đầu vào cuối từ khóa: Bắt đầu từ khóa * Element Cuối nội dung từ [ ]

HTML cơ bản với 4 Ví dụ

Đừng lo lắng nếu các ví dụ sử dụng thẻ bạn chưa biết Bạn sẽ tìm hiểu về chúng trong cácchương kế tiếp HTML Headings (tiêu đề trong HTML) HTML đề mục được định nghĩa với <h1> để <h6> thẻ Ví dụ <h1> Đây [ ]

Bắt đầu với HTML

Bạn cần làm gì với HTML Bạn không cần phải dùng bất kỳ các công cụ để tìm hiểu mã HTML * Bạn không cần bất kỳ HTML nào biên tập * Bạn không cần phải có máy chủ trang web * Bạn không [ ]

Giới thiệu HTML

Ví dụ <html> <body> <h1> Tựa đề đầu tiên của tôi </ h1> <p> đoạn đầu tiên của tôi </ p> </ body> </ html> HTML là gì? HTML là một ngôn ngữ để mô tả các trang web * HTML tắt của Hyper Text Markup Language * HTML không [ ]

Bản đồ hình ảnh trong HTML

Một bản đồ hình ảnh chỉ là một loại hình ảnh nhấp, mà bạn có thể thực hiện các lĩnh vực khác nhau để có liên kết đến các URL khác nhau (Ví dụ là dưới đây.) Để thực hiện [ ] Hướng dẫn CSS

Hướng dẫn viết code CSS, kết hợp CSS vào trang web để tạo cho trang web mêm mại vớicác vidu HTML & CSS

Cách đặt các lớp trong Css: Layers

CSS hoạt động trên cả 3 chiều: cao, rộng, sâu Hai chiều đầu tiên, chúng ta đã được nhìn thấy trong các bài học trước Trong bài học này, chúng ta sẽ được học về cách đặt các thành phần [ ]

Position :Relative position (Định vị tương đối)

Sự định vị tương đối cho một thành phần là sự định vị được tính từ vị trí gốc trong tài liệu Các thành phần đã được định vị tương đối sẽ để lại khoảng không trong tài liệu Các [ ]

Position: Absolute position (Định vị tuyệt đối)

Định vị tuyệt đối là sự định vị mà trong đó các thành phần được định vị không để lại bất

cứ một khoảng trống nào trong tài liệu Một thành phần được định vị tuyệt đối sẽ nhận giá [ ]

Position: nguyên lý hoạt động của position

Kết hợp với thuộc tính float đã học, thuộc tính position mang lại nhiều khả năng để tạo một cách trình bày tiên tiến và chính xác cho trang web Nguyên lý hoạt động của

position: Hãy tưởng tượng cửa sổ [ ]

Thuộc tính clear

Đi cùng với thuộc tính float, trong CSS còn có một thuộc tính là clear Thuộc tính clear làmột thuộc tính thường được gán vào các phần tử liên quan tới phần tử đã được float để quyết định [ ]

Thuộc tính float

Float (theo như nghĩa tiếng Việt là thả trôi) là một thuộc tính CSS dùng để cố định một thành phần web về bên trái hay bên phải không gian bao quanh nó Đây là một thuộc tính rất cần [ ]

Height và những thuộc tính của nó

Trong bài học này, chúng ta sẽ tìm hiểu thêm về cách dùng thuộc tính height để định kích

cỡ cho một thành phần web Thuộc tính height: Height là một thuộc tính CSS dùng để quy định chiều cao cho [ ]

Width và những thuộc tính của nó

Trong bài học này, chúng ta sẽ tìm hiểu thêm về cách dùng thuộc tính width để định kích

cỡ cho một thành phần web Thuộc tính width: Width là một thuộc tính CSS dùng để quy định chiều rộng cho một [ ]

Nhóm các phần tử với class

Ví dụ chúng ta có một đoạn mã HTML sau đây : <p>Danh Sách Các Tỉnh, Thành Phố Của Việt Nam</p> <ul> <li>Hà Nội</li> <li>TP Hồ Chí Minh</li> <li>Đà Nẵng</li>

<li>Thừa Thiên Huế</li> <li>Khánh Hòa</li> <li>Quảng Ninh</li> <li>Tiền Giang</li>

</ul> Yêu cầu đặt ra là làm thế nào để tên [ ]

Hướng dẫn CSS

Hướng dẫn viết code CSS, kết hợp CSS vào trang web để tạo cho trang web mêm mại vớicác vidu HTML & CSS

Dùng Css để định border cho các đối tượng web

Border là một thành phần quan trọng trong một trang web Nó thường được dùng trong trang trí, đóng khung cho một đối tượng cần nhấn mạnh, phân cách các đối tượng giúp trang web trông dễ nhìn hơn,… Trong [ ]

Như tất cả những ai đã học qua MS Word đều biết là trong phần thiết lập Page Setup của Word cũng có một thiết lập margin để định lề cho trang in Tương tự, thuộc tính margin trong CSS [ ]

Pseudo-classes For Links

Một thành phần rất quan trọng trong mọi website chính là liên kết.Cũng như một đối tượng văn bản thông thường, chúng ta hoàn toàn có thể áp dụng các thuộc tính định dạng

đã học ở 2 bài trước [ ]

Box Model

Trong CSS, box model (mô hình hộp) mô tả cách mà CSS định dạng khối không gian baoquanh một thành phần Nó bao gồm padding (vùng đệm), border (viền) và margin (canh lề) và các tùy chọn Hình bên [ ]

Thuộc tính text-align

Thuộc tính text-align giúp bạn thêm các canh chỉnh văn bản cho các thành phần trong trang web Cũng tương tự như các lựa chọn canh chỉnh văn bản trong các trình soạn thảo văn bản thông dụngnhư MS Word, thuộc [ ]

Thuộc tính text-transform

Text-transform là thuộc tính qui định chế độ in hoa hay in thường của văn bản mà không phụ thuộc vào văn bản gốc trên HTML Thuộc tính này có tất cả 4 giá trị: uppercase (in hoa), lowercase (in thường), [ ]

Nhóm khối phần tử với thẻ (div)

Cũng như <span>, <div> cũng là một thẻ trung hòa và được thêm vào tài liệu HTML với mục đính nhóm các phần tử lại cho mục đích định dạng bằng CSS Tuy nhiên, điểm khác biệt là <span> dùng [ ]

Thuộc tính text-decoration

Thuộc tính text-decoration giúp bạn thêm các hiệu ứng gạch chân (underline), gạch xiên (line-through), gạch đầu (overline), và một hiệu ứng đặc biệt là văn bản nhấp nháy (blink) Ví dụ sau chúng ta sẽ định dạng gạch chân cho [ ]

Màu chữ (thuộc tính color)

Để định màu chữ cho một thành phần nào đó trên trang web chúng ta sử dụng thuộc tính color Giá trị của thuộc tính này là các giá trị màu CSS hỗ trợ Ví dụ sau chúng ta sẽ viết [ ]

Nhóm phần tử với thẻ (span)

Thẻ <span> trong HTML thật ra là một thẻ trung hòa, nó không thêm hay bớt bất cứ một thứ gì vào một tài liệu HTML cả Nhưng chính nhờ tính chất trung hòa này mà nó lại là một [ ]

Nhận dạng phần tử với id

Cũng với đoạn HTML như ví dụ về class Nhưng yêu cầu đặt ra là Hà Nội sẽ có màu đỏ sậm, TP Hồ Chí Minh màu đỏ, Đà Nẵng màu đỏ tươi còn các tỉnh màu xanh da trời [ ]

Thuộc tính font-variant (Font chữ)

Thuộc tính font-variant được dùng để chọn giữa chế độ bình thường và small-caps của một font chữ Một font small-caps là một font sử dụng chữ in hoa có kích cỡ nhỏ hơn in hoa chuẩn để thay thế [ ]

Thuộc tính font-weight (Font chữ)

Thuộc tính font-weight mô tả cách thức thể hiện của font chữ là ở dạng bình thường (normal) hay in đậm (bold) Ngoài ra, một số trình duyệt cũng hỗ trợ mô tả độ in đậm bằng các con số [ ]

Thuộc tính font-style (Font chữ)

Thuộc tính font-style định nghĩa việc áp dụng các kiểu in thường (normal), in nghiêng (italic) hay xiên (oblique) lên các thành phần trang web Trong ví dụ bên dưới chúng ta sẽthử thực hiện áp dụng kiểu in nghiêng [ ]

Thuộc tính font-family (font chữ)

Thuộc tính font-family có công dụng định nghĩa một danh sách ưu tiên các font sẽ được dùng để hiển thị một thành phần trang web Theo đó, thì font đầu tiên được liệt kê trong danh sách sẽ được [ ]

Định vị ảnh nền (thuộc tính background-position)

Theo mặc định ảnh nền khi được chèn sẽ nằm ở góc trên, bên trái màn hình Tuy nhiên với thuộc tính background-position bạn sẽ có thể đặt ảnh nền ở bất cứ vị trí nào (trong không gian của [ ]

Background-attachment là một thuộc tính cho phép bạn xác định tính cố định của ảnh nền

so với với nội dung trang web Thuộc tính này có 2 giá trị: + scroll: Ảnh nền sẽ cuộn cùng nội dung trang web, [ ]

Đơn vị css

Trong CSS2 hỗ trợ các loại đơn vị là đơn vị đo chiều dài và đơn vị đo góc, thời gian, cường độ âm thanh và màu sắc Tuy nhiên, sử dụng phổ biến nhất vẫn là đơn vị đo [ ]

Lặp lại ảnh nền (thuộc tính background-repeat)

Nếu sử dụng một ảnh có kích thước quá nhỏ để làm nền cho một đối tượng lớn hơn thì theo mặc định trình duyệt sẽ lặp lại ảnh nền để phủ kín không gian còn thừa Thuộc tính background-repeat [ ]

Thiết kế bố cục trang web layout với thẻ div

Để tăng sự mềm dẻo cho trang web, hiện nay người ta đang cố gắng loại bỏ các table khi thiết kế layout, thay vào đó là div và css Dưới đây là 1 ví dụ đơn giản giúp dân [ ]

Cú pháp Css

Để tìm hiểu cú pháp CSS chúng ta hãy thử xem một ví dụ sau Ví dụ: Để định màu nền cho một trang web là xanh nhạt (light cyan) chúng ta dùng code sau: + Trong HTML:

<body bgcolor=”#00BFF3”> [ ]

Ảnh nền (thuộc tính back gound-image)

Việc sử dụng ảnh nền giúp trang web trông sinh động và bắt mắt hơn Để chèn ảnh nền vào một thành phần trên trang web chúng ta sử dụng thuộc tính background-image Bây giờ chúng ta sẽ cùng làm một [ ]

Màu nền (thuộc tính Background-color)

Thuộc tính background-color giúp định màu nền cho một thành phần trên trang web Các giá trị mã màu của background-color cũng giống như color nhưng có thêm giá trị

transparent để tạo nền trong suốt Ví dụ sau đây [ ]

Sự ưu tiên trong Css

Trước khi thực thi CSS cho một trang web Trình duyệt sẽ đọc toàn bộ CSS mà trang web

có thể được áp dụng, bao gồm: CSS mặc định của trình duyệt, file CSS bên ngoài liên kếtvào trang [ ]

Css là gì?

Trong lĩnh vực xây dựng, chúng ta có trang trí nội thất; trong lĩnh vực thẩm mỹ - làm đẹp, chúng ta có kỹ thuật make-up; còn trong lĩnh vực thiết kế web chúng ta có CSS Đâychỉ là [ ]

CSS cho web ba cột với tiêu đề web – định vị chính xác

Một trang web phổ biến giữa các nhà thiết kế bố trí được bố trí 3 cột Nó cho phép rất nhiều tính linh hoạt cho các nội dung trình bày Nó thường được dùng để bổ sung các liên[ ]

Ví dụ đơn giản về dấu nháy đôi CSS

1 Mã nguồn HTML Bắt đầu với một blockquote và một số văn bản <blockquote> Xin chào, Tôi là một đôi báo giá </ blockquote> 2 Ghi rõ blockquote Blockquote yếu tố xác định như sau: blockquote ( Phông chữ: 1.2em/1.6em Georgia, "Times New Roman", [ ]

Lập trình web bằng PHP

Tối ưu hóa mã nguồn PHP

Trong những năm gần đây, PHP đã trở thành một trong những ngôn ngữ phổ dụng nhất trong lập trình ứng dụng web Ưu điểm của PHP là mã nguồn mở, miễn phí và không yêucầu cấu [ ]

Thêm virtual host với Xampp

Bài này dành cho Newbie PHP Các bạn mới vọc PHP thường sử dụng bộ cài tích hợp Apache-Php-Mysql Xampp trên nền Windows Thông thường thư mục đặt các file PHP của bạn là C:\xampphtdocs Để chạy bạn gõ liên kết quen thuộc [ ]

PHPMass Real Estate – code php làm site về bất động sản

PHPMass Real Estate – code php làm site về bất động sản Đăng ngày 10 June 2009 bởi admin The PHPMass Real Estate is a software package used by real estate companies to promote properties It is extremely easy to use but full [ ]

Kết nối PHP với SQL 2000 và Access

Nếu bạn dùng DSN (Data Source Name) để quản lý database cần truy xuất thì đoạn lệnh PHP kết nối và truy xuất database do SQL2000 hay Access XP quản lý là giống y nhau,

có nghĩa là đoạn code [ ]

Tự Học PHP Qua Ví Dụ

CÚ PHÁP CĂN BẢN Trang PHP là 1 trang HTML có nhúng mã PHP Để minh hoạ cho điều này, ta hãy xem qua một số ví dụ sau: Ví dụ 1: lưu file sau lên đĩa với tên vd1.php

và chạy thử: htmlheadtitleTesting [ ]

Xây dựng 1 simple text editor

Chào các bạn Một số bạn không thích dùng rich text editor cho lắm, nên họ sẽ dùng simple text editor thay thế vì nó đơn giản hơn, và được các trình duyêt hỗ trợ nhiều hơn Dùng CSS để đinh [ ]

Các bước để chuyển domain sang một nhà cung cấp mới

Trong thời gian gần đây ngoài những việc nên làm để bảo vệ tên miền, có nhiều người lo ngại tên miền bị “tên tặc” chôm (domain hijacking) và thắc mắc các bước để tên miền được chuyển đến nhà [ ]

Mở rộng nền file ảnh bằng lệnh Canvas Size trong

photoshop

Cho phép chúng ta mở rộng size hình nhưng vẫn giữ nguyên kích thước phần ảnh gốc Chọn lệnh từ Menu : Image\Canvas Size sẽ xuất hiện hộp thoại canvas A: kích thước củafile ảnh hiện hành B : Bấm vào một [ ]

Đếm số lượng hits trên trang

Ở bài trước Tự làm bộ đếm bằng PHP đã trình bày cách làm bộ đếm rồi nhưng dưới đây xin trình bày cách làm khác và được viết thành hàm để tiện cho sử dụng CODE:

function showCounter() { $filename = "123456789counter123456789

Hàm Trong PHP

Hàm là khối mã có thể được thi hành bất cứ khi nào chúng ta cần nó Tạo Hàm PHP : * tất cả hàm bắt đầu với từ "function()" * tên hàm - nó nên khả dĩ để hiểu những gì chức [ ]

Lập trình PHP bằng công nghệ template