Các ký tự không được dùng để đặt tên file

Một new coder khôn cùng hay lo sợ trong câu hỏi đặt tên file, id tuyệt tên class. Cho nên vì vậy trong nội dung bài viết này, tôi mong mỏi tổng hợp những quy tắc, những bí kíp đặt tên cơ phiên bản cho từng trường hợp trên. Hi vọng tài liệu này sẽ giúp đỡ chúng ta phần làm sao trong quá trình làm việc.

Bạn đang xem: Các ký tự không được dùng để đặt tên file

CÁC ĐỀ MỤC PHỔ THÔNG

Những điểm chú ý khi đánh tên file, thương hiệu id, class

Chúng ta sẽ bắt đầu từ việc mày mò về rất nhiều điều cần chú ý khi khắc tên file, id, class. Đây là những chú ý hết sức đối kháng giản, hãy nhằm tâm tới các điều này khi đặt tên nhé.

_1.Chỉ sử dụng ký tự chữ số hay _

Không được sử dụng tiếng Nhật, số, ký kết hiệu dạng in hoa, chữ katakana bé.

2.Chỉ thực hiện ký hiệu gạch men nối 「-」, gạch chân dưới 「」_

Trong Window, quan yếu sử dụng các ký hiệu sau để tại vị tên file: cam kết hiệu tiền im 「¥」, gạch chéo cánh 「/」, vết hai chấm 「:」, vệt hoa thị 「*」, vệt hỏi chấm 「?」, vết ngoặc kép 「”」, dấu nhỏ tuổi hơn 「」, dấu sổ dọc 「|」. Ngoài ra ký hiệu trên, họ cũng tránh việc dùng rất nhiều ký hiệu dễ làm cho lỗi, bị xử trí sai trên chương trình.

3.Không nên sử dụng chữ dựa vào vào model

Cũng y hệt như ký hiệu, tránh thực hiện chữ phụ thuộc vào model để tránh gây ra lỗi.

4.Không sử dụng space ( cả space rộng với hẹp)Trường thích hợp tên file đựng space thì file đó rất có thể sẽ ko được xử lý chủ yếu xác. Còn giả dụ tên id, thương hiệu class gồm chứa space thì khối hệ thống sẽ tự mặc định đó là một id, class riêng lẻ khác.

5.Tên nên phải bước đầu bằng chữ ( ko được bắt đầu bằng số)

Nếu thương hiệu id, thương hiệu class bước đầu bằng số thì sẽ không còn đọc được trên hệ thống, cùng không được chấp nhận.

6.Thống nhất là tên gọi file toàn bộ đều dùng chữ thường

Ví dụ giải pháp đặt tên sau là ko đúng

textfile.gif

¥¥text.gif

img text

500px

Ngoài ra trong bài viết này đã thống độc nhất là dùng dấu gạch chân nhằm ngắt quãng khi để tên file, và đối với đặt thương hiệu id, tên class thì đang dùng cách thức Lower Camel ( tức là sẽ viết hoa chữ cái thứ nhất của từ thiết bị hai trở đi※)

※ Ví dụ: dạng indexTest

TẬP HỢP TÊN tệp tin ẢNH

Quy tắc cơ bản

Về cơ bản chúng ta nên được sắp xếp tên ráng nào cho hợp lý? Hãy thuộc xem các ví dụ tiếp sau đây để hiểu rõ hơn về những quy tắc cơ bản khi đặt tên:

index_img01.jpg

header_bg01.jpg

news_ttl01.png

page_ttl01.png

btn_square_over.gif

icon_triangle.gif

nav_index_over.png

Các tên sinh hoạt trên là được đặt dựa vào quy tắc sau:

「Tên page」「vùng miền」「chủng loại:bắt buộc」「chi tiết」「ký hiệu (serial number)」「trạng thái」「đuôi mở rộng」.

Mỗi phần tử sẽ biện pháp nhau bởi dấu gạch bên dưới 「_」

Tiếp theo tôi sẽ lý giải về từng thành phần trong tên file.

1.「Tên page」

Vai trò của phần này đó là chỉ ra được ta đang thực hiện page nào. Tuy nhiên phần này sẽ không quan trọng trong trường phù hợp folder ảnh được chia theo từng page.

Ví dụ:

Trường đúng theo folder ảnh không được chia theo từng page (/img/) > index_news_bg01.gif

Trường phù hợp folder hình ảnh được phân tách theo từng page (/img/index/) > news_bg01.gif

2.「vùng miền」

Phần này cho thấy thêm là họ đang thực hiện ở vùng nào địa chỉ nào. Mặc dù phần này đã không quan trọng trong trường vừa lòng file ảnh không nằm trong vùng như thế nào cả.

Trường phù hợp background thực hiện thông tin tiên tiến nhất > news_bg01.jpg

Trường hợp hình ảnh sử dụng tại sidebar > side_img01.jpg

3.「chủng loại」

Phần này giúp họ biết được hình ảnh đang áp dụng là thuộc loại nào. Một khi sẽ có tin tức loại hình ảnh thì họ phải thêm tin tức đó vào vào tên file ảnh.

Ví dụ:

File hình ảnh > img01.jpg

Trường thích hợp logo ảnh được thực hiện tại header > header_logo.gif

4.「chi tiết」

Ví dụ:

Trường hòa hợp nút send > btn_submit.png

Trường hòa hợp icon tròn > icon_circle01.png

5.「ký hiệu (serial number)」

Trong trường hợp sử dụng nhiều hình ảnh thì phải dùng ký hiệu nhằm phân biệt. Bây giờ ký hiệu sẽ phải là serial number.

Ví dụ:

Ảnh A dùng ở đứng đầu page > index_img01.jpg

Ảnh B cần sử dụng ở top page > index_img02.jpg

6.「trạng thái」

Được thực hiện trong ngôi trường hợp cần nêu rõ trạng thái ví như roll over hay current.

Ví dụ:

Trường hợp hình ảnh được cần sử dụng tại global navi > nav_index_out.png,nav_index_over.png

Trường hợp hình ảnh global navi diễn đạt vị trí lúc này là page index(※) > nav_index_over.png

Ảnh sử dụng cho màn hình hiển thị Retina > img_index_retina.png

Trường vừa lòng website đã làm được responsive, và ảnh chỉ sử dụng trên màn hình điện thoại cảm ứng thông minh > img_index_sp.png

(※) Về mặt ý nghĩa sâu sắc thì current là thiết yếu xác, tuy nhiên có khá nhiều trường hợp ảnh đang được bỏ ra định là current tuy nhiên lại được hướng đẫn thành dạng tương tự là over cho nên vì thế dùng over để tránh vấn đề 1 hình ảnh mà được tạo thành 2 lần.

Xem thêm: Có Cách Làm Người Yêu Quan Tâm Mình Hơn : 15 Bước, Làm Thế Nào Để Người Yêu Quan Tâm Đến Mình Hơn

Nếu bảo đảm những quy tắc đánh tên trên đây thì sẽ có được những tiện ích sau:

Chỉ cần dựa vào tên file, hoàn toàn có thể suy đoán được hình ảnh thuộc nhiều loại nào.

Chỉ yêu cầu nhìn tên file ảnh là biết được ảnh được sử dụng ở đâu.

Bằng việc đặt tên hình ảnh mang ý nghĩa cấu trúc của ảnh, thì của cả sau này còn có thay đổi ảnh đi chăng nữa thì không cần biến đổi tên hình ảnh mà vẫn có thể update được.

Những điểm cần chăm chú khi để tên

Ngoài phần đa quy tắc cơ bản trên, còn có những điểm cần để ý khi đánh tên như sau:

1.Trường hợp sử dụng tại vùng miền quánh biệt, thì tên vùng miền xuất hiện thêm trong tên file ảnh

Ví dụ:

Trường thích hợp sử dụng ảnh đặt sinh sống tiêu đề > index_ttl01.gif

Trường hợp hình ảnh dùng trên background của header > header_bg.gif

2.Trường hợp bao gồm nhiều hình ảnh dùng nghỉ ngơi tiêu đề hoặc nhiều ảnh chụp thì đề nghị dùng serial number để tại vị tên

Ví dụ:

Trường hợp hình ảnh dùng sinh hoạt tiêu đề của đứng đầu page > index_ttl01.png

Trường thích hợp dùng ảnh của blog page > blog_img01.jpg

3.Tại một thành phần mà áp dụng nhiều hình ảnh thì cần dùng serial number để tại vị tên

Ví dụ:

Sử dụng hai ảnh tại background của header > header_bg 01.gif, header_bg 02.jpg

4.Trường vừa lòng cùng cỗ phận, cùng selector nhưng cần sử dụng các ảnh khác nhau, thì ngay sau tên cỗ phận, đề nghị gắn serial number vào.

Ví dụ:

Dùng ảnh background tại tiêu đề A > ttl_bg01.gif

Dùng hình ảnh background trên tiêu đề B > ttl_bg02.gif

5.Với những ảnh dùng trong roll over, thì sử dụng dấu gạch men chân để chia cách và dùng hồ hết từ đối chọi thường nhằm thể hiện trạng thái

Thông thường: ○○_out.png

Roll over: ○○_over.png

Trạng thái lựa chọn ※1 ○○_selected.png

Vị trí lúc này ※2 ○○_current.png

Ví dụ:

btn_contact_out.png

btn_contact_over.png

nav_news_selected.png

nav_news_current.png

※1: cần sử dụng trong ngôi trường hợp ảnh được đăng kí tất cả trạng thái là selected

※2: cần sử dụng trong trường hợp bao gồm cả câu chữ trang tương đương với navi

Tổng hợp các 「chủng loại」

Tổng hợp các quy tắc về chủng loại của ảnh, tiêu đề hay những nút.

「chủng loại」

chủng loạiquy tắc
ảnh, sơ đồimg
thumbnailthumb
bannerbn
buttonbtn
logologo
navinav
tiêu đề ※1ttl
texttxt
iconicon
Background (ngoài background của icon)bg
mũi tênarrow
lineline
pagetop ※2pagetop
spacer ※2spacer
đang loading ※2loading

※1 Những ảnh sử dụng trong phần đề mục (hx) thì không cần gắn thêm tên hx vào làm cho mang tính update hơn ( bởi level của đề mục có thay đổi thì cũng không kéo theo sự biến hóa của tên ảnh)

※2 Vì có nhiều trường thích hợp được sử dụng chủ quyền nên phần lớn quy tắc trên chỉ sử dụng trong 「chủng loại」

Ví dụ:

pagetop > pagetop.gifspacer > spacer.gif

Tổng phù hợp 「vùng miền」

Tổng hợp những quy tắc liên quan đến content hay category

「vùng miền」

vùng, miềnquy tắc
thông tin mới nhấtnews
thông tin liên lạccontact
tổng thể pagecontainer
headerheader
sidebarside
footerfooter
main contentmain
tiếp theonext
trở về trướcprev
thông báoinfo
listlist
chú thíchnotes
box layoutunit,box,col,area

TẬP HỢP TÊN ID, TÊN CLASS

Bây giờ bọn họ sẽ nói về quy tắc đặt tên id, thương hiệu class.

Những điểm lưu ý khi để tên

Tôi xin reviews vài điểm xem xét khi đặt tên id, tên class ( kèm ví dụ cụ thể )

1.Id được áp dụng trong vùng cấu thành lên layout tổng thể và toàn diện ( lấy ví dụ như header, thanh global navi, nội dung, sidebar, footer, section) ,còn class được sử dụng trong vùng miền đưa ra tiết bé dại của số đông vùng toàn diện và tổng thể trên.

Ví dụ:

header > #headerGlobal navi > #gNavNút liên hệ > .btnContactQuay trở lại top page > .pageTop

2.Tên id, thương hiệu class không dựa vào vào phần design, vì vậy cần đặt tên rõ ràng, ko vòng vo, hiển thị rõ yếu tố "ở đâu", " mô tả cái gì"

Ví dụ: bí quyết đặt thương hiệu dưới đấy là không chủ yếu xác

Dòng chú giải phông chữ bé dại hơn text thường thì > .smallComment chữ đỏ > .redBlock phía bên trái > .left

Còn dưới đấy là những bí quyết đặt tên chính xác

Dòng chú giải phông chữ nhỏ dại hơn text thông thường > .notesComment chữ đỏ > .commentBlock phía phía bên trái > .box

Sự khác hoàn toàn giữa hai các ví dụ NG và OK sinh hoạt trên là

Tại trường đúng theo ví dụ NG: vào trường phù hợp màu của cái chú thích biến hóa thì ý nghĩa "nhỏ" của cái chú ưng ý "small" cũng trở nên mất theo.

Thế nhưng, chỉ cần đặt thương hiệu id, thương hiệu class theo chú giải 「notes」, thì ngay cả khi màu sắc có thay đổi đi chăng nữa thì ý nghĩa sâu sắc của 「notes」 cũng vẫn tồn tại đi.

Cùng với lý giải đó, biện pháp đặt tên id, thương hiệu class có tương quan đến design như là 「red」hay「left」sẽ ko được yêu mến lắm.

3.Xét về khía cạnh design, nếu như 1 vùng nào kia không tái hiện lại được thì dịp đó hãy áp dụng inner ( ví dụ khi 2 background ông xã lên nhau)

Ví dụ:

*

Trong ngôi trường hợp hoàn toàn có thể tái hiện tại lại vùng, miền bởi before, after, thì không nên sử dụng inner để không ngày càng tăng thêm đa số vùng không yêu cầu thiết.

4.Gắn thương hiệu id, class có tính đa chức năng cho hồ hết thứ không có ý nghĩa cấu trúc.

Ví dụ:

Box dùng cho layout > boxLayout 2 column > unit2ColLayout 3 column > unit3Col

Tổng phù hợp tên id, tên class rất hấp dẫn dùng

vùng, miềntên id, tên class
tổng thể pagecontainer
headerheader
tiêu đề của sitesiteTtl
logologo
Catchphrasecatch
navigationnav
global navigationgNav
breadcrumb navigationpagePath
content areaconts
main contentmain
sidebarside,sideBar
footerfooter
bài viếtarticle
chủ đềtopic, topics
thông tin chú ýspotLight
chọn lọcpickup
tiếp theonext
trở về trướcpre
đến trang ToppageTop
muốn xem những nữamore
thông báoinfo
tin tứcnews
ngày thángdate
lịch sử updatehistory
listlist
các mụcitem
list các sản phẩmgoodsList
khu vực ảnhphoto,img
khu vực texttxt
khu vực figurefigure
chú thíchnotes
bannerbn
thông tin liên lạccontact, inquiry
bài viếtarticle
ẩn đihidden
quảng cáopr
vị trí hiện tạicurrent
câu leadlead
đề mục đầu tiên,đề mục cuối cùngfirst(đầu tiên), last(cuối cùng), firstChild, lastChild
cột lẻ, cột chẵnodd(số lẻ), even(số chẵn)
box giành cho layoutunit, box, col, area
box phối hợp ở những vùng miền khácbox,area

Mọi người thấy thế nào ạ.

Nếu phần đông người áp dụng những phép tắc trên thì tôi tin có thể sẽ còn ít người lúng túng chạm chán khó khăn trong vấn đề đặt thương hiệu file, thương hiệu id, thương hiệu class.